Sublime Text 可通过自定义 Build System 调用 Gulp，而非依赖过时插件；Webpack 应独立运行 dev-server，避免封装插件；Gulp 与 Webpack 输出路径须一致，并注意 Sublime 文件缓存问题。
Sublime Text 本身不内置构建系统支持 Gulp 或 Webpack，但可以作为轻量编辑器配合外部构建工具完成自动化打包——关键不是“能不能用”，而是“怎么让 Sublime 不拖慢你的构建节奏”。
Sublime Text 调用 Gulp 的正确姿势
别在 Sublime 里装 sublime-gulp 插件再配一堆 JSON；它早已过时且与 Gulp 4+ 的 series/parallel 任务模型不兼容。真正稳定的做法是：用 Sublime 的 Build System 直接调用 shell 命令。
- 菜单栏 → Tools → Build System → New Build System，粘贴以下内容并保存为
Gulp.sublime-build { "cmd": ["gulp", "$1"], "selector": "source.js", "working_dir": "${project_path}", "shell": true }- 执行时按
Ctrl+Shift+B（Windows/Linux）或Cmd+Shift+B（macOS），输入build或dev即可触发对应 Gulp 任务 - 注意：
$1是占位符，允许你传参；working_dir必须设为${project_path}，否则gulpfile.js找不到
Webpack 配合 Sublime 时的常见卡点
Webpack 不是“运行一次就完事”的工具，它需要监听 + 热更新才能和 Sublime 编辑体验对齐。但 Sublime 没有 DevServer 集成能力，所以必须把 webpack-dev-server 当独立服务跑，而不是塞进 Gulp 里。
- 在
webpack.config.js中明确配置devServer：端口、static目录、watchFiles（尤其要包含.html和.scss，否则改模板不刷新） - 不要用
gulp-webpack这类过时封装插件——它会吞掉 Webpack 的错误堆栈，导致你在 Sublime 里看到的只是ERROR in ./src/index.js Module build failed，没行号也没 loader 提示 - 推荐方式：终端单独运行
npx webpack serve --mode=development，Sublime 只负责写代码；浏览器访问http://localhost:8080实时预览
Gulp + Webpack 混合工作流里的文件路径陷阱
当 Gulp 负责 HTML/CSS/图片处理，Webpack 负责 JS 打包时，二者输出目录稍有错位，就会导致 rev 版本号注入失败或资源 404。
- Webpack 输出路径（
output.path）必须和 Gulp 的dest()目标一致，比如都设为./dist；否则gulp-rev-collector在扫描index.html时找不到main.js对应的哈希记录 -
gulp-useref和html-webpack-plugin别共存——前者靠注释标记（<!-- build:js -->）合并 JS，后者靠模板注入；混用会导致 script 标签重复或丢失 - 如果用了
gulp-rev给 CSS/JS 加版本号，Webpack 的filename: '[name].[contenthash:8].js'就得关掉，否则两个哈希打架，HTML 里引用的是旧名，实际生成的是新名
最易被忽略的其实是 Sublime 的文件缓存行为：修改 gulpfile.js 后不重启 Sublime，Ctrl+Shift+B 仍可能执行旧任务逻辑；遇到奇怪的构建结果，先关掉 Sublime 再重开——这不是玄学，是它的 Build System 缓存机制所致。
