我是一個 webpack 新手，試圖自己第一次設定它。安裝必要的軟體包，并創建一個空之后app.ts，只需console.log('hi');我跑NPM運行啟動，應該的WebPack只是編譯和運行平穩。
但是，我從 webpack 收到了一堆錯誤，說不node_modules存在多個 lib 檔案。我重建并仔細檢查了node_moduleslib 檔案確實存在的檔案夾，并且只是坐在那里。所以我對編譯錯誤感到困惑。看起來很簡單，這些錯誤不是來自我嗎？請幫忙？
完整的錯誤資訊在這里，如果有幫助的話......
$ 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:&hostname=0.0.0.0&port=8080&pathname=/ws&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:&hostname=0.0.0.0&port=8080&pathname=/ws&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:&hostname=0.0.0.0&port=8080&pathname=/ws&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:&hostname=0.0.0.0&port=8080&pathname=/ws&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:&hostname=0.0.0.0&port=8080&pathname=/ws&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檔案夾幾次，以防萬一。
uj5u.com熱心網友回復：
發生這種情況是因為您必須先安裝依賴項。npm install之前執行npm run
uj5u.com熱心網友回復：
仔細檢查我的設定后，我發現了我自己的問題。我寫了extensions: ['.ts', 'js']缺少一個 DOT，應該是'.js'...這就是為什么 webpack 不想檢查 js 檔案的原因。謝謝大家，問題結束。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/354239.html