vue+element-ui 打包问题

最新推荐文章于 2023-09-25 09:09:34 发布

Luck Young

最新推荐文章于 2023-09-25 09:09:34 发布

阅读量1.5k

点赞数

CC 4.0 BY-SA版权

分类专栏： Vue 前端文章标签： vue element 没有图标 icon vue打包

本文链接：https://blog.youkuaiyun.com/Mote123/article/details/99425432

前端同时被 2 个专栏收录

49 篇文章

订阅专栏

Vue

24 篇文章

订阅专栏

本文介绍了解决Vue2.x结合Element UI在打包后出现的字体资源路径错误问题，通过修改webpack配置和utils.js文件，确保字体资源正确加载。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

vue2.x+element-ui打包后会出现字体找不到，在链接字体的时候会出现static/css/static/font这种路径

解决办法：

1.在build目录下webpack.base.conf.js确认配置

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

2.在build目录下utils.js修改

找到如下配置添加publicPath: '../../'


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