堆棧內存溢出
  簡體   English   中英

嘗試使用空的 ts 項目初始化 webpack 時出錯

[英]Error trying to init webpack with an empty ts project

 原文  2021-11-09 06:37:38  0   2    typescript/ webpack

問題描述

我是一個 webpack 新手，試圖自己第一次設置它。 安裝必要的包並創建一個空的app.ts ，只有一個console.log('hi'); 我運行 npm run start，webpack 應該可以順利編譯和運行。

但是，我有一大堆的話說的WebPack在多個LIB文件錯誤node_modules不存在。 我重建並仔細檢查了node_modules文件夾，lib 文件確實存在並且只是坐在那里。 所以我對編譯錯誤感到困惑。 看起來很簡單，這些錯誤不是來自我嗎？ 請幫忙？

在此處輸入圖片說明 在此處輸入圖片說明 在此處輸入圖片說明

完整的錯誤信息在這里，如果有幫助的話...

$ npm run build

> demo@1.0.0 build
> webpack

asset bundle.js 655 bytes [compared for emit] (name: main)
./src/app.ts 58 bytes [built] [code generated]
webpack 5.62.1 compiled successfully in 1949 ms


$ npm run start

> demo@1.0.0 start
> webpack-dev-server --stats-error-details

<i> [webpack-dev-server] Project is running at:
<i> [webpack-dev-server] Loopback: http://localhost:8080/
<i> [webpack-dev-server] On Your Network (IPv4): http://192.168.1.138:8080/
<i> [webpack-dev-server] Content not from webpack is served from 'E:\Udemy\typescript\CourseProject\public' directory
asset bundle.js 427 KiB [emitted] (name: main)
runtime modules 26.3 KiB 13 modules
modules by path ./node_modules/ 119 KiB
  modules by path ./node_modules/webpack-dev-server/client/ 52.7 KiB 12 modules
  modules by path ./node_modules/webpack/hot/*.js 3.01 KiB
    ./node_modules/webpack/hot/dev-server.js 1.59 KiB [built] [code generated] 
    ./node_modules/webpack/hot/log.js 1.34 KiB [built] [code generated]        
    ./node_modules/webpack/hot/emitter.js 75 bytes [built] [code generated]    
  modules by path ./node_modules/url/ 37.1 KiB
    ./node_modules/url/url.js 22.8 KiB [built] [code generated]
    ./node_modules/url/node_modules/punycode/punycode.js 14.3 KiB [built] [code generated]
  ./node_modules/ansi-html-community/index.js 4.16 KiB [built] [code generated]
  ./node_modules/html-entities/lib/index.js 7.74 KiB [built] [code generated]
  ./node_modules/events/events.js 14.5 KiB [built] [code generated]
./src/app.ts 58 bytes [built] [code generated]

ERROR in ./node_modules/html-entities/lib/index.js 14:25-54
Module not found: Error: Can't resolve './named-references' in 'E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib'
resolve './named-references' in 'E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib'
  using description file: E:\Udemy\typescript\CourseProject\node_modules\html-entities\package.json (relative path: ./lib)
    Field 'browser' doesn't contain a valid alias configuration
    using description file: E:\Udemy\typescript\CourseProject\node_modules\html-entities\package.json (relative path: ./lib/named-references)      no extension
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib\named-references doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib\named-references.ts doesn't exist
      js
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib\named-referencesjs doesn't exist
      as directory
        E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib\named-references doesn't exist
 @ ./node_modules/webpack-dev-server/client/overlay.js 4:0-39 148:26-32
 @ ./node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&reconnect=10 6:0-57 77:6-10 115:6-10 124:6-10 142:27-40 158:6-10 167:28-41 183:6-10 193:6-10

ERROR in ./node_modules/html-entities/lib/index.js 15:28-60
Module not found: Error: Can't resolve './numeric-unicode-map' in 'E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib'
resolve './numeric-unicode-map' in 'E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib'
  using description file: E:\Udemy\typescript\CourseProject\node_modules\html-entities\package.json (relative path: ./lib)
    Field 'browser' doesn't contain a valid alias configuration
    using description file: E:\Udemy\typescript\CourseProject\node_modules\html-entities\package.json (relative path: ./lib/numeric-unicode-map)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib\numeric-unicode-map doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib\numeric-unicode-map.ts doesn't exist
      js
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib\numeric-unicode-mapjs doesn't exist
      as directory
        E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib\numeric-unicode-map doesn't exist
 @ ./node_modules/webpack-dev-server/client/overlay.js 4:0-39 148:26-32
 @ ./node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&reconnect=10 6:0-57 77:6-10 115:6-10 124:6-10 142:27-40 158:6-10 167:28-41 183:6-10 193:6-10

ERROR in ./node_modules/html-entities/lib/index.js 16:24-52
Module not found: Error: Can't resolve './surrogate-pairs' in 'E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib'
resolve './surrogate-pairs' in 'E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib'
  using description file: E:\Udemy\typescript\CourseProject\node_modules\html-entities\package.json (relative path: ./lib)
    Field 'browser' doesn't contain a valid alias configuration
    using description file: E:\Udemy\typescript\CourseProject\node_modules\html-entities\package.json (relative path: ./lib/surrogate-pairs) 
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib\surrogate-pairs doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib\surrogate-pairs.ts doesn't exist
      js
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib\surrogate-pairsjs doesn't exist
      as directory
        E:\Udemy\typescript\CourseProject\node_modules\html-entities\lib\surrogate-pairs doesn't exist
 @ ./node_modules/webpack-dev-server/client/overlay.js 4:0-39 148:26-32
 @ ./node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&reconnect=10 6:0-57 77:6-10 115:6-10 124:6-10 142:27-40 158:6-10 167:28-41 183:6-10 193:6-10

ERROR in ./node_modules/url/url.js 25:11-28
Module not found: Error: Can't resolve './util' in 'E:\Udemy\typescript\CourseProject\node_modules\url'
resolve './util' in 'E:\Udemy\typescript\CourseProject\node_modules\url'
  using description file: E:\Udemy\typescript\CourseProject\node_modules\url\package.json (relative path: .)
    Field 'browser' doesn't contain a valid alias configuration
    using description file: E:\Udemy\typescript\CourseProject\node_modules\url\package.json (relative path: ./util)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\url\util doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\url\util.ts doesn't exist
      js
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\url\utiljs doesn't exist
      as directory
        E:\Udemy\typescript\CourseProject\node_modules\url\util doesn't exist
 @ ./node_modules/webpack-dev-server/client/utils/parseURL.js 1:0-22 35:16-25
 @ ./node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&reconnect=10 4:0-43 23:26-34

ERROR in ./node_modules/url/url.js 100:18-40
Module not found: Error: Can't resolve 'querystring' in 'E:\Udemy\typescript\CourseProject\node_modules\url'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "querystring": require.resolve("querystring-es3") }'
        - install 'querystring-es3'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "querystring": false }
resolve 'querystring' in 'E:\Udemy\typescript\CourseProject\node_modules\url'
  Parsed request is a module
  using description file: E:\Udemy\typescript\CourseProject\node_modules\url\package.json (relative path: .)
    Field 'browser' doesn't contain a valid alias configuration
    resolve as module
      looking for modules in E:\Udemy\typescript\CourseProject\node_modules\url\node_modules
        single file module
          using description file: E:\Udemy\typescript\CourseProject\node_modules\url\package.json (relative path: ./node_modules/querystring)            no extension
              Field 'browser' doesn't contain a valid alias configuration
              E:\Udemy\typescript\CourseProject\node_modules\url\node_modules\querystring doesn't exist
            .ts
              Field 'browser' doesn't contain a valid alias configuration
              E:\Udemy\typescript\CourseProject\node_modules\url\node_modules\querystring.ts doesn't exist
            js
              Field 'browser' doesn't contain a valid alias configuration
              E:\Udemy\typescript\CourseProject\node_modules\url\node_modules\querystringjs doesn't exist
        E:\Udemy\typescript\CourseProject\node_modules\url\node_modules\querystring doesn't exist
      E:\Udemy\typescript\CourseProject\node_modules\node_modules doesn't exist or is not a directory
      looking for modules in E:\Udemy\typescript\CourseProject\node_modules
        single file module
          using description file: E:\Udemy\typescript\CourseProject\package.json (relative path: ./node_modules/querystring)
            no extension
              Field 'browser' doesn't contain a valid alias configuration
              E:\Udemy\typescript\CourseProject\node_modules\querystring is not a file
            .ts
              Field 'browser' doesn't contain a valid alias configuration
              E:\Udemy\typescript\CourseProject\node_modules\querystring.ts doesn't exist
            js
              Field 'browser' doesn't contain a valid alias configuration
              E:\Udemy\typescript\CourseProject\node_modules\querystringjs doesn't exist
        existing directory E:\Udemy\typescript\CourseProject\node_modules\querystring
          using description file: E:\Udemy\typescript\CourseProject\node_modules\querystring\package.json (relative path: .)
            using description file: E:\Udemy\typescript\CourseProject\package.json (relative path: ./node_modules/querystring)
              no extension
                Field 'browser' doesn't contain a valid alias configuration
                E:\Udemy\typescript\CourseProject\node_modules\querystring is not a file
              .ts
                Field 'browser' doesn't contain a valid alias configuration
                E:\Udemy\typescript\CourseProject\node_modules\querystring.ts doesn't exist
              js
                Field 'browser' doesn't contain a valid alias configuration
                E:\Udemy\typescript\CourseProject\node_modules\querystringjs doesn't exist
              as directory
                existing directory E:\Udemy\typescript\CourseProject\node_modules\querystring
                  using description file: E:\Udemy\typescript\CourseProject\node_modules\querystring\package.json (relative path: .)
                    using path: E:\Udemy\typescript\CourseProject\node_modules\querystring\index
                      using description file: E:\Udemy\typescript\CourseProject\node_modules\querystring\package.json (relative path: ./index)
                        no extension
                          Field 'browser' doesn't contain a valid alias configuration
                          E:\Udemy\typescript\CourseProject\node_modules\querystring\index doesn't exist
                        .ts
                          Field 'browser' doesn't contain a valid alias configuration
                          E:\Udemy\typescript\CourseProject\node_modules\querystring\index.ts doesn't exist
                        js
                          Field 'browser' doesn't contain a valid alias configuration
                          E:\Udemy\typescript\CourseProject\node_modules\querystring\indexjs doesn't exist
      E:\Udemy\typescript\node_modules doesn't exist or is not a directory
      E:\Udemy\node_modules doesn't exist or is not a directory
      E:\node_modules doesn't exist or is not a directory
 @ ./node_modules/webpack-dev-server/client/utils/parseURL.js 1:0-22 35:16-25
 @ ./node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&reconnect=10 4:0-43 23:26-34

ERROR in ./node_modules/webpack/hot/dev-server.js 11:11-27
Module not found: Error: Can't resolve './log' in 'E:\Udemy\typescript\CourseProject\node_modules\webpack\hot'
resolve './log' in 'E:\Udemy\typescript\CourseProject\node_modules\webpack\hot'
  using description file: E:\Udemy\typescript\CourseProject\node_modules\webpack\package.json (relative path: ./hot)
    Field 'browser' doesn't contain a valid alias configuration
    using description file: E:\Udemy\typescript\CourseProject\node_modules\webpack\package.json (relative path: ./hot/log)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\webpack\hot\log doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\webpack\hot\log.ts doesn't exist
      js
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\webpack\hot\logjs doesn't exist
      as directory
        E:\Udemy\typescript\CourseProject\node_modules\webpack\hot\log doesn't exist

ERROR in ./node_modules/webpack/hot/dev-server.js 30:4-33
Module not found: Error: Can't resolve './log-apply-result' in 'E:\Udemy\typescript\CourseProject\node_modules\webpack\hot'
resolve './log-apply-result' in 'E:\Udemy\typescript\CourseProject\node_modules\webpack\hot'
  using description file: E:\Udemy\typescript\CourseProject\node_modules\webpack\package.json (relative path: ./hot)
    Field 'browser' doesn't contain a valid alias configuration
    using description file: E:\Udemy\typescript\CourseProject\node_modules\webpack\package.json (relative path: ./hot/log-apply-result)      
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\webpack\hot\log-apply-result doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\webpack\hot\log-apply-result.ts doesn't exist
      js
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\webpack\hot\log-apply-resultjs doesn't exist
      as directory
        E:\Udemy\typescript\CourseProject\node_modules\webpack\hot\log-apply-result doesn't exist

ERROR in ./node_modules/webpack/hot/dev-server.js 50:18-38
Module not found: Error: Can't resolve './emitter' in 'E:\Udemy\typescript\CourseProject\node_modules\webpack\hot'
resolve './emitter' in 'E:\Udemy\typescript\CourseProject\node_modules\webpack\hot'
  using description file: E:\Udemy\typescript\CourseProject\node_modules\webpack\package.json (relative path: ./hot)
    Field 'browser' doesn't contain a valid alias configuration
    using description file: E:\Udemy\typescript\CourseProject\node_modules\webpack\package.json (relative path: ./hot/emitter)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\webpack\hot\emitter doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\webpack\hot\emitter.ts doesn't exist
      js
        Field 'browser' doesn't contain a valid alias configuration
        E:\Udemy\typescript\CourseProject\node_modules\webpack\hot\emitterjs doesn't exist
      as directory
        E:\Udemy\typescript\CourseProject\node_modules\webpack\hot\emitter doesn't exist

webpack 5.62.1 compiled with 8 errors in 2878 ms

非常感謝您的幫助！

編輯：

我已經運行npm install ，嘗試刪除和重建node_modules文件夾幾次，以防萬一。 在此處輸入圖片說明

2 個解決方案

解決方案1
 0  2021-11-09 06:42:50

發生這種情況是因為您必須先安裝依賴項。 在npm run之前執行npm install

解決方案2
 0  2021-11-09 09:45:42

仔細檢查我的設置后，我發現了我自己的問題。 我寫了extensions: ['.ts', 'js']缺少一個 DOT，它應該是'.js' ...這就是為什么 webpack 不想檢查 js 文件。 謝謝大家，問題結束。

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 入門項目：webpack vs ts-node？ Webpack構建TypeScript不會引發TS錯誤 TypeScript init：錯誤TS6053：找不到文件'init.ts' node_modules / @ types中的Webpack ts-loader錯誤 webpack ts-loader 錯誤：loaderContext.getOptions 不是函數 嘗試使用 multer 在 fastify ts 中解構時出錯 打字稿、index.d.ts 和 webpack：找不到模塊錯誤 成功將TS文件編譯為JS並與Webpack捆綁在一起后出現控制台錯誤 如何在TS編譯錯誤上使webpack2失敗？ webpack 編譯在新計算機上出現 ts-loader 錯誤
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM