Webpack 'cannot find module'错误：路径缺失子文件夹如何修复？

这问题我之前帮同事排查过好几次，核心就是Webpack没识别到正确的项目根目录，给你几个一步步的解决方法，按顺序试应该能搞定：

1. 确认终端当前工作目录 #

Webpack默认会从你执行命令的目录去查找node_modules，如果你的终端现在停在C:\Users\User\source\repos\DDvwn，但实际项目文件都在子文件夹DDvwn里，那肯定会找错路径。

解决步骤：

• 在终端里执行：cd DDvwn，进入真正的项目根目录（就是包含package.json和node_modules的那个文件夹）
• 再重新运行你的打包命令，比如npm run build或者npx webpack

2. 检查package.json的scripts配置 #

看看你的package.json里的scripts有没有硬编码错误路径，或者没使用本地Webpack：

• 错误示例：如果写了"build": "webpack --config ../webpack.config.js"，这种相对路径会导致路径层级出错
• 正确做法：把scripts改成调用本地的Webpack，比如：

  "scripts": {
    "build": "npx webpack"
  }
  

  或者直接用本地二进制文件路径：

  "scripts": {
    "build": "./node_modules/.bin/webpack"
  }
  

3. 排查webpack.config.js的context配置 #

如果你的Webpack配置文件里设置了context选项，这个值会强制指定Webpack的工作根目录，路径写错就会出问题：

• 打开webpack.config.js，找有没有类似这样的代码：

  const path = require('path');
  module.exports = {
    context: path.resolve(__dirname, '../'), // 这里的路径可能错了
    // 其他配置...
  };
  

• 改成正确的项目根目录，比如如果配置文件就在项目根目录里，直接写：

  context: path.resolve(__dirname)
  

  或者干脆删掉这个context配置，让Webpack默认使用当前执行目录。

4. 重新安装依赖（清除缓存） #

有时候node_modules的安装缓存或者路径关联会出问题，试试彻底重装：

• 删除项目根目录下的node_modules文件夹
• 删除package-lock.json（npm用户）或者yarn.lock（yarn用户）
• 运行npm install（或yarn install）重新安装所有依赖
• 再执行打包命令试试

5. 卸载全局Webpack（如果安装过） #

如果你之前全局安装了Webpack（比如用npm install -g webpack），可能会导致命令优先调用全局的Webpack，而全局Webpack会从当前终端目录找node_modules，从而路径出错：

• 在终端执行：npm uninstall -g webpack
• 之后只用本地的npx webpack或者npm run build来调用项目里的Webpack

内容的提问来源于stack exchange，提问作者anesthetic