Javascript webpack dev服务器未使用react router param route从配置位置为捆绑包提供服务

使用react路由器，我的路由匹配和我的应用程序包SearchUXBundle.js正确地从一级路由加载-但二级路由/tracker/：id错误地尝试从localhost/tracker/dist/SearchUXBundle.js而不是localhost/dist/SearchUXBundle.js加载我的应用程序包。我假设这是网页“输出”中与我缺少的相对路径相关的某种配置褶皱

webpack.config，js

var path = require('path');
var webpack = require('webpack');

module.exports = {
  devtool: 'source-map',
  devServer: {
        inline:false,
        port: 8001,
        historyApiFallback: true 
  },
  entry: {
    app: ['./src/root.js']
  },

  output: {
          path: "/dist",
          publicPath: '/',
          filename: '/dist/SearchUXBundle.js'
    },
  module: {
    loaders: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel',
        query: {
          retainLines: true,
          cacheDirectory: true
        }
      },
      {
        test: /.css$/,
        loaders: ['style', 'css']     
      },
      { test: /\.(png|jpg|jpeg|gif|woff)$/, loader: 'url-loader?limit=8192' },
    ]
  },
  resolve: {
      alias: {
          __CONFIG__: path.join(__dirname, 'config', process.env.REACT_ENV)
      }
  }
};

app.js

...
const store = createStore(rootReducer, enhancer);
const history = syncHistoryWithStore(browserHistory, store, {
  selectLocationState: createSelectLocationState()
});

render(
  <Provider store={store} >
     <Router history={history}> 
        <Route path="/" component={SearchUXContainer} />
        <Route path="tracker/:id" component={EmailTrackerContainer}/>
        <Route path="thisWorks" component={SearchUXContainer}/>
     </Router>
  </Provider>,
  document.getElementById('app')
);

。。。
const store=createStore（rootReducer、enhancer）；
const history=syncHistoryWithStore（浏览器历史记录、存储、{
selectLocationState:createSelectLocationState（）
});
渲染(
,
document.getElementById（'app'）
);

您需要确保

index.html

文件中链接的捆绑包是绝对的。如果是相对的，则位置将根据URL而变化，任何嵌套路由都将指向不存在的位置

<!-- bad -->
<script src="dist/SearchUXBundle.js"></script>

<!-- good -->
<script src="/dist/SearchUXBundle.js"></script>

---

您需要确保

index.html

文件中链接的捆绑包是绝对的。如果是相对的，则位置将根据URL而变化，任何嵌套路由都将指向不存在的位置

<!-- bad -->
<script src="dist/SearchUXBundle.js"></script>

<!-- good -->
<script src="/dist/SearchUXBundle.js"></script>

你能把你的

index.html

包括进去吗。我的第一个猜测是

index.html

中的

SearchUXBundle.js

是相对的，而它应该是绝对的。宾果！因此，我不正确地链接了“dist/SearchBundle.js”-我发现的另一个问题是，我没有正确地将我的路由嵌套在下面。如果你想把这个问题变成一个答案，我会接受的。你能把你的

index.html

包括进去吗。我的第一个猜测是

index.html

中的

SearchUXBundle.js

是相对的，而它应该是绝对的。宾果！因此，我不正确地链接了“dist/SearchBundle.js”-我发现的另一个问题是，我没有正确地将我的路由嵌套在下面。如果你想把它变成一个答案，我会接受它的伟大的答案！对于那些使用HtmlWebPackPlugin的人，请注意：确保配置对象指定了{files.js:[''/bundle.js']}很好的答案！对于使用HtmlWebPackPlugin的用户，请注意：确保配置对象指定了{files.js:[''/bundle.js']}