vite2+mock+nginx注意事项

技术栈：vite2+nginx
前言：该文章对vite中使用mock的一个补充，使用过程可以看之前的文章，以及对生产环境打包在nginx发布的一些问题的解决记录

一、vite-plugin-mock相关

1、根据官方文档描述，开发环境是使用Connect中间件实现的，可以控制台中查看网络请求记录。生产环境则是通过拦截请求，所以在网络请求中查看不到
2、在使用mock时，通过axios调用接口，不能加上baseURL，否则会变成通过发送网络请求，在网络请求里可以查看到。因为上条所说在开发环境时使用Connect中间件所以没有影响，但是到生产环境就无法拦截到了，导致失败。所以最好两个环境都不加baseURL
3、如果不需要使用该功能，则在vite.config.ts中将localEnabled和prodEnabled都设置为false即可。当然另一种方式是加上baseURL，但是不推荐

二、build后在nginx发布相关

1、在npm run build后在nginx中运行，发现对于post请求会报“405 Method not allowed”的错误，原因是大多数web服务器，都不允许静态文件响应post请求。我通过在nginx.conf中添加如下代码解决

location / {
#   root   html;
	root   vue-dist;
    index  index.html index.htm;
	try_files $uri $uri/ /index.html;
	error_page 405 =200 $uri; #	添加该语句，将post的状态码从405改成200即可
}

2、在nginx中，修改完nginx.conf文件中的配置后，需要到有nginx.exe的目录下调用CMD或者Git Base执行./nginx -s reload重新加载才行，不然不会生效。当然还有重启电脑以及杀死进行重新运行两种方式，不推荐