在单页面应用程序中捕获(意外)路由

时间:2018-11-06 21:26:21

标签: .htaccess react-router-dom

我有一个小测试应用程序,我已将其上传到域的子目录:mydomain.com/myapp。该应用程序内置于webpack,React和react-router-dom中。最复杂的路由是mydomain.com/app/parameter。现在,由于它位于linux / apache服务器上,因此我添加了一个.htaccess并包含以下信息:

RewriteEngine On

RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]

# Fallback all other routes to index.html
RewriteRule ^ /charts/index.html [L]

我要解决的问题是您手动输入以下URL之一:

  • mydomain.com/app/parameter/(斜线)
  • mydomain.com/app/parameter/blabla/123

在这两种情况下会发生什么:.htaccess指向mydomain.com/app/index.html,但是我的index.html具有指向脚本文件的相对路径:

<script type="text/javascript" src="main.js" />

因此,它尝试加载mydomain.com/app/parameter/main.js而不是mydomain.com/app/main.js。

一个明显的解决方案是将绝对路径放在我的index.html中,但我不知道如何在webpack中这样做,这会破坏我的webpack-dev-server本地版本(npm run start)。是否有Webpack方式可以解决此问题?

0 个答案:

没有答案