Skip to content

Commit f5de67a

Browse files
fix: allow to import CSS using @use with css extension
1 parent 7bfefda commit f5de67a

7 files changed

+98
-21
lines changed

test/__snapshots__/loader.test.js.no-node-sass.snap

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21303,6 +21303,10 @@ exports[`loader should work when "@use" at-rules with extensions ('dart-sass', '
2130321303

2130421304
.example-5 {
2130521305
color: aquamarine;
21306+
}
21307+
21308+
.some-css-module {
21309+
background: hotpink;
2130621310
}"
2130721311
`;
2130821312

@@ -21325,6 +21329,10 @@ exports[`loader should work when "@use" at-rules with extensions ('dart-sass', '
2132521329

2132621330
.example-5 {
2132721331
color: aquamarine;
21332+
}
21333+
21334+
.some-css-module {
21335+
background: hotpink;
2132821336
}"
2132921337
`;
2133021338

@@ -21347,6 +21355,10 @@ exports[`loader should work when "@use" at-rules with extensions ('dart-sass', '
2134721355

2134821356
.example-5 {
2134921357
color: aquamarine;
21358+
}
21359+
21360+
.some-css-module {
21361+
background: hotpink;
2135021362
}"
2135121363
`;
2135221364

@@ -21369,6 +21381,10 @@ exports[`loader should work when "@use" at-rules with extensions ('dart-sass', '
2136921381

2137021382
.example-5 {
2137121383
color: aquamarine;
21384+
}
21385+
21386+
.some-css-module {
21387+
background: hotpink;
2137221388
}"
2137321389
`;
2137421390

@@ -21391,6 +21407,10 @@ exports[`loader should work when "@use" at-rules with extensions ('dart-sass', '
2139121407

2139221408
.example-5 {
2139321409
color: aquamarine;
21410+
}
21411+
21412+
.some-css-module {
21413+
background: hotpink;
2139421414
}"
2139521415
`;
2139621416

@@ -21413,6 +21433,10 @@ exports[`loader should work when "@use" at-rules with extensions ('dart-sass', '
2141321433

2141421434
.example-5 {
2141521435
color: aquamarine;
21436+
}
21437+
21438+
.some-css-module {
21439+
background: hotpink;
2141621440
}"
2141721441
`;
2141821442

@@ -21435,6 +21459,10 @@ exports[`loader should work when "@use" at-rules with extensions ('sass-embedded
2143521459

2143621460
.example-5 {
2143721461
color: aquamarine;
21462+
}
21463+
21464+
.some-css-module {
21465+
background: hotpink;
2143821466
}"
2143921467
`;
2144021468

@@ -21457,6 +21485,10 @@ exports[`loader should work when "@use" at-rules with extensions ('sass-embedded
2145721485

2145821486
.example-5 {
2145921487
color: aquamarine;
21488+
}
21489+
21490+
.some-css-module {
21491+
background: hotpink;
2146021492
}"
2146121493
`;
2146221494

@@ -21479,6 +21511,10 @@ exports[`loader should work when "@use" at-rules with extensions ('sass-embedded
2147921511

2148021512
.example-5 {
2148121513
color: aquamarine;
21514+
}
21515+
21516+
.some-css-module {
21517+
background: hotpink;
2148221518
}"
2148321519
`;
2148421520

@@ -21501,6 +21537,10 @@ exports[`loader should work when "@use" at-rules with extensions ('sass-embedded
2150121537

2150221538
.example-5 {
2150321539
color: aquamarine;
21540+
}
21541+
21542+
.some-css-module {
21543+
background: hotpink;
2150421544
}"
2150521545
`;
2150621546

@@ -21523,6 +21563,10 @@ exports[`loader should work when "@use" at-rules with extensions ('sass-embedded
2152321563

2152421564
.example-5 {
2152521565
color: aquamarine;
21566+
}
21567+
21568+
.some-css-module {
21569+
background: hotpink;
2152621570
}"
2152721571
`;
2152821572

@@ -21545,6 +21589,10 @@ exports[`loader should work when "@use" at-rules with extensions ('sass-embedded
2154521589

2154621590
.example-5 {
2154721591
color: aquamarine;
21592+
}
21593+
21594+
.some-css-module {
21595+
background: hotpink;
2154821596
}"
2154921597
`;
2155021598

test/__snapshots__/loader.test.js.snap

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23711,6 +23711,10 @@ exports[`loader should work when "@use" at-rules with extensions ('dart-sass', '
2371123711

2371223712
.example-5 {
2371323713
color: aquamarine;
23714+
}
23715+
23716+
.some-css-module {
23717+
background: hotpink;
2371423718
}"
2371523719
`;
2371623720

@@ -23733,6 +23737,10 @@ exports[`loader should work when "@use" at-rules with extensions ('dart-sass', '
2373323737

2373423738
.example-5 {
2373523739
color: aquamarine;
23740+
}
23741+
23742+
.some-css-module {
23743+
background: hotpink;
2373623744
}"
2373723745
`;
2373823746

@@ -23755,6 +23763,10 @@ exports[`loader should work when "@use" at-rules with extensions ('dart-sass', '
2375523763

2375623764
.example-5 {
2375723765
color: aquamarine;
23766+
}
23767+
23768+
.some-css-module {
23769+
background: hotpink;
2375823770
}"
2375923771
`;
2376023772

@@ -23777,6 +23789,10 @@ exports[`loader should work when "@use" at-rules with extensions ('dart-sass', '
2377723789

2377823790
.example-5 {
2377923791
color: aquamarine;
23792+
}
23793+
23794+
.some-css-module {
23795+
background: hotpink;
2378023796
}"
2378123797
`;
2378223798

@@ -23799,6 +23815,10 @@ exports[`loader should work when "@use" at-rules with extensions ('dart-sass', '
2379923815

2380023816
.example-5 {
2380123817
color: aquamarine;
23818+
}
23819+
23820+
.some-css-module {
23821+
background: hotpink;
2380223822
}"
2380323823
`;
2380423824

@@ -23821,6 +23841,10 @@ exports[`loader should work when "@use" at-rules with extensions ('dart-sass', '
2382123841

2382223842
.example-5 {
2382323843
color: aquamarine;
23844+
}
23845+
23846+
.some-css-module {
23847+
background: hotpink;
2382423848
}"
2382523849
`;
2382623850

@@ -23843,6 +23867,10 @@ exports[`loader should work when "@use" at-rules with extensions ('sass-embedded
2384323867

2384423868
.example-5 {
2384523869
color: aquamarine;
23870+
}
23871+
23872+
.some-css-module {
23873+
background: hotpink;
2384623874
}"
2384723875
`;
2384823876

@@ -23865,6 +23893,10 @@ exports[`loader should work when "@use" at-rules with extensions ('sass-embedded
2386523893

2386623894
.example-5 {
2386723895
color: aquamarine;
23896+
}
23897+
23898+
.some-css-module {
23899+
background: hotpink;
2386823900
}"
2386923901
`;
2387023902

@@ -23887,6 +23919,10 @@ exports[`loader should work when "@use" at-rules with extensions ('sass-embedded
2388723919

2388823920
.example-5 {
2388923921
color: aquamarine;
23922+
}
23923+
23924+
.some-css-module {
23925+
background: hotpink;
2389023926
}"
2389123927
`;
2389223928

@@ -23909,6 +23945,10 @@ exports[`loader should work when "@use" at-rules with extensions ('sass-embedded
2390923945

2391023946
.example-5 {
2391123947
color: aquamarine;
23948+
}
23949+
23950+
.some-css-module {
23951+
background: hotpink;
2391223952
}"
2391323953
`;
2391423954

@@ -23931,6 +23971,10 @@ exports[`loader should work when "@use" at-rules with extensions ('sass-embedded
2393123971

2393223972
.example-5 {
2393323973
color: aquamarine;
23974+
}
23975+
23976+
.some-css-module {
23977+
background: hotpink;
2393423978
}"
2393523979
`;
2393623980

@@ -23953,6 +23997,10 @@ exports[`loader should work when "@use" at-rules with extensions ('sass-embedded
2395323997

2395423998
.example-5 {
2395523999
color: aquamarine;
24000+
}
24001+
24002+
.some-css-module {
24003+
background: hotpink;
2395624004
}"
2395724005
`;
2395824006

test/loader.test.js

Lines changed: 0 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1858,25 +1858,6 @@ describe("loader", () => {
18581858
await close(compiler);
18591859
});
18601860

1861-
it(`should work when "@use" with CSS extension ('${implementationName}', '${api}' API, '${syntax}' syntax)`, async () => {
1862-
const testId = getTestId("use-css", syntax);
1863-
const options = {
1864-
implementation,
1865-
api,
1866-
};
1867-
const compiler = getCompiler(testId, { loader: { options } });
1868-
const stats = await compile(compiler);
1869-
const codeFromBundle = getCodeFromBundle(stats, compiler);
1870-
const codeFromSass = await getCodeFromSass(testId, options);
1871-
1872-
expect(codeFromBundle.css).toBe(codeFromSass.css);
1873-
expect(codeFromBundle.css).toMatchSnapshot("css");
1874-
expect(getWarnings(stats)).toMatchSnapshot("warnings");
1875-
expect(getErrors(stats)).toMatchSnapshot("errors");
1876-
1877-
await close(compiler);
1878-
});
1879-
18801861
it(`should work when "@use" with the "bootstrap-sass" package, directly import ('${implementationName}', '${api}' API, '${syntax}' syntax)`, async () => {
18811862
const testId = getTestId("use-bootstrap-sass", syntax);
18821863
const options = {

test/sass/use-css.sass

Lines changed: 0 additions & 1 deletion
This file was deleted.

test/sass/use-with-extension.sass

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,3 +16,4 @@
1616
@use "../sass/nested/example-5.sass" as module14
1717
// TODO https://github.com/sass/dart-sass/issues/798#issuecomment-521229911
1818
// @use "nested/example-6.SASS" as module15
19+
@use 'css/some-css-module.css'

test/scss/use-css.scss

Lines changed: 0 additions & 1 deletion
This file was deleted.

test/scss/use-with-extension.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,3 +16,4 @@
1616
@use "../scss/nested/example-5.scss" as module14;
1717
// TODO https://github.com/sass/dart-sass/issues/798#issuecomment-521229911
1818
// @use "nested/example-6.SCSS" as module15;
19+
@use 'css/some-css-module.css';

0 commit comments

Comments
 (0)