码迷,mamicode.com
首页 > 其他好文 > 详细

vue项目打包部署elementUI的字体图标丢失问题

时间:2019-06-29 14:40:10      阅读:125      评论:0      收藏:0      [点我收藏+]

标签:vue-cli   图标   webpack   plugin   text   ons   项目   自己   llb   

自己搭建的Vue项目,没有使用vue-cli,引入elementUI时,使用的是webpack直接打包工具,发现字体图标丢失你

记录一下解决办法:

webpack module配置:(build目录下webpack.base.conf.js文件)

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

webpack 的utils.js 修改:(build目录下utils.js文件)

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

 

只是加了  publicPath: ‘../../‘

然后打包字体图片就可以显示了

vue项目打包部署elementUI的字体图标丢失问题

标签:vue-cli   图标   webpack   plugin   text   ons   项目   自己   llb   

原文地址:https://www.cnblogs.com/sloanlv/p/11106513.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!