Webpack和Nodejs同构需要绝对路径

Question

目标:我正在尝试在nodejs和webpack中设置一个项目,以便 require函数可以以root身份使用项目目录,因此我可以在两个环境中使用相对于项目根的绝对路径(同构使用即React服务器+客户端呈现).

情况:在webpack中你可以设置config.resolve.root使其工作,但在nodejs中,最好不要覆盖/修改global.require.

提议1:我可以创建一个新的全局功能

global.p_require

所以它在节点中工作; 但是,我无法找到一种方法让webpack将"p_require"解析为__webpack_require__而不更改webpack源代码.

提案2:我可以创建一个新的全局变量

global.ROOT_DIR = process.cwd()

所以它在节点中工作

require(ROOT_DIR + <relative path to root>);

但是,webpack会认为这是动态需求.有没有办法让webpack解析ROOT_DIR？我已经尝试过Define Plugin,但似乎在webpack解析require之后加载.

题

任何人都有解决方案或面临同样的问题？

Answer 1

我通过让 webpack 做更多事情来解决这个问题；它不是“节点和 webpack”，而是“webpack：客户端和服务器”。我让 webpack 为客户端进行构建，并为服务器进行构建（后者在配置中使用“node”作为其目标属性）。自定义 webpack 所需的目录很容易，因此您可以让它完成其工作并为节点创建构建。

在服务器上渲染时，您只需要编译的服务器版本。如果您需要将一些内容从服务器传递到 webpack 构建的应用程序，请将其连接到用于服务器构建的入口点 - webpack 会将其构建为 commonJs 模块，因此您的入口点可以导出任何内容是服务端需要渲染时最方便的接口。