Isomorphic React与Webpack的resolve.root选项

Question

我的React应用程序使用Webpack的相对于我的JS文件的根的需求resolve.root.即我的文件结构包含以下内容:

components
  App.react.js
containers
  AppContainer.react.js

在AppContainer.react.js中,我有:

import App from 'components/App.react';

这适用于客户端.现在我想让它变得同构.如果我在server.js中需要AppContainer.react.js,则表示components/App.react找不到.节点正在尝试要求containers/components/App.react.js,这是不存在的.如何使Node相对于给定目录？

编辑:我的目录结构如下所示:

css/
html/
js/
  components/
    App.react.js
  containers/
    AppContainer.react.js
  main.js <- requires AppContainer
public/
server/
  server.js <- requires AppContainer

Answer 1

您可以使用https://github.com/halt-hammerzeit/universal-webpack。这将使您保留相同的 webpack 配置（例如resolve.root和任何别名），并另外帮助您转向服务器端渲染。使用文档提供了一个很好的示例，说明如何启动和运行它。