Webpack Devserver - Angular2 - 允许扩展答案

【问题标题】：Webpack Devserver - Angular2 - allowing extensionsWebpack Devserver - Angular2 - 允许扩展
【发布时间】：2016-12-08 11:12:47
【问题描述】：

所以对于out app，要求所有的URL都有.app扩展名...

所以http://domain/news.app http://domain/article.app?blah=blah

虽然这在生产（apache）服务器上运行良好（实际解析扩展）但它在我的 webpack 开发服务器上不起作用......或者至少我找不到任何设置来使它工作

例如，在我的 Angular 应用程序路线中，我有这个

const appRoutes: Routes  = [
    { path: 'home.app', pathMatch: 'full', component: AppPage},
    { path: 'news.app', pathMatch: 'full', component: AppNews}
];

webpack.dev 配置

output: {
    path: helpers.root('dist'),
    publicPath: 'http://localhost:8080/',
    filename: '[name].js',
    chunkFilename: '[id].chunk.js'
},

所以如果我这样做http://localhost:8080/news.app .... 我明白了

无法获取 /news.app

如何设置允许 /news.app 的开发服务器？

【问题讨论】：

标签： angular webpack webpack-dev-server

【解决方案1】：

devServer: {
    port: 8080,
    historyApiFallback: {
      index: 'index.html'
    }
  }

这会将您的所有调用重定向到 index.html ，然后 Angular2 路由器将从那里获取它。

historyApiFallback 背后的奥秘当然是，它会告诉 webpack 在任何情况下都回退到 index.html。

【讨论】：

似乎不起作用....将进行更多测试...是否可能由于 baseurl 未设置为“/”而不起作用？会做一些调查和报告
输出路径中设置“dist”的可能原因是什么？
我找到了使它起作用的设置 historyApiFallback: {disableDotRule: true}, - 谢谢

【解决方案2】：

I found the setting in historyApiFallback .... 解决了我的问题

historyApiFallback: {
    disableDotRule: true
},

感谢 xe4me 为我指明了正确的方向

【讨论】：