根本原因是sublime构建系统默认不加载shell的path环境变量;必须显式设置"shell": true和"working_dir": "${project_path}",否则npx无法定位项目内node_modules/.bin/webpack。

为什么 npx webpack 在 Sublime 里总报 “command not found”
根本不是 Webpack 没装,而是 Sublime 的构建系统默认不加载 shell 的 PATH 环境变量。你在终端里能跑 npx,不代表 Sublime 能看到它。
-
"shell": true必须显式设为true,否则 Windows 下全失效,macOS/Linux 也可能因启动方式(比如从桌面图标打开)导致~/.zshrc没加载 -
"working_dir": "${project_path}"必须指定,否则npx会在用户 home 目录找node_modules/.bin/webpack,自然找不到 - 别依赖全局安装的
webpack:全局版本和项目package.json里的版本不一致时,require()报错或插件加载失败 - 如果项目用
pnpm,把"cmd"改成["pnpx", "webpack"],并确认pnpx在系统PATH中
如何让错误信息支持 Ctrl+Click 跳转到源码行
Sublime 不解析 sourcemap,只靠字符串正则匹配路径,所以必须同时满足 sourcemap 生成 + 错误格式合规。
- Webpack 配置里必须开启
devtool: 'source-map'或'inline-source-map' - 确保
webpack.config.js中output.path和resolve.alias不干扰原始源码路径映射(例如别把srcalias 成绝对路径) - 错误输出格式必须是
./src/index.js:5:12这种相对路径 + 行号 + 列号结构;带前缀(如[webpack])、绝对路径、或重定向stderr到文件都会破坏匹配 - 如果用了 Babel 插件,检查
@babel/preset-env是否启用了sourceType: 'unambiguous',否则 sourcemap 行号可能偏移
怎样安全启用 --watch 而不卡死编辑器
webpack --watch 是长时阻塞进程,原生 Build System 同步执行,一跑就卡住保存、切换标签页甚至关窗口。
- 不要把
--watch写进主"cmd";Save Actions 插件绑了它会直接卡死保存流程 - 用
"variants"定义监听变体,例如:"name": "Webpack — Watch",按Ctrl+Shift+B手动唤出选择,避免误触 - 真正需要常驻监听时,放弃 Build System,改用
Terminus插件配独立终端命令:{"title": "webpack watch", "cmd": ["npm", "run", "watch"], "shell": true} - 若项目已配
webpack-dev-server,优先用它代替--watch,配合浏览器扩展实现热更新
哪些配置最容易被忽略却直接导致失败
最常踩的坑不是语法写错,而是路径和环境隔离带来的隐性断连。
-
working_dir写成"${folder}"或留空:结果npx在错误目录下执行,找不到本地webpack - Webpack 配置文件不在项目根目录(比如在
config/webpack.config.js),但构建系统里没改--config参数路径 - 用了
export default写法的webpack.config.js:Webpack 5+ 仍原生只认module.exports = {...},Sublime 高亮没问题,但运行时报错 - ESLint 报
require is not defined:不是代码错,是.eslintrc.js里没加"env": { "node": true },导致语法检查器误判为浏览器环境











