vue项目build打包后，静态和服务器访问效果出不来，icon图标无法加载？过来我教你

今天遇到一个令人很头疼的问题，vue项目build之后，静态资源和服务器端访问空白，啥效果都没有，最后无奈只好查百度，找方法，正当我放弃的时候，突然找到了救心丸

来，直接上图

好不容易打包好的文件，结果给我报一堆错，难怪页面出不来

当页面出不来时，可能是你的路径不对

查原因是因为绝对路径的原因：你的config文件夹中的index.js文件，里面的build代码块路径是这样的

这里的assetsPublicPath路径是根路径，静态资源当然是访问不到的，修改后是这样的，及那个绝对路径改为相对路径就好了

你以为这样就完了？当然不是，还有src文件夹里面的router文件夹下面的index.js文件。艾玛，绕死我了。里面默认是hash模式，但如果你改成了history模式，这个也会导致页面的加载失败，所以必须改为hash模式，因为这个是默认的，一般删掉mode就好

然后打包的基本页面就可以正常显示了，没错就是可以显示了，但是图时候图片还是出不来

哎，你说气不气，折腾半天图片还出不来，来，继续
进入build文件夹中的utils.js，在里面找到如下代码块，比较难找，仔细点，你就会发现什么
代码留这里了，可以复制，进文件查找

if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
fallback: ‘vue-style-loader’,
})
} else {
return [‘vue-style-loader’].concat(loaders)
}
}

这次不需要改什么了，只需添加我箭头处的这段代码publicPath: ‘…/…/’，就真的完成了

最后一件事，将代码重新打包，无论传服务器还是静态资源都可以正常访问了，