答案是通过安装Nodejs、Babel、ESLint等插件并配置自定义构建系统，可在Sublime Text中实现JavaScript语法高亮、ES6+支持及Webpack命令运行，从而高效配合Webpack开发。
要在 Sublime Text 中配置 Webpack 开发环境，核心是让编辑器支持 JavaScript 语法高亮、ES6+ 语法、模块导入导出提示，并能快速运行 Webpack 命令。Sublime 本身不是 IDE，但通过合理配置插件和构建系统，可以高效配合 Webpack 使用。
安装必要的 Sublime 插件
提升开发体验的关键是安装以下常用插件，可通过 Package Control 安装：
- Nodejs：提供 Node.js 和 npm 命令补全。
- Babel：支持 ES6+ 语法高亮（推荐设置为 JavaScript(Babel) 语法）。
- ESLint：代码检查，配合 Webpack 的 eslint-loader 使用更佳。
- SublimeLinter 与 SublimeLinter-eslint：在编辑器内显示 ESLint 错误。
- JavaScript Enhancements（可选）：提供更智能的 JS 补全和重构功能。
设置文件语法高亮
Webpack 配置文件通常是 webpack.config.js，建议使用 Babel 插件提供的语法高亮：
- 打开 webpack.config.js 文件。
- 点击右下角 “Plain Text” → 选择 Babel → JavaScript (Babel)。
- 这样就能获得 import/export、箭头函数等现代 JS 语法的高亮支持。
配置 Sublime 构建系统运行 Webpack
你可以直接在 Sublime 中运行 webpack 命令，无需切换到终端。
- 点击菜单栏 Tools → Build System → New Build System…
- 输入以下内容并保存为 webpack.sublime-build：
{
"cmd": ["npx", "webpack"],
"selector": "source.js",
"working_dir": "${project_path:${folder}}",
"shell": true,
"encoding": "utf-8"
}
说明：
- cmd 使用 npx webpack，自动查找本地 node_modules 中的 webpack。
- working_dir 确保命令在项目根目录执行。
- 保存后，在 JS 文件中按 Ctrl+B 就能运行 Webpack。
结合 package.json 脚本更方便
大多数项目会在 package.json 中定义脚本，比如：
"scripts": {
"build": "webpack --mode production",
"dev": "webpack --mode development"
}
你可以修改构建系统来运行这些脚本：
{
"cmd": ["npm", "run", "dev"],
"working_dir": "${project_path:${folder}}",
"shell": true,
"encoding": "utf-8"
}
切换构建系统后，Ctrl+B 就能启动开发模式打包。
基本上就这些。Sublime 不像 VSCode 那样内置强大 JS 支持，但搭配插件和自定义构建系统，依然可以顺畅使用 Webpack。关键是把编辑器当作“轻量代码编辑器”，构建和监控交给 Webpack CLI 和 npm scripts 处理，Sublime 专注写代码就行。
