Vue项目中index.html中的相对路径，打包后未变成绝对路径如何修改

Question

问题描述在Vue项目中，index.html 我使用了script标签引入了一个在static目录下的文件这是项目目录，我的js在static/js/xxxx.js<script src="./static/js/xxx.js" ></script>在dev情况下是可以使用的，但是在打包到dist后，dist目中的index.html,还是<script src="./static/js/xxx.js" ></script>这样的话，我已经该怎么修复呢

Answer 1

在webpack.base.conf.js中

resolve: {    extensions: ['.js', '.vue', '.json'],
    alias: {      'vue$': 'vue/dist/vue.esm.js',      '@': resolve('src'),      'static':path.resolve(__dirname,'../static')  //添加这行
    }
  },

使用时 'static/js/lalal.js' 前面不用 ./

utils.js中

if (options.extract) {      return ExtractTextPlugin.extract({
        use: loaders,
        fallback: 'vue-style-loader',
        publicPath:'../../'   //添加这行
      })
    } else {      return ['vue-style-loader'].concat(loaders)
    }
  }

index.js中

assetsPublicPath: './', //前面加个点

这样打包后路径就不会有错了

Answer 2

如果你用history模式，是不用修改配置文件的配置打包路径的，你只需要让后台配置，并且你还要做一个路由跳转错误处理。如果你是使用hash模式，那么你就采用1楼所说的办法。