使用Webpack 4构建Node/Express应用后出现Cannot find module 'ejs'错误

我之前也碰到过类似的情况，开发环境正常但生产构建后找不到模板引擎模块，大概率是Webpack对Node环境下的依赖处理或者模板路径配置出了问题，给你几个具体的排查和解决步骤：

1. 显式引入ejs模块 #

Express会自动尝试加载对应的view engine模块，但Webpack的静态分析可能识别不到这种隐式依赖，导致ejs没有被打包进去。你可以在你的Express入口文件里显式引入ejs：

const ejs = require('ejs');
app.set('view engine', 'ejs');

2. 检查Webpack的externals配置 #

如果你的Webpack配置里用了webpack-node-externals来排除node_modules里的模块（这在Node应用打包中很常见），它会默认排除所有第三方依赖，包括ejs。这时候你需要把ejs加入允许打包的白名单：

首先确保你安装了webpack-node-externals（如果用了的话），然后修改配置：

const nodeExternals = require('webpack-node-externals');

module.exports = {
  // 其他配置项...
  target: 'node', // 必须指定target为node，适配Node环境
  externals: [nodeExternals({
    allowlist: ['ejs'] // 让Webpack打包ejs模块
  })]
}

如果没有用webpack-node-externals，那检查是否有其他externals规则不小心排除了ejs。

3. 添加ejs文件的loader处理 #

如果你的项目里有.ejs模板文件，Webpack需要对应的loader来识别和处理这些文件，否则构建后可能无法正确加载模板。安装ejs-loader：

npm install ejs-loader --save-dev

然后在Webpack配置的module.rules里添加规则：

module: {
  rules: [
    // 你的Babel等其他规则...
    {
      test: /\.ejs$/,
      use: 'ejs-loader'
    }
  ]
}

4. 确保模板目录路径正确 #

Express默认会从views目录加载模板，但Webpack构建后，你的编译文件在dist目录下，相对路径可能发生了变化，导致找不到模板文件（这也可能触发类似“找不到ejs模块”的错误）。建议用绝对路径设置views目录：

const path = require('path');
// 根据你的项目结构调整路径，比如如果views在server目录下，dist在server/dist里
app.set('views', path.resolve(__dirname, '../views'));

5. 验证构建产物 #

你可以打开server/dist/server.build.js搜索一下是否有ejs相关的代码，如果没有，说明Webpack确实没把ejs打包进去，那回到前面的externals和显式引入步骤检查。

按照这几个步骤排查下来，应该能解决找不到ejs模块的问题。

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