vue项目打包element-icons路径错误

问题描述

vue项目打包之后，部署运行时报错显示字体路径错误/static/css/static/fonts/element-icons.535877f.woff，正确路径是/static/fonts/element-icons.535877f.woff。

解决办法

1.在build/utils下的ExtractTextPlugin.extract下添加publicPath:'../../'

    // (which is the case during production build)
    if (options.extract) {
      return ExtractTextPlugin.extract({
        use: loaders,
        fallback: 'vue-style-loader',
        publicPath: '../../' // 在此处添加
      })
    } else {
      return ['vue-style-loader'].concat(loaders)
    }
  }

2.更改config/index.js中build下的assetsPublicPth, 原本为/, 改为./。

build: {
    index: path.resolve(__dirname, '../dist/index.html'),
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: './',         // 更改这里
    ....
}