vue-cli执行npm run build之后打开dist/index.html空白

现象

• 执行npm run build之后，生成dist目录，dist目录下是.index.html和js文件夹和css文件以及img图片文件夹。
• 通过浏览器打开/dist/index.html，浏览器一片空白。

解决方法

在项目跟目录下新增 vue.config.js

module.exports = {
    publicPath: './', //配置本地引用目录文件,如不配置，默认为`/`
}

原因分析

• 通过编辑器打开/dist/index.html并格式化，能够看到link标签，script标签引的文件都是跟目录，这里的跟目录是磁盘的跟目录，并不是当前文件夹的跟目录，所以我们在浏览器里打开index.html文件的时候是空白的，就是因为实际上并没有真正找到.css文件和.js文件。