Skip to content

[Bug]: [email protected] incorrect implementation? raw import #4936

Closed
@tiny-ant

Description

@tiny-ant

Version

System:
    OS: Linux 5.4 Debian GNU/Linux 11 (bullseye) 11 (bullseye)
    CPU: (32) x64 AMD EPYC 9Y24 96-Core Processor
    Memory: 37.57 GB / 61.56 GB
    Container: Yes
    Shell: 5.8 - /usr/bin/zsh
  npmPackages:
    @rsbuild/core: ^1.3.1 => 1.3.1 
    @rsbuild/plugin-less: ^1.1.1 => 1.2.1 
    @rsbuild/plugin-react: ^1.1.1 => 1.1.1 
    @rsbuild/plugin-svgr: ^1.0.7 => 1.0.7

Details

?raw导入语法对css文件正常提取了原始内容,但是处理.svg文件时却自动进行了base64处理,对于svg文件来说,?raw导入与?inline导入语法的处理结果完全相同,都是base64处理后的结果,这不太合理,另一方面这个行为也与webpack的raw-loader不兼容。

还有一个问题,当?raw导入的文件较大时,得到的结果又会变成文件路径,而不是文件内容..,我的使用场景是希望下面这段代码能正常工作:

import spriteStr from 'common/assets/symbols.svg?raw';

function loadSprite() {
  const div = document.createElement('div');
  div.innerHTML = `<svg style="position: absolute; width: 0px; height: 0px; overflow: hidden;">${spriteStr}</svg>`;

  if (!div.firstChild) {
    return;
  }

  if (document.body.firstElementChild) {
    document.body.insertBefore(div.firstChild, document.body.firstElementChild);
  } else {
    document.body.appendChild(div.firstChild);
  }
}
loadSprite();

但实际上spriteStr的值却变成了类似'/static/svg/mobile.70bddcc8.svg'这样的路径值,很明显,?raw的行为在某些场景下即不稳定也不正确。

Reproduce link

https://www.marscode.cn/ide/d575vj275083yl

Reproduce Steps

run pnpm i & pnpm run dev

Metadata

Metadata

Assignees

No one assigned

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions