这个方案完全可行！它确实能帮你把零散的第三方依赖打包成单一（或少量）bundle文件，大幅减少项目根目录下的node_modules文件数量，非常贴合你的需求。下面我会一步步教你怎么正确实现：

一、核心原理 #

Webpack不仅能打包浏览器端代码，也支持Node.js环境的打包。我们通过创建一个专门的入口文件，把需要集中打包的依赖统一导出，再用Webpack将其编译为符合CommonJS规范的bundle，这样Node.js就能正常require并解构这些模块。

二、具体实现步骤 #

1. 准备依赖与初始化 #

首先确保你的项目已经初始化，然后安装Webpack相关工具：

npm init -y
npm install webpack webpack-cli --save-dev

同时别忘了安装你要打包的第三方依赖：

npm install lodash colors test abc --save

2. 创建Webpack配置文件 #

在项目根目录新建webpack.config.js，配置Node.js环境的打包规则：

const path = require('path');

module.exports = {
  target: 'node', // 必须：告诉Webpack我们要打包Node.js环境的代码
  entry: './bundle-entry.js', // 指向我们的依赖导出入口
  output: {
    filename: 'vendor-bundle.js',
    path: path.resolve(__dirname, 'dist'), // 打包后文件的输出目录
    libraryTarget: 'commonjs2', // 输出CommonJS模块，适配Node.js的require机制
  },
  mode: 'production', // 生产模式会自动压缩代码，减小bundle体积；调试时可以改成'development'
};

3. 创建依赖导出入口文件 #

新建bundle-entry.js，把需要打包的依赖统一导出：

module.exports = {
  lodash: require('lodash'),
  colors: require('colors'),
  test: require('test'),
  abc: require('abc')
};

4. 执行打包命令 #

在package.json的scripts里添加打包命令：

"scripts": {
  "build:vendor": "webpack --config webpack.config.js"
}

然后运行命令完成打包：

npm run build:vendor

执行后会在dist目录下生成vendor-bundle.js文件。

5. 在主文件中引入并使用 #

现在你可以在项目的主文件（比如index.js）里直接解构引入bundle中的模块：

// 主业务文件index.js
const { lodash, colors, test, abc } = require('./dist/vendor-bundle');

// 测试使用
console.log(colors.green('这是用colors库输出的绿色文本'));
console.log(lodash.upperCase('lodash works!'));

三、注意事项 #

• 如果你的依赖包含原生C++模块（需要node-gyp编译的那种），Webpack可能无法直接打包，这时候需要在Webpack配置中用externals把它们排除，仍然通过node_modules加载。
• 打包完成后，你可以把node_modules里的这些依赖删除吗？不行——因为Webpack打包时是从node_modules读取依赖源码的，但打包后的bundle是独立的，后续如果不需要更新依赖，可以把这些依赖从package.json的dependencies中移除，只保留Webpack相关的devDependencies。
• 调试阶段可以把mode设为development，这样打包后的代码不会被压缩，方便排查问题。

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