上午已经把Nginx安装好，现在就进行部署。
打包项目
npm run build
image.png
然后会在项目根目录中生成
dist文件夹
Nginx配置
打开Nginx的配置文件 E:\nginx-1.15.12\conf\nginx.conf
image.png
然后启动Nginx，访问http://localhost，项目正常运行起来了。
image.png
遇到的问题
项目看似已经正常运行了，能正常跳转，但是在我刷新页面的时候出错了。
image.png
解决方式一：
把vue-router的mode修改为hash，如果不配置默认就是hash，我是修改过所以要改回来。
mode: "hash",
image.png
··
然后重新打包就可以了，但是这种模式会在
Url上面出现非常丑的#，如果不介意就这样就可以了，我是受不了。
解决方式二：
mode: "history",
我就非要把 #号搞掉，那么可以在Nginx里面配置一句话.
try_files $uri $uri/ /index.html;
image.png
至于这句话是啥意思可以百度查查，我就简单的理解为
rewrite
解决方式三 - 网上看到的没有测试过，只是做个记录
匹配errpr_page
location /{
root /data/nginx/html;
index index.html index.htm;
error_page 404 /index.html;
}
暂时我就只遇到这点问题，遇到其他问题在记录。
网友评论