Webpack打包后Node.js模块函数无法识别问题求助

这个坑我之前踩过！你遇到的TypeError: r.createServer is not a function，本质是Webpack默认的打包目标是浏览器环境，它会把Node.js的核心模块（比如http）当成普通第三方模块处理，甚至试图替换成浏览器兼容的实现，导致打包后无法正确调用Node原生的http.createServer方法。

下面是正确的打包配置步骤，帮你把项目和所有依赖打包成单个可运行的文件：

1. 关键配置：指定Webpack的目标环境为Node.js #

在项目根目录创建（或修改）webpack.config.js，添加target: 'node'配置，告诉Webpack我们要打包的是Node.js项目，它会保留Node核心模块的原生引用，而不是做浏览器兼容转换。

完整的配置示例：

const path = require('path');

module.exports = {
  entry: './Server.js', // 你的项目入口文件路径
  target: 'node', // 核心配置：指定目标运行环境为Node.js
  output: {
    path: path.resolve(__dirname, 'dist'), // 打包文件输出目录
    filename: 'bundle.js' // 打包后的文件名
  },
  mode: 'production' // 可选：'development'用于开发，'production'用于生产环境压缩
};

2. 打包并运行 #

执行打包命令：

npx webpack

打包完成后，在dist目录下会生成bundle.js，直接用Node运行即可：

node dist/bundle.js

额外注意事项 #

• 不要使用webpack-dev-server：这个工具是为浏览器端项目提供热重载服务的，Node.js项目打包后直接用node命令运行打包文件即可。
• 第三方依赖会被自动打包：Webpack会把你项目中安装的第三方依赖（比如express、axios等）全部打包到bundle.js里，不需要额外配置。
• Webpack 5兼容性：如果使用Webpack 5，target: 'node'已经足够处理核心模块，不需要额外配置resolve.fallback（那是给浏览器环境处理Node模块用的）。

这样配置后，你的http.createServer调用就能正常工作，同时所有依赖也会被打包到单个文件中。

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