vue-cli3 build 文件路径报错

vue-cli3 build 文件路径报错

用vue-cli3 npm run build打包后，dist文件中index.html文件本地打开时，控制台报错：

Failed to load resource: the server responded with a status of 404 (Not Found)

官网的解释是：

dist 目录需要启动一个 HTTP 服务器来访问 (除非你已经将 baseUrl 配置为了一个相对的值)，所以以 file:// 协议直接打开 dist/index.html 是不会工作的。

解决办法：配置baseUrl

• 在根目录下创建一个vue.config.js文件(vue-cil 本身没有该文件)

• 配置vue.config.js文件如下

// vue.config.js
module.exports = {
    baseUrl:"./",
    outputDir:"dist",
    assetsDir:"assets",
    indexPath:"index.html",
    filenameHashing:true,
    pages:undefined,
    lintOnSave:true,
    runtimeCompiler:false,
    transpileDependencies:[],
    productionSourceMap:false,
    crossorigin:undefined,
    integrity:false,
    devServer:{//代理
        port:8080,
        proxy:'http://192.168.1.3:8080'
    }
}

重新npm run build，再次打开index.html就不会报错了。