Vue.js踩坑记录：vue-cli 3.0 项目打包后页面空白

新建一个项目，使用vue-cli 3.0进行构建，使用了vux和vue-router，本地运行时是没有问题的，但是在打包之后，页面就一片空白，打开控制台会看到是各种资源引用出错。

这是因为webpack的配置不对，只需要将webpack的配置修改一下就好。

vue-cli 3.0 内置了webpack，并且将vue的配置文件作为了一个可选的配置（创建时没有），如果需要修改vue和webpack的配置，则需要自己建一个配置文件  vue.config.js  放在项目的根目录下。

然后设置一个baseUrl：

module.exports = {

    baseUrl: './'

}

这样在打包的时候，就能加载到静态资源了。

 

然后这个时候还没完，修改完之后，页面变成了这个样子：

 

 页面上只剩一个在App,vue里面的两个跳转按钮，并且跳转按钮跳转后也是不对的。

 这个是因为在router里面的mode配置，默认为 history ，只要将这个mode注释掉再打包，路由就争取了。

 

转载于:https://www.cnblogs.com/Naiky/p/11578157.html