vue+element-ui項目打包, element-icons.woff 和element-icons.ttf 字體文件路徑錯誤，解決方法

先修改 config/index.js文件，將 assetsPublicPath 的 ‘/’ 改爲 ‘./’

卸載現有的element-ui，重新安裝

npm uninstall element-ui
npm install element-ui

若不行，則繼續往下看

由下圖可知，通過url-loader將 woff2?|eot|ttf|otf 相關文件打包到 fonts/ 目錄下；

代碼

{
        test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
        loader: 'url-loader',
        options: {
          limit: 10000,
          name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
        }
      }

ExtractTextPlugin.extract配置的情況

在 build/utils 文件中的下圖所示位置添加 publicPath: ‘…/…/’

代碼

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

沒有ExtractTextPlugin.extract配置的情況

if (options.extract) {
      loaders.push({
        loader: MiniCssExtractPlugin.loader,
        options: {
          publicPath: '../../'
        }
      })
    } else {
      loaders.push('vue-style-loader')
    }