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就不会报错了。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容