vue项目打包填坑记1——vue项目打包后打开index.html页面显示空白，静态资源加载不到

打包的的命令都很熟悉 npm run build

 

打包之后生成一个名为dist的文件夹，里面是打包后的项目文件和资源。但是，打开index.html文件后却显示一片空白

原因分析：

        config文件夹下index.js里面关于build的配置，有一个属性assetsPublicPath，默认是 '/'，意思是根目录，会从index.html所在硬盘的根目录找文件资源，自然是找不到，所以才会显示空白界面

解决办法：

        只需要把assetsPublicPath属性改成 './' ，这时候变成了相对路径，会从index.html同级别文件开始查找资源

以上方法只对vue-cli2.x生效，从vue-cli3.x，vue-cli4.x发现找不到这个文件夹了，是因为这些版本已经废弃了这个配置，需要在src文件夹同级手动建立vue.config.js文件，进行相关配置

module.exports = {
    baseUrl : './',    //vue-cli3.x写法
    publicPath : './'    //vue-cli4.x写法
}