Webpack以某种方式完全绕过Express路由

Question

我从这个优秀的教程开始：https://www.fullstackreact.com/articles/using-create-react-app-with-a-server/并尝试通过添加新页面来扩展它以通过新路线提供服务。然而，经过数小时的捣乱，我意识到创造反应应用程序正在做一些奇怪的魔法（如mentioned in their docs here）：

`create-react-app` configures a Webpack development server to run on `localhost:3000`. 

This development server will bundle all static assets located under `client/src/`. 

All requests to `localhost:3000` will serve `client/index.html` which will include Webpack's `bundle.js`.

关键引用是“localhost:3000的所有请求都将提供client/index.html”。我不知道这是怎么发生的。所以尽管我和routes/index.js混在一起：

   app.route('/')
        .get(function (req, res) {
            res.sendFile(bipath.join(__dirname, '../public', 'THISCANBEANYRANDOMFILENAME.html'))
        });

无关紧要，因为无论如何，webpack都会以某种方式指导localhost:3000到index.html。它在哪里以及如何做到这一点？底线我正在尝试修改我的路由以提供新的html文件并遇到各种各样的文件路径问题（是的，即使我使用require('path')或sendFile(...,{root: __dirname})。）

那么到底发生了什么，你能给我任何提示来帮助我吗？

编辑：这可能来自babel以及webpack - 我不太清楚babel手动关闭的位置以及webpack启动的位置。

Answer 1

我还没有使用create-react-app，但似乎不是使用默认的npm start，而是可以创建自己的服务器文件并运行它。

这看起来是一个很好的例子。

https://medium.com/@patriciolpezjuri/using-create-react-app-with-react-router-express-js-8fa658bf892d#.6y4rrl61q

或者，如果您希望将路由用作api，则可以将它们代理到不同的端口，如您链接的教程中所示。