Vue-router 不会在 webpack 模板中捕获带有点的路由

Question

我从 webpack template 引导我的应用程序并将路由 /edit/:filename 添加到它。

问题是，包含点的文件名由 Express 处理，而不是由我的 Vue 应用程序处理。

换句话说，/edit/123 与路由匹配，但 /edit/123.json 或 /edit/123.txt 不匹配，我从 Express 得到 404。

如何在我的路线中匹配任何内容或至少/edit/anyfilename.json？

Answer 1

我在 Vue 论坛上收到了来自 Linus Borg 的 answer。 Vue webpack template 使用 connect-history-api-fallback 将所有 HTTP 请求重定向到 index.html。除非 disableDotRule 设置为 true，否则它会跳过路径中带有点的 HTTP 请求。正确的配置是

app.use(require('connect-history-api-fallback')({
  disableDotRule: true,
  rewrites: [
    {from: /\/app.js/, to: '/app.js'}
  ]
}))

请注意，我们必须对 /app.js 添加额外的重写，以便它不会重定向到 index.html。