vue3.0 build后出现的问题

打包到本地dist包之后,让别人访问你的项目:
直接npm run build 后,
在生成的dist文件夹中,打开index.html,打开错误,或者打开后,js文件读取失败,console控制台报错时:

截屏2021-05-06 下午2.38.06.png

  1. 可以在vue.config.js中配置将publicPath属性的值'/'改为'./',防止找不到静态资源文件。
    然后,继续打开index文件后,控制台不报错了,但还是显示空白,则:
  2. 执行下面命令:
    npm install http-server -g
    然后在dist文件下执行:
    http-server
image.png

出现这种情况的话 window 要去配置一下管理员权限 power shell,mac的话要是用管理员权限sudo

  Starting up http-server, serving ./
  Available on:
  http://127.0.0.1:8080
  http://xxx.xxx.x.x:8080

成功地话,访问生成的地址

  1. 如果该地址还是访问错误,但是在命令行中却有日志,


    image.png

image.png

则执行下面的命令:
npm install -g anywhere
在dist文件下执行
anywhere -p 8080
-p 后跟端口号
成功后控制台会显示:

Running at http://xxx.xxx.xx.xx:8080/
Also running at https://xxx.xxx.x.x:8081/

本文章引用了vue cli3.0 打包后的问题处理让被人访问 安装http-server的文章

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容