Vue-cli项目打包并访问

1、修改build文件夹下的utils.js文件

  在options.extract的逻辑里面增加  publicPath: '../../' ,防止处理打包后找不到静态文件

2、修改config文件夹下的index.js

  修改assetsPublicPath:'./' ,防止js文件找不到

3、在vue项目根目录,运行npm run build,会在项目根目录的生成dist文件夹(后面nginx直接访问文件夹)

4、配置nginx反向代理,修改nginx .conf文件,增加以下配置(window为例)

  server {

    listen 8080;
    server_name localhost;
    location / {
      root dist目录地址;   #例如:D:\vueCode\my-projectdist\
      index index.html;
    }

  }

5、浏览器输入http://localhost:8080/index.html 访问即可

原文地址:https://www.cnblogs.com/wangsizheng/p/12966312.html