解决vue cli3.x打包上线静态资源找不到路径问题

本教程适用于vue-cli3.x版本搭建的vue项目，解决项目本地运行一切正常，但是打包后部署时页面白屏，控制台报错，静态资源找不到的问题。

首先简单说说vue-cli3.x版本的变化，从文件夹上来看，少了build、config文件夹，那如何像2.x一样配置呢？3.x可以在项目根目录创建一个vue.config.js,之前的配置都在这里面配置。

【官方】vue.config.js 是一个可选的配置文件，如果项目的 (和 package.json 同级的) 根目录中存在这个文件，那么它会被 @vue/cli-service 自动加载。你也可以使用 package.json 中的 vue 字段，但是注意这种写法需要你严格遵照 JSON 的格式来写。

那么问题就很简单了，我们在项目根目录看下是否有vue.config.js，如果有，加一句代码。

就是在exoorts里面加上：

publicPath: './',

没有的话，我们就新建一个vue.config.js文件，内容如下：

module.exports = {    publicPath: './'}

然后打包发布即可。

关于vue.config.js文件，配置该文件可以参考:

https://cli.vuejs.org/zh/config/#%E7%9B%AE%E6%A0%87%E6%B5%8F%E8%A7%88%E5%99%A8

获取更多优质内容,请关注【青年码农】