ERROR in Entry module not found: Error: Can't resolve 'webpack-dev-server --open' in 'D:\file‘

本文详细解析了Webpack配置中常见的错误,如模块未找到、文件路径错误等,并提供了具体的解决方案,帮助开发者快速定位并修正配置问题。
ERROR in Entry module not found: Error: Can't resolve 'webpack-dev-server --open' in 'D:\study\webpack-demo'

ERROR in (webpack)-dev-server/client?http://localhost:8080
Module build failed: Error: ENOENT: no such file or directory, open 'D:\study\webpack-demo\node_modules\webpack-dev-server\client\index.js'
 @ multi (webpack)-dev-server/client?http://localhost:8080 ./src/index.js app[0]

ERROR in multi (webpack)-dev-server/client?http://localhost:8080 webpack-dev-server --open
Module not found: Error: Can't resolve 'webpack-dev-server --open' in 'D:\study\webpack-demo'
 @ multi (webpack)-dev-server/client?http://localhost:8080 webpack-dev-server --open start[1]

当你运行得项目中出现以上报错,看看webpack.config.js 文件中 配置是否出错?

 derServer: {
     	contentBase: './dist' 
  },

解决方法:本地出错得原因是 , 键盘敲错了!或者 改正重新运行即可

devServer: { // 此处配置名称写错了
contentBase: ‘./dist’
},

entry: {
    app: './src/index.js',
    print: './src/print.js',
    "start": "webpack-dev-server --open" //  或者此处引用错误
  },

总结: 是webpack 原生结构的配置写错了

PS D:\code\front_tfs\piccqywx_page_new> npm install webpack-dev-server@4.15.1 --save-dev npm error code ERESOLVE npm error ERESOLVE could not resolve npm error npm error While resolving: file-loader@1.1.11 npm error Found: webpack@5.103.0 npm error node_modules/webpack npm error peer webpack@"^5.82.0" from @webpack-cli/configtest@3.0.1 npm error node_modules/@webpack-cli/configtest npm error @webpack-cli/configtest@"^3.0.1" from webpack-cli@6.0.1 npm error node_modules/webpack-cli npm error peer webpack-cli@"6.x.x" from @webpack-cli/configtest@3.0.1 npm error 2 more (@webpack-cli/info, @webpack-cli/serve) npm error peer webpack@"^5.82.0" from @webpack-cli/info@3.0.1 npm error node_modules/@webpack-cli/info npm error @webpack-cli/info@"^3.0.1" from webpack-cli@6.0.1 npm error 9 more (@webpack-cli/serve, babel-loader, html-loader, ...) npm error npm error Could not resolve dependency: npm error peer webpack@"^2.0.0 || ^3.0.0 || ^4.0.0" from file-loader@1.1.11 npm error node_modules/file-loader npm error peer file-loader@"*" from url-loader@0.6.2 npm error node_modules/url-loader npm error url-loader@"^0.6.2" from the root project npm error file-loader@"^1.1.6" from the root project npm error npm error Conflicting peer dependency: webpack@4.47.0 npm error node_modules/webpack npm error peer webpack@"^2.0.0 || ^3.0.0 || ^4.0.0" from file-loader@1.1.11 npm error node_modules/file-loader npm error peer file-loader@"*" from url-loader@0.6.2 npm error node_modules/url-loader npm error url-loader@"^0.6.2" from the root project npm error file-loader@"^1.1.6" from the root project npm error npm error Fix the upstream dependency conflict, or retry npm error this command with --force or --legacy-peer-deps npm error to accept an incorrect (and potentially broken) dependency resolution. npm error npm error npm error For a full report see: npm error D:\tools\nodes\node_cache\_logs\2025-11-25T03_35_27_175Z-eresolve-report.txt npm error A complete log of this run can be found in: D:\tools\nodes\node_cache\_logs\2025-11-25T03_35_27_175Z-debug-0.log PS D:\code\front_tfs\piccqywx_page_new>
最新发布
11-26
>> npm run dev > vue-project@0.0.0 dev > webpack serve <i> [webpack-dev-server] Project is running at: <i> [webpack-dev-server] Loopback: http://localhost:8080/, http://[::1]:8080/ <i> [webpack-dev-server] On Your Network (IPv4): http://192.168.247.1:8080/ <i> [webpack-dev-server] Content not from webpack is served from 'D:\森林退化\vue-project\public' directory assets by status 56 KiB [cached] 1 asset runtime modules 27.9 KiB 12 modules orphan modules 33.4 KiB [orphan] 4 modules cacheable modules 109 KiB modules by path ./node_modules/webpack-dev-server/client/ 84.8 KiB ./node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0....(truncated) 53.7 KiB [built] [code generated] ./node_modules/webpack-dev-server/client/utils/log.js 545 bytes [built] [code generated] ./node_modules/webpack-dev-server/client/clients/WebSocketClient.js 2.19 KiB [built] [code generated] ./node_modules/webpack-dev-server/client/modules/logger/index.js 28.4 KiB [built] [code generated] modules by path ./node_modules/webpack/hot/*.js 5.17 KiB ./node_modules/webpack/hot/dev-server.js 1.94 KiB [built] [code generated] ./node_modules/webpack/hot/log.js 1.73 KiB [built] [code generated] ./node_modules/webpack/hot/emitter.js 75 bytes [built] [code generated] ./node_modules/webpack/hot/log-apply-result.js 1.43 KiB [built] [code generated] ./node_modules/events/events.js 14.5 KiB [built] [code generated] ./node_modules/ansi-html-community/index.js 4.16 KiB [built] [code generated] WARNING in configuration The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment. You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/configuration/mode/ ERROR in main Module not found: Error: Can't resolve './src' in 'D:\森林退化\vue-project' resolve './src' in 'D:\森林退化\vue-project' using description file: D:\森林退化\vue-project\package.json (relative path: .) Field 'browser' doesn't contain a valid alias configuration using description file: D:\森林退化\vue-project\package.json (relative path: ./src) no extension Field 'browser' doesn't contain a valid alias configuration D:\森林退化\vue-project\src is not a file .js Field 'browser' doesn't contain a valid alias configuration D:\森林退化\vue-project\src.js doesn't exist .json Field 'browser' doesn't contain a valid alias configuration D:\森林退化\vue-project\src.json doesn't exist .wasm Field 'browser' doesn't contain a valid alias configuration D:\森林退化\vue-project\src.wasm doesn't exist as directory existing directory D:\森林退化\vue-project\src using description file: D:\森林退化\vue-project\package.json (relative path: ./src) using path: D:\森林退化\vue-project\src\index using description file: D:\森林退化\vue-project\package.json (relative path: ./src/index) no extension Field 'browser' doesn't contain a valid alias configuration D:\森林退化\vue-project\src\index doesn't exist .js Field 'browser' doesn't contain a valid alias configuration D:\森林退化\vue-project\src\index.js doesn't exist .json Field 'browser' doesn't contain a valid alias configuration D:\森林退化\vue-project\src\index.json doesn't exist .wasm Field 'browser' doesn't contain a valid alias configuration D:\森林退化\vue-project\src\index.wasm doesn't exist webpack 5.103.0 compiled with 1 error and 1 warning in 1419 ms
11-22
Vue 项目的 webpack 打包过程中,出现 `ERROR in Entry module not found: Error: Can't resolve 'server' in 'D:\myvue'` 错误,通常是由于 webpack 配置文件中指定了一个不存在或路径错误的入口模块 `'server'`。这个错误表明 webpack 无法找到名为 `'server'` 的模块或文件路径。 ### 常见原因与解决方案 #### 1. 检查入口配置是否正确 webpack 默认的入口文件是 `./src/index.js`。如果在 `webpack.config.js` 中手动配置了 `entry` 属性,但写入了错误的路径,例如: ```js entry: './server.js' ``` 而实际项目中并不存在 `server.js` 文件,或者路径拼写错误,则会触发该错误。请确保 `entry` 指向的文件路径是正确的,例如: ```js const path = require('path'); module.exports = { entry: path.resolve(__dirname, './src/main.js'), // 确保路径正确 output: { path: path.resolve(__dirname, './dist'), filename: 'bundle.js' } }; ``` #### 2. 检查项目结构是否符合预期 如果你使用的是 Vue CLI 创建的项目,默认入口文件为 `src/main.js`。如果项目结构发生变化,例如将入口文件移动或重命名为 `server.js`,但未更新配置,也会导致错误。请确认以下几点: - `src/main.js` 文件是否存在。 - `webpack.config.js` 是否在项目根目录下。 - `webpack.config.js` 中的 `entry` 是否指向正确的文件路径。 #### 3. 检查是否误用了 `server` 作为模块名 如果在 `entry` 中错误地写入了 `'server'`,而没有 `.js` 或 `.vue` 扩展名,webpack 会尝试将其解析为 Node.js 模块。如果项目中没有安装名为 `server` 的 npm 包,就会报错。确保入口路径是本地文件路径,而不是未安装的模块名。 #### 4. 使用默认入口路径 根据 webpack 4 的设计,如果未在配置文件中指定 `entry`,它会默认使用 `./src/index.js` 作为入口文件。如果你的项目结构符合这一规范,可以尝试删除 `webpack.config.js` 中的 `entry` 配置,让 webpack 自动识别入口文件。 #### 5. 检查路径大小写与操作系统差异 在某些操作系统(如 Linux 或 macOS)中,路径是大小写敏感的。如果项目部署在这些系统上,而配置文件中使用了错误的大小写路径(例如 `Server.js` 而不是 `server.js`),也会导致解析失败。确保路径大小写一致。 #### 6. 清理 node_modules 并重新安装依赖 有时,`node_modules` 中的缓存或损坏依赖也可能导致路径解析错误。可以尝试执行以下命令清理并重新安装依赖: ```bash rm -rf node_modules npm install ``` #### 7. 检查 Vue CLI 配置是否被修改 如果你使用的是 Vue CLI 创建的项目,通常不需要手动配置 `webpack.config.js`。Vue CLI 内部已经集成了默认的 webpack 配置。如果手动添加了 `webpack.config.js` 并修改了入口设置,可能会与默认行为冲突。可以尝试删除或重命名 `webpack.config.js`,让 Vue CLI 使用默认配置。 --- ### 示例:正确配置入口路径的 webpack.config.js ```js const path = require('path'); module.exports = { entry: path.resolve(__dirname, './src/main.js'), output: { path: path.resolve(__dirname, './dist'), filename: 'bundle.js' }, module: { rules: [ { test: /\.vue$/, loader: 'vue-loader' }, { test: /\.js$/, loader: 'babel-loader', exclude: /node_modules/ } ] } }; ``` --- ###
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值