vue-cli构建项目 npm run build后应该怎么运行在本地查看效果 (未完待续)

运行npm run build 本地查看页面效果

本文以vue官方脚手架vue-cli构建的项目为例

这时如果直接运行npn run build是可以运行并打包你的代码的,不会报任何异常或错误,但是你会看到你的命令行打包完成有这样一句提示:

1
2
3
Build complete.
Tip: built files are meant to be served over an HTTP server.
Opening index.html over file:// won\'t work

运行完npm run build,打开项目中的dist目录下的index.html文件!
看到index.html的 控制台会出现一片404 如下图:
run_build_console_error

解决方案

因为 config 目录下的 index.js 中的 build 配置的 assetsPublicPath / 绝对路径,所以找不到打包以后的资源
我们只要报 build 中的 assetsPublicPath 改为 ./ 就可以了,在运行一次npm run build,再打开index.html就可以在本地看了