vuecli 自动转换小文件为 base64 格式,如何关闭?

1. 问题

最近在写 vue 项目时,发现稍微小一点的静态资源,例如字体文件, 图片都被自动转换为 base64 格式了。

在网上搜索时基本都是去配置 url-loader ,配置后提示:Can't resolve 'url-loader'看了依赖文件中并没有 url-loader 这个库。


2.原因

目前最新的 vue-cli 版本是基于 webpack5 的,在 webpack4 的时候是用 url-loader 等 loader 来处理静态资源,5 则是用 asset 模块(asset module)来处理的,


3.解决办法

如果不需要自动转换为 base64 格式,可以使用以下配置,调整转换生效的最大文件大小,这里设置的是 4kb(默认应该是 8kb)

module.exports = {
  //...
  module: {
    rules: [
      {
        //...
        parser: {
          dataUrlCondition: {
            maxSize: 4 * 1024,
          },
        },
      },
    ],
  },
};

详情可以看 webpack5 文档里的解释:https://webpack.docschina.org/guides/asset-modules/#general-asset-type

posted @   镜暮  阅读(857)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· 没有源码,如何修改代码逻辑?
· PowerShell开发游戏 · 打蜜蜂
· 在鹅厂做java开发是什么体验
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战
点击右上角即可分享
微信分享提示