Vue——项目打包部署到nginx

1、修改vue项目config文件夹index.js文件

build: {
    index: path.resolve(__dirname, '../dist/index.html'),
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    // 绝大多数我们使用"/"  如果需要通过 '域名/demo/' 这样访问 就写成 '/demo/'
    assetsPublicPath: '/',
}

2、vue 项目进行打包

执行：npm run build

查看输出文件:dist 文件夹下生成这几个文件，dist放到/Users/wuxi/Desktop/下

3、nginx修改配置文件

mac参考安装：https://blog.csdn.net/wx19900503/article/details/80948809

修改配置文件 /usr/local/etc/nginx/nginx.conf

server {
        # 修改端口
        listen       8099;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            #html改成静态文件目录，我放到桌面去了
            #root   html;
            root   /Users/wuxi/Desktop/dist;
            index  index.html index.htm;
        }

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }

 4、启动nginx：nginx -c /usr/local/etc/nginx/nginx.conf

打开页面查看是否部署成功