vue-cli webpack上传github预览问题

使用vue-cli搭建项目打包之后上传到github之后设置预览，点开之后一片空白，WTF? 明明 npm run dev跑的时候一点问题没有啊！如果你遇到同样的问题，请继续看下去。
在vue-cli中，有一个 .gitignore 文件，一般某个项目dev过程中都会产生一些中间文件，这些文件是我们不想要追踪的，git中可以使用.gitignore文件来忽略这些文件

1.jpg

注意那个 dist/ dist文件是 npm run build 执行后被编译打包生成的文件，CSS、JS、图片等文件都在dist文件中，所以该文件必须要提交到github上，我们需要把它删掉然后再上传。
这时由于文件都在dist里面，所以我们的预览需要手动加上dist/，如下图

image.png
好的，接下来就可以愉快的预览了！刷新页面之后发现...摔！为什么还是空白啊，打开控制台看看报错，原来是文件的路径错误了，这个就好解决了，只需要找到配置文件更改下路径，找到config/index.js文件，如下图
2.jpg

修改图中assetsPublicPath的参数，每次 npm run build 后的文件路径将会按照参数生成。