RangeError [ERR_FS_FILE_TOO_LARGE]求助：打包SVG时文件大小超2GB

问题场景 #

使用@svgr/webpack打包./src/images/services/devops-2.svg时构建失败，报错：
RangeError [ERR_FS_FILE_TOO_LARGE]: 文件大小(9509257216)大于2GB
错误堆栈：
at new NodeError (node:internal/errors:372:5)
at FSReqCallback.readFileAfterStat [as oncomplete] (node:fs:335:11)

处理方案 #

1. 优先检查文件有效性 #

9.5GB的SVG绝对不符合常规，大概率是文件损坏、下载中断或误生成的垃圾文件，先做这几步：

• 打开文件确认是否为标准SVG格式，若打不开或内容乱码，直接重新获取正确的SVG文件。
• 正常SVG文件大小通常在KB级别，最多不超过几十MB，超出这个范围基本存在异常。

2. 特殊场景：处理超大SVG（不推荐生产环境使用） #

如果确实有特殊需求要处理2GB以上的SVG，Node.js默认fs.readFile不支持读取该大小的文件，可通过自定义webpack loader改用流式读取：

• 新建custom-svgr-loader.js：

const { compile } = require('@svgr/core');
const fs = require('fs').promises;
const { createReadStream } = require('fs');
const { pipeline } = require('stream/promises');
const { StringDecoder } = require('string_decoder');

module.exports = async function (source) {
  const fileStats = await fs.stat(this.resourcePath);
  // 判断文件是否超过2GB阈值
  if (fileStats.size > 2 * 1024 ** 3) {
    let svgContent = '';
    const decoder = new StringDecoder('utf8');
    const readStream = createReadStream(this.resourcePath);
    
    // 流式读取文件内容
    await pipeline(
      readStream,
      async function* (sourceStream) {
        for await (const chunk of sourceStream) {
          svgContent += decoder.write(chunk);
        }
        svgContent += decoder.end();
      }
    );
    
    // 调用@svgr编译SVG为组件
    const componentCode = await compile(
      svgContent,
      {},
      { componentName: 'SvgComponent' }
    );
    return componentCode;
  }
  // 正常大小文件走默认处理逻辑
  return source;
};

• 在webpack配置中替换loader：

module.exports = {
  module: {
    rules: [
      {
        test: /\.svg$/i,
        use: ['./custom-svgr-loader.js'],
      },
    ],
  },
};

⚠️ 注意：超大SVG会严重拖慢构建速度，运行时也会占用大量内存，非必要场景不建议使用。

3. 压缩SVG（针对有效但体积超标的文件） #

若SVG是有效的但体积过大，先用svgo工具压缩：

# 全局安装svgo（未安装时执行）
npm install -g svgo
# 压缩指定SVG文件并输出到新文件
svgo ./src/images/services/devops-2.svg -o ./src/images/services/devops-2-min.svg

之后将项目中引用的文件替换为压缩后的版本，再重新打包即可。

内容的提问来源于stack exchange，提问作者Muhammad Asif