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

我从这个优秀的教程开始: https : //www.fullstackreact.com/articles/using-create-react-app-with-a-server/,并试图通过添加一个新的页面来扩展它通过一个新的路线。 然而,经过几个小时的忙碌,我意识到不知何故,创造反应应用程序正在做一些奇怪的魔术(正如他们的文档中提到的 ):

`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文件,并运行到各种文件path问题(是的,甚至当我使用require('path')sendFile(...,{root: __dirname}) 。)

那么这里究竟发生了什么,你能给我什么提示来帮助我吗?

编辑:这可能是从babel以及webpack – 我不完全清楚babel交手和webpack开始的地方。

这是我的一个图片的问题

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

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

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

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