webpack - 当目标模块在 node_modules 中时，Webpack 的别名不起作用

Question

背景

我正在用打字稿编写一个 SSR 反应应用程序，我必须使用一个客户端模块（client-logger），它只能在客户端运行，因为它是 AMD 模块系统。在 Node 上运行会报错。

我目前的解决方案是在编译时将client-logger模块替换为仅用于服务器捆绑包的模块。rewrite-client-logger

我已经尝试过 WebpackNormalModuleReplacementPlugin和alias，甚至编写了我自己的加载器，它们都不起作用，这是我的别名的Webpack 配置。

这是 repro 的演示链接：https ://github.com/stanleyyylau/demo

复制步骤：

• Git 克隆并签出到 Master 分支
• npm install安装所有依赖项
• 复制client-logger到 node_modulescp -rf ./client-logger ./node_modules
• npm run build触发构建
• npm run start运行通用应用程序

预期结果：

• 服务器应该在没有错误的情况下运行
• 服务器捆绑包client-logger应替换为（您可以通过在文件中rewrite-client-logger搜索字符串来验证这一点。）register eventassets/server.js

实际结果：

• 节点给出运行时错误ReferenceError: define is not defined

• client-logger未被替换rewrite-client-logger（别名替换仅在client-logger不在node_modules文件夹中时有效。）

  如果有人在编译时有其他方法来替换模块，请告诉我，非常感谢。

标签： webpack

Answer 1

您可以通过更改webpack-node-externals配置以包含记录器来解决此问题。这样，别名规则就有机会发挥作用。尝试

externals: [nodeExternals({
    whitelist: ['client-logger']
})]