Question

真的很简单。我正在尝试将第二个结帐页面添加到我的React和Node网站。

我认为这可能就像向浏览器路由器添加另一个“结帐”路线一样简单（如下所示）

<BrowserRouter>
   <div>
     <Route exact path="/" component={App}/>
     <Route exact path="/checkout" component={Checkout} />
   </div>
 </BrowserRouter>

但我收到错误“无法获取/结帐”，这意味着我必须在节点端做一些事情？这是我当前的index.js（节点）

if (process.env.NODE_ENV !== 'production') {
  const webpackMiddleware = require('webpack-dev-middleware');
  const webpack = require('webpack');
  const webpackConfig = require('./client/webpack.config.js');
  app.use(webpackMiddleware(webpack(webpackConfig)));
} else {
  app.use("/", expressStaticGzip("client/dist"));
  app.get('*', (req, res) => {
    res.sendFile(path.join(__dirname, 'client/dist/index.html'));
  });
}

目前，我在反应端有自己的自定义web pack配置，它捆绑了js和CSS文件，然后在节点端提供。

感谢您的帮助！

Answer 1

您很可能需要更新app.use(webpackMiddleware(webpack(webpackConfig))); 用这样的东西：

app.use(webpackMiddleware(webpack(webpackConfig), {
  publicPath: 'http://localhost:3000/dist',
  index: 'valid/path/to/index.html'
}));

但问题可能在./client/webpack.config.js

如果您想了解如何将其与HMR，SSR和Dev / Prod环境放在一起，您可以查看react-saga-universal repo

与节点反应 - 如何获取多页网站？

1 个答案: