webpack 构建没有路由组件的网站答案

【问题标题】：webpack build website without routed componentswebpack 构建没有路由组件的网站
【发布时间】：2019-06-13 17:42:32
【问题描述】：

我从头开始制作 react-app 和 webpack，一切正常，在 webpack-dev-server 中看起来很好。但是当我构建（捆绑）应用程序来归档它时，它没有显示来自“路由”路径的组件。

Webpack 没有输出任何错误，所以我不知道如何解决。这是项目：https://github.com/kamilmoskal/react-movies-library-app

【问题讨论】：

标签： reactjs webpack webpack-dev-server react-router-v4 react-router-dom

【解决方案1】：

好的，我发现问题出在

  from:  import { BrowserRouter, Route, Switch } from 'react-router-dom'
  to:    import { HashRouter as Router, Route, Switch } from 'react-router-dom'

  and in code below from: <BrowserRouter>
                          ...
                          </BrowserRouter>

                      to: <Router> 
                          ...
                          </Router>

当我通过标准的“npx create-react-app my-app”做应用程序时，添加就足够了，但在这种情况下它没有工作。也许它会帮助某人。

【讨论】：

【解决方案2】：

您可能试图在浏览器中将 index.html 作为常规文件打开。该应用程序应部署在某个服务器上。

使其工作的最简单方法是使用 serve:

在您的本地计算机上提供它

npm install serve --save
cd doc
serve

然后在浏览器中导航到http://localhost:5000

【讨论】：

是的，我尝试在浏览器中打开常规文件，但它应该不起作用？我认为 webpack 将动态应用程序转换为静态应用程序，因此我可以正常通过 index.html 打开它而无需任何服务器