我在ubuntu(apache2服务器)上部署了vue cli项目更改vue路由器模式后,除索引外,所有页面在重新加载时均显示404页。
我将.htaccess添加到了index.html所在的/ dist路径,但仍然无法正常工作我不知道还有什么办法解决这个问题。有人知道吗?
这是我的项目dist文件夹
/home/admin/web/mali-nali.com/public_html/dist
。htaccess代码在dist中
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
</IfModule>
这是htacccess.madewithlove.be调试信息
RewriteEngine On RewriteEngine was now turned on
2 RewriteBase / Using / as the base for the rewrites.
3 RewriteRule ^index\.html$ - [L] This rule was not met.
4 RewriteCond %{REQUEST_FILENAME} !-f This condition was met.
5 RewriteCond %{REQUEST_FILENAME} !-d This condition was met.
6 RewriteRule . /index.html [L] The new url is https://mali-nali.com/index.html
The tests are stopped because of the L in your RewriteRule options.
所有不存在的页面的最后一条路线
{path: '/*',component:FourohFour, name:'404'}
来自https://router.vuejs.org/guide/essentials/history-mode.html#example-server-configurations
注意:以下示例假定您正在从根文件夹提供应用程序。如果部署到子文件夹,则应使用Vue CLI的publicPath选项和路由器的相关基础属性。
似乎是您所缺少的。
在您的Vue项目的根目录中,添加一个名为vue.config.js的文件,其代码如下。
module.exports = {
publicPath: process.env.NODE_ENV === 'production' ? '/mali-nali.com/' : '/'
}
然后仍然在Vue项目的根目录中,添加一个名为404.html的文件,并带有以下代码。
<!DOCTYPE html>
<html>
<head>
<script>
sessionStorage.redirect = location.href;
</script>
<meta http-equiv="refresh" content="0;URL='/mali-nali.com/'">
</head>
</html>
然后将您创建的404.html文件复制到/ dist文件夹中。希望对您有所帮助。