1.项目打包
在项目目录下使用npm run build命令进行打包操作。打包完成后如下：

dist就是打包完成后的文件，将该文件上传到自己的服务器中。
2.nginx配置

server {  
        server_name 47.xx.xx.xx;  
        location / {  
                root /home/vue/dist;  
                #add_header Cache-Control no-cache;  
                try_files $uri $uri/ @router;  
                index index.html;  
        }  
        location @router {  
                rewrite ^.*$ /index.html last;  
        }  
        location /v2 {  
                proxy_redirect off;  
                proxy_set_header User-Agent 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.94 Safari/537.36';  
                proxy_pass http://api.douban.com;  
        }  
        location /api {  
                proxy_redirect off;  
                #proxy_set_header Host 47.xx.xx.xx;  
                proxy_set_header X-Real-IP $remote_addr;  
                add_header Access-Control-Allow-Origin m.douban.com;  
                add_header Access-Control-Allow-Credentials true;  
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;  
                proxy_pass http://47.xx.xx.xx:8090/api;  
        }  
        location /douban_search {  
                proxy_redirect off;  
                proxy_pass https://m.douban.com/j;  
                add_header Access-Control-Allow-Origin m.douban.com;  
                add_header Access-Control-Allow-Credentials true;  
        }  
}  

填下端口，域名或ip地址，root /home/vue/dist;是项目的存放地址，try_files $uri $uri/ @router;解决vue-router history下刷新404的问题，location /v2后都是nginx的反向代理，加入反向代理主要是处理跨域的问题，一般在调试时，大都采用webpack的devServer来处理跨域问题，如下：

devServer: {  
    proxy: {  
      '/v2': {  
        target: 'http://api.douban.com',  
        ws: true,  
        changeOrigin: true,  
        pathRewrite: {  
          '^/v2': '/v2'  
        }  
      },  
      '/douban_search': {  
        target: 'https://m.douban.com',  
        ws: true,  
        changeOrigin: true,  
        pathRewrite: {  
          '^/douban_search': '/j'  
        }  
      },  
      '/api': {  
        target: 'http://47.xx.xx.xx:8090',  
        ws: true,  
        changeOrigin: true,  
        pathRewrite: {  
          '^/api': '/api'  
        }  
      }  
    }  

当使用反向代理时，检查好接口的路径，比如/js与/j,这样反向代理前端就会报错。推荐在打包时，在vue.config.js中指定assetsDir: 'static', // 打包后放置静态资源的文件夹，这样静态文件都会被放置在static路径下。
遇到的第二个问题，二级路由下，刷新页面找不到静态文件，找了好久，发现是路径的问题。
根据vue-cli版本不同，解决方式也不同，
vue-cli2：
设置webpack.dev.conf.js文件的output的publicPath属于为绝对路径：

 output: {  
    filename: "js/[name].[hash].js",  
    path: path.resolve(__dirname, "../dist"),  
    publicPath:'/'  
},  

vue-cli3-:
在vue.config.js中添加或修改：
publicPath: '/',