Galan小屋

welcome my blog

vue-cli构建项目

By galan99

发表于 2017-04-22

npn run build后本地无法预览

运行npm run dev以开发模式打开调试好了你的案例程序;你还不满足于仅仅把代码放在github上,想直接能把案例效果build版本的代码在本地预览或者放在你的个人博客上供大家直接看效果学习。

如果直接运行npn run build是可以运行并打包你的代码的,不会报任何异常或错误,你惊奇地发现网页一片空白。

build后cmd控制台有以下提示:

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

为什么会这样呢?还得build后的提示说起,提示的中文翻译是【提示:构建文件务必放在一个HTTP服务器。直接打开index.html文件将不工作】

接下来,你默默的打开了控制台,看到console tab下一片404的各种找不到资源;

解决方案

到项目目录下的config文件夹里的index.js文件中的build对象,将assetsPublicPath中的“/”,改为“./”即可,就在前面加个点就可以了,并在build\build.js将这两句的提示信息删掉或注释掉,再打包直接用浏览器直接运行就好了。

提示

vue-router的mode 模式不能为history,这也是奇怪的地方,只能说奇葩。。。