vue打包部署解决页面刷新404的问题

1.Nginx服务器配置:

location ^~/vue {
    alias /data/wwwroot/vue;
    index index.html;
    try_files $uri $uri/ /vue/index.html;
}

2.Apache服务器配置:

开启mod_rewrite模块,设置allowAllOveride All并在项目目录下创建.htaccess文件,内容如下:

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /vue/index.html [L]
</IfModule>

Apache反向代理配置

1、修改APACHE配置文件httpd.conf

修改加载模块

LoadModule proxy_module modules/mod_proxy.so

LoadModule proxy_http_module modules/mod_proxy_http.so

2、修改虚拟目录配置httpd-vhost.conf

<VirtualHost>

ServerName ?www.test.com #设置需要代理的域名

ServerAias ?www.test.com

<Proxy http://www.test.com>

Options MultiViews

AllowOverride None

Order allow,deny

Allow from all

</Proxy>

ProxyPass / http://192.168.0.2/ ? ?#设置代理目标服务器及访问的目录

ProxyPassReverse / http://192.168.0.2/

ErrorLog “/log/www.test.com-error.log”

Transferlog “/log/www.test.com-access.log”

</VirtualHost>

3、重启apache服务器生效

cd /data/apache/bin

./apachectl restart