Skip to content

Commit 7b0c1f2

Browse files
authored
fix: svgr should not work in css file (#1106)
1 parent ccc4a23 commit 7b0c1f2

File tree

4 files changed

+94
-3
lines changed

4 files changed

+94
-3
lines changed

packages/core/src/asset/assetConfig.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -139,7 +139,9 @@ const pluginLibAsset = ({ bundle }: { bundle: boolean }): RsbuildPlugin => ({
139139
const rule = config.module
140140
.rule(CHAIN_ID.RULE.SVG)
141141
.oneOf(CHAIN_ID.ONE_OF.SVG);
142-
rule.issuer([]);
142+
rule.issuer({
143+
not: CSS_EXTENSIONS_PATTERN,
144+
});
143145
}
144146
}
145147

tests/integration/asset/index.test.ts

Lines changed: 25 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -370,8 +370,9 @@ test('use json / yaml / toml', async () => {
370370

371371
test('use svgr', async () => {
372372
const fixturePath = join(__dirname, 'svgr');
373-
const { contents } = await buildAndGetResults({ fixturePath });
374-
373+
const { js, css } = await buildAndGetResults({ fixturePath, type: 'all' });
374+
const contents = js.contents;
375+
const cssContents = css.contents;
375376
// 0. bundle
376377
// esm
377378
const { content: indexJs } = queryContent(contents.esm0!, /index\.js/);
@@ -396,6 +397,7 @@ test('use svgr', async () => {
396397
);
397398

398399
// 2. bundleless only svgr
400+
// esm
399401
const { content: svgrLogoJs } = queryContent(
400402
contents.esm2!,
401403
/assets\/logo\.js/,
@@ -420,6 +422,27 @@ test('use svgr', async () => {
420422
/assets\/logo2\.cjs/,
421423
);
422424
expect(urlLogoCjs).toMatchSnapshot('should only contain url default export');
425+
426+
// 3. bundleless svg in css
427+
// esm
428+
const { content: cssEsm } = queryContent(cssContents.esm3!, /css-entry.css/);
429+
expect(cssEsm).toMatchInlineSnapshot(`
430+
".logo {
431+
background-image: url(./static/svg/logo.svg);
432+
}
433+
434+
"
435+
`);
436+
437+
// cjs
438+
const { content: cssCjs } = queryContent(cssContents.cjs3!, /css-entry.css/);
439+
expect(cssCjs).toMatchInlineSnapshot(`
440+
".logo {
441+
background-image: url(./static/svg/logo.svg);
442+
}
443+
444+
"
445+
`);
423446
});
424447

425448
test('use asset/source', async () => {

tests/integration/asset/svgr/rslib.config.ts

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,11 @@ export default defineConfig({
3636
// esm
3737
generateBundleEsmConfig({
3838
bundle: false,
39+
source: {
40+
entry: {
41+
index: ['src', '!src/css-entry.css'],
42+
},
43+
},
3944
output: {
4045
distPath: {
4146
root: './dist/esm/bundleless-mixed',
@@ -50,6 +55,11 @@ export default defineConfig({
5055
// cjs
5156
generateBundleCjsConfig({
5257
bundle: false,
58+
source: {
59+
entry: {
60+
index: ['src', '!src/css-entry.css'],
61+
},
62+
},
5363
output: {
5464
distPath: {
5565
root: './dist/cjs/bundleless-mixed',
@@ -65,6 +75,11 @@ export default defineConfig({
6575
// esm
6676
generateBundleEsmConfig({
6777
bundle: false,
78+
source: {
79+
entry: {
80+
index: ['src', '!src/css-entry.css'],
81+
},
82+
},
6883
output: {
6984
distPath: {
7085
root: './dist/esm/bundleless-only-svgr',
@@ -82,6 +97,11 @@ export default defineConfig({
8297
// cjs
8398
generateBundleCjsConfig({
8499
bundle: false,
100+
source: {
101+
entry: {
102+
index: ['src', '!src/css-entry.css'],
103+
},
104+
},
85105
output: {
86106
distPath: {
87107
root: './dist/cjs/bundleless-only-svgr',
@@ -96,6 +116,49 @@ export default defineConfig({
96116
}),
97117
],
98118
}),
119+
// 3. bundleless svg in css
120+
// esm
121+
generateBundleEsmConfig({
122+
bundle: false,
123+
source: {
124+
entry: {
125+
index: ['src/css-entry.css'],
126+
},
127+
},
128+
output: {
129+
distPath: {
130+
root: './dist/esm/bundleless-css-svg',
131+
},
132+
},
133+
plugins: [
134+
pluginSvgr({
135+
svgrOptions: {
136+
exportType: 'default',
137+
},
138+
}),
139+
],
140+
}),
141+
// cjs
142+
generateBundleCjsConfig({
143+
bundle: false,
144+
source: {
145+
entry: {
146+
index: ['src/css-entry.css'],
147+
},
148+
},
149+
output: {
150+
distPath: {
151+
root: './dist/cjs/bundleless-css-svg',
152+
},
153+
},
154+
plugins: [
155+
pluginSvgr({
156+
svgrOptions: {
157+
exportType: 'default',
158+
},
159+
}),
160+
],
161+
}),
99162
],
100163
output: {
101164
target: 'web',
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.logo {
2+
background-image: url('./assets/logo.svg');
3+
}

0 commit comments

Comments
 (0)