在 Babel 中配置内联图像导入

Question

我正在使用React.js和Babel，并导入不同大小的png图像(其中一些大小超过10kb(。当加载到 docker-compose url 时，相对路径不起作用。

这是我的 .babelrc 文件内容

{
  "presets": ["@babel/preset-env", "@babel/preset-react"],
  "plugins": [
    "@babel/plugin-proposal-class-properties",
    ["babel-plugin-styled-components", {
      "ssr": false,
    }],
    "babel-plugin-transform-inline-environment-variables"
  ]
}

所以我想将所有图像加载为 base64 aven 大小超过 10kb(限制(的图像。如何更改 Babel 的配置？

提前谢谢你！

Answer 1

我发现可以在limit的配置参数中为"url-loader"设置更大的大小。就我而言，我将 babel 和包裹一起使用，我.parcelrc设置如下：

{
  "url-loader": {
    "exts": ["jpg", "jpeg", "png", "gif", "svg"],
    "limit": 66666
  }
}