VUE项目的URL一般都会带有一个#，开启历史模式history mode后就可以去掉。但是这样会有一个问题，当我们部署后，访问一个非主页的路径，比如www.xxxxx.com/login ，会报出404错误。
这是因为VUE中的URL都是虚假的，实际是不存在的，自然会报404，所以我们需要调整下该项目文件夹下的URL重写rewrite。

下面以Apache为例（因为我没用过Nginx）

确定开启了mod_rewrite模式

开启方式不详述了，Centos7的模块配置默认在/etc/httpd/conf.modules.d。

开启网站文件夹的AllowOverride

找到对应网站的配置VirtualHost，添加

<Directory /var/www/xxxxx>
	Options FollowSymLinks
	AllowOverride All
</Directory>

/var/www/xxxxx是你的网站目录，因为一台服务器可能会布置多个网站，所以不建议全局开启AllowOverride，按需配置就行。
最终结果如下

<VirtualHost *:80>
DocumentRoot /var/www/xxxxx
ServerName www.xxxxx.com
	<Directory /var/www/xxxxx>
		Options FollowSymLinks
		AllowOverride All
	</Directory>
...
</VirtualHost>

重启Apache，没有报错就配置成功了。

编写.htaccess文件

编写URL重写规则

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

编写完成后将其放在网站根目录下。注意是最后打包生成的根目录下，vue生成在dist文件夹下。

处理404页面

VUE的路由是按照路由配置顺次匹配的，在路由配置的最后加上如下代码处理不存在的页面，并返回自己写的404页面

{
	path: '*',
	name: '404',
	component: resolve => require(['@/page/404.vue'], resolve)
}

到这里就配置OK了，访问一下试试吧