vue部署到nginx的location配置（能够在不一样路径刷新404）

我项目中设置vue路由为history模式，项目就会少了地址栏的#号，比较美观，同时也会存在一系列问题。部署到nginx后会存在刷新404的问题。因此想用好该模式须要后端配合。官网有说明的

 

nginx的配置

修改nginx的location配置，使用try_files直接指定到index.html文件

location / {
            # root 根目录，默认nginx下的html文件夹，能够指定其余
            root   ./html;
            index  index.html;
            # vue的路由并非真实物理路由，因此用try_files，路径都指向根目录下的index.html
            try_files $uri $uri/ /index.html;
        }
root：随便指定一个目录，目录下存放vue构建后的文件

index：指定的首页文件

try_files：由于vue的路由都是从index.html做为入口，因此用try_files就对了

js、css等引入失败

js、css等文件路径加载有误，跟地址栏的路由拼接起来做为js、css的目录了。找了不少资料，后来发现，是由于个人配置中使用了相对路径

 

查找好久，刚开始觉得是nginx的锅，后来才发现，原来是我改为相对路径致使的

assetsPublicPath: './',
项目中config文件夹下index.js中，默认是"/"，由于本地打开build时页面空白，因此修改为相对路径"./"，结果影响到部署服务器了。由于个人路由模式是history，并且存在多个子路由。因此应该改为绝对路径。才能正常引入vue编译后的js、css文件

改为

assetsPublicPath: '/',
一切正常