它不起作用，因为它无法加载您的 javascript 包。我猜问题出在 HTML 脚本标记中的路径上。可能你已经像这样在开头用点指定了app.js的路径 <script src="./app.js"></script>，如果是这样，请删除点并检查问题是否仍然存在<script src="/app.js"></script>

让我们来举例说明之间有什么区别./app.js和/app.js

案例1.您使用类似路线的第一个层次是加载页面/或/intro

• ./app.js: HTML 尝试从 http://address/app.js
• /app.js: HTML 尝试从 http://address/app.js

没有不同

案例 2. 您正在使用二级路由加载页面 /build/pattern

• ./app.js: HTML 尝试加载脚本http://address/build/app.js-不存在
• /app.js：HTML 尝试从中加载脚本http://address/app.js- 好的

@niba 的回答完美地解决了我的问题。我一直遇到的问题是，当我<Route/>在已经由 a 呈现的组件中嵌套一个元素<Route/>时，当我尝试转到子路由 url 时，它将无法加载脚本 bundle.js。在webpackConfig.json中添加以下内容后，一切恢复正常。

module.exports = {
    ...
    output: {
        path: path.resolve('dist'),
        publicPath: '/',
        filename: 'bundle.js'
    },
    ...
}

对于那些尝试过上述方法但仍然有问题的人，我在我的 webpack 配置中使用了 html-webpack-plugin，因此它会在 HTML 中注入包，而无需在 index.html 上添加任何脚本导入

所以我从我的 index.html 文件中删除了以下行：

<script src="/bundle.js"></script>

并在 webpack plugins 部分添加了以下配置：

// some other imports 
const HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {
...
webpack default config
...

plugins: [
    new HtmlWebpackPlugin({
      template: './public/index.html',
      hash: true,
      inject: true,
    }),
    ...
    other plugins,
  ],

}

请记住还要根据您的项目使用输出配置，例如我的：

output: {
    path: path.resolve(__dirname, 'public'),
    publicPath: '/',
    filename: 'bundle.js',
  },

在package.json文件中，只需设置

    "homepage": "/"