nginx中部署vue前端项目

首先当然是阿里云服务器购买以及Vue项目的编写了，服务器购买就不说了，Vue项目打包npm run dev的时候要注意一下，主要是config/index.js里assetsPublicPath要配置成 './'(原来是'/'),不然在上线后会什么也没有，还有就是如果使用了axios跨域(跨端口)的话，并且是使用proxyTable配置如下的话:
proxyTable: {
    '/api': {
        target: 'localhost:9080',
        changeOrigin: true,
        pathRewrite: {
            '^/api': ''
        }
    }
}
// 主要主要是把localost:8080/api/findAll(Vue默认监听8080端口),转发到localhost:9080/findAll

那么需要配置一下nginx，

更改nginx配置,主要更改server配置
server {
    ...省略代码
    root        /var/www/vuemusic;
    // 代码(npm run build之后dist文件夹里的文件,不要直接传dist文件夹)通过Xftp上传到/var/www/vuemusic目录下
    location / {
        root /var/www/vuemusic;
        index index.html;
    }

    location /api {
        rewrite ^.+api/?(.*)$ /$1 break;
        proxy_pass http://59.110.127.125;
        // 作用和proxyTable差不多
    }
}

重启nginx就可以看到首页了