当目标模块位于node_modules中时，Webpack的别名不起作用

Question

背景

我正在编写带有打字稿的SSR react app，有一个我必须使用的客户端模块（client-logger），并且由于它是AMD模块系统，所以只能在客户端上运行。在Node上运行会产生错误。

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

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

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

复制步骤：

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

预期结果：

• 服务器应正常运行
• 服务器捆绑包的client-logger应该替换为rewrite-client-logger（您可以通过在register event文件中搜索字符串assets/server.js来进行验证。）

实际结果：

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

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

  如果有人在编译时有其他方式替换模块，请让我知道，非常感谢。

Answer 1

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

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