diff --git a/src/helpers/__tests__/__snapshots__/getDtsSnapshot.test.ts.snap b/src/helpers/__tests__/__snapshots__/getDtsSnapshot.test.ts.snap index 91436c7..a4230af 100644 --- a/src/helpers/__tests__/__snapshots__/getDtsSnapshot.test.ts.snap +++ b/src/helpers/__tests__/__snapshots__/getDtsSnapshot.test.ts.snap @@ -34,6 +34,7 @@ exports[`helpers / cssSnapshots with allowUnknownClassnames enabled should retur 'appLogo': string; 'appLogo': string; 'myAnimation': string; + 'myFolderIndex': string; [key: string]: string; }; export default _classes; @@ -58,6 +59,7 @@ export let classWithMixin: string; export let appLogo: string; export let appLogo: string; export let myAnimation: string; +export let myFolderIndex: string; " `; @@ -618,6 +620,7 @@ exports[`helpers / cssSnapshots with file 'test.module.scss' createExports shoul 'App_logo': string; 'App-logo': string; 'my-animation': string; + 'my-folder-index': string; }; export default _classes; export let App_logo: string; @@ -637,6 +640,7 @@ exports[`helpers / cssSnapshots with file 'test.module.scss' getCssExports shoul "local-class-inside-global": "local-class-inside-global", "local-class-inside-local": "local-class-inside-local", "my-animation": "my-animation", + "my-folder-index": "my-folder-index", "nested-class-parent": "nested-class-parent", "nested-class-parent--extended": "nested-class-parent--extended", "reserved-words": "reserved-words", @@ -678,12 +682,13 @@ declare let _classes: { 'App_logo': string; 'App-logo': string; 'my-animation': string; + 'my-folder-index': string; }; export default _classes; export let App_logo: string; export const __cssModule: true; -export type AllClassNames = 'local-class-inside-global' | 'local-class' | 'local-class-2' | 'local-class-inside-local' | 'reserved-words' | 'default' | 'const' | 'nested-class-parent' | 'child-class' | 'nested-class-parent--extended' | 'section-1' | 'section-2' | 'section-3' | 'section-4' | 'section-5' | 'section-6' | 'section-7' | 'section-8' | 'section-9' | 'class-with-mixin' | 'App_logo' | 'App-logo' | 'my-animation';" +export type AllClassNames = 'local-class-inside-global' | 'local-class' | 'local-class-2' | 'local-class-inside-local' | 'reserved-words' | 'default' | 'const' | 'nested-class-parent' | 'child-class' | 'nested-class-parent--extended' | 'section-1' | 'section-2' | 'section-3' | 'section-4' | 'section-5' | 'section-6' | 'section-7' | 'section-8' | 'section-9' | 'class-with-mixin' | 'App_logo' | 'App-logo' | 'my-animation' | 'my-folder-index';" `; exports[`helpers / cssSnapshots with file 'test.module.styl' createExports should create an exports file 1`] = ` @@ -1034,7 +1039,7 @@ exports[`helpers / cssSnapshots with goToDefinition enabled with Less should ret exports[`helpers / cssSnapshots with goToDefinition enabled with Sass should return a line-accurate dts file 1`] = ` " - +export let myFolderIndex: string; export let localClassInsideGlobal: string; @@ -1113,6 +1118,11 @@ export let myAnimation: string; + + + + + @@ -1143,6 +1153,7 @@ declare let _classes: { 'appLogo': string; 'appLogo': string; 'myAnimation': string; + 'myFolderIndex': string; }; export default _classes; " @@ -1162,6 +1173,7 @@ exports[`helpers / cssSnapshots with goToDefinition enabled with Sass should ret "local-class-inside-global": "local-class-inside-global", "local-class-inside-local": "local-class-inside-local", "my-animation": "my-animation", + "my-folder-index": "my-folder-index", "nested-class-parent": "nested-class-parent", "nested-class-parent--extended": "nested-class-parent--extended", "reserved-words": "reserved-words", @@ -1262,15 +1274,21 @@ exports[`helpers / cssSnapshots with goToDefinition enabled with Sass should ret .commented-parent-class { .commented-child-class } -*/", +*/ + +.my-folder-index { + text-indent: 9999px; + margin: 10px; +}", "sourceMap": { "file": "src/helpers/__tests__/fixtures/test.module.scss", - "mappings": "AAAA;EACE,oBAAA;ACCF;;ADGE;EACE,oBAAA;ACAJ;;ADIA;EACE,oBAAA;ACDF;;ADKE;EACE,oBAAA;ACFJ;;ADOE;EACE,oBAAA;ACJJ;;ADME;EACE,oBAAA;ACJJ;;ADSE;EACE,oBAAA;ACNJ;;ADQE;EACE,oBAAA;ACNJ;;ADaE;EACE,oBAJI;ACNR;;ADSE;EACE,oBAJI;ACFR;;ADKE;EACE,oBAJI;ACER;;ADCE;EACE,oBAJI;ACMR;;ADHE;EACE,oBAJI;ACUR;;ADPE;EACE,oBAJI;ACcR;;ADXE;EACE,oBAJI;ACkBR;;ADfE;EACE,oBAJI;ACsBR;;ADnBE;EACE,oBAJI;AC0BR;;ADhBA;EE/CE,SFgDoB;ACmBtB;;ADhBA;EACE,cAAA;EACA,oBAAA;ACmBF;;ADhBA;EACE;IACE,2CAAA;ECmBF;AACF;;ADZA;;;;CAAA", + "mappings": "AAAA;EACE,oBAAA;ACCF;;ADGE;EACE,oBAAA;ACAJ;;ADIA;EACE,oBAAA;ACDF;;ADKE;EACE,oBAAA;ACFJ;;ADOE;EACE,oBAAA;ACJJ;;ADME;EACE,oBAAA;ACJJ;;ADSE;EACE,oBAAA;ACNJ;;ADQE;EACE,oBAAA;ACNJ;;ADaE;EACE,oBAJI;ACNR;;ADSE;EACE,oBAJI;ACFR;;ADKE;EACE,oBAJI;ACER;;ADCE;EACE,oBAJI;ACMR;;ADHE;EACE,oBAJI;ACUR;;ADPE;EACE,oBAJI;ACcR;;ADXE;EACE,oBAJI;ACkBR;;ADfE;EACE,oBAJI;ACsBR;;ADnBE;EACE,oBAJI;AC0BR;;ADhBA;EE/CE,SFgDoB;ACmBtB;;ADhBA;EACE,cAAA;EACA,oBAAA;ACmBF;;ADhBA;EACE;IACE,2CAAA;ECmBF;AACF;;ADZA;;;;CAAA;;AGjEA;EACE,mBAAA;EDFA,YCGoB;AFoFtB", "names": [], "sources": [ "file://[cwd]/src/helpers/__tests__/fixtures/test.module.scss", "src/helpers/__tests__/fixtures/test.module.scss", "file://[cwd]/src/helpers/__tests__/fixtures/_mixin.scss", + "file://[cwd]/src/helpers/__tests__/fixtures/my-folder/_index.scss", ], "version": 3, }, @@ -1316,6 +1334,7 @@ exports[`helpers / cssSnapshots with noUncheckedIndexedAccess enabled should ret 'appLogo'?: string; 'appLogo'?: string; 'myAnimation'?: string; + 'myFolderIndex'?: string; }; export default _classes; export let localClassInsideGlobal: string | undefined; @@ -1339,5 +1358,6 @@ export let classWithMixin: string | undefined; export let appLogo: string | undefined; export let appLogo: string | undefined; export let myAnimation: string | undefined; +export let myFolderIndex: string | undefined; " `; diff --git a/src/helpers/__tests__/fixtures/my-folder/_index.scss b/src/helpers/__tests__/fixtures/my-folder/_index.scss new file mode 100644 index 0000000..d7b3740 --- /dev/null +++ b/src/helpers/__tests__/fixtures/my-folder/_index.scss @@ -0,0 +1,6 @@ +@import '../mixin'; + +.my-folder-index { + text-indent: 9999px; + @include set-margin(10px); +} diff --git a/src/helpers/__tests__/fixtures/test.module.sass b/src/helpers/__tests__/fixtures/test.module.sass index 4c3b3b9..be66ff5 100644 --- a/src/helpers/__tests__/fixtures/test.module.sass +++ b/src/helpers/__tests__/fixtures/test.module.sass @@ -1,21 +1,21 @@ -:global .global-class +:global .global-class color: rebeccapurple -:global(.global-class-2) +:global(.global-class-2) .local-class-inside-global color: rebeccapurple - -:local .local-class + +:local .local-class color: rebeccapurple :local(.local-class-2) .local-class-inside-local color: rebeccapurple - + .reserved-words diff --git a/src/helpers/__tests__/fixtures/test.module.scss b/src/helpers/__tests__/fixtures/test.module.scss index 926526e..582d00d 100644 --- a/src/helpers/__tests__/fixtures/test.module.scss +++ b/src/helpers/__tests__/fixtures/test.module.scss @@ -70,3 +70,5 @@ $color: rebeccapurple !default; .commented-child-class } */ + +@import 'my-folder'; diff --git a/src/helpers/getCssExports.ts b/src/helpers/getCssExports.ts index 6eb91ba..c605e07 100644 --- a/src/helpers/getCssExports.ts +++ b/src/helpers/getCssExports.ts @@ -114,11 +114,57 @@ export const getCssExports = ({ const aliasImporter: sass.FileImporter<'sync'> = { findFileUrl(url) { - const newUrl = + const exactFileUrl = matchPath?.(url, undefined, undefined, [ + '.sass', + '.scss', + ]); + + if (exactFileUrl) { + return new URL(`file://${exactFileUrl}`); + } + + /* + * In case it didn't find the exact file it'll proceed to + * check other files matching the import process of Sass + * guidelines: + * https://sass-lang.com/documentation/at-rules/import/#partials + * https://sass-lang.com/documentation/at-rules/import/#index-files + */ + + // Checks for partials + const partialFileName = path.basename(url); + const partialDirName = path.dirname(url); + const partialFilePath = path.join( + partialDirName, + `_${partialFileName}`, + ); + const partialFileUrl = matchPath !== null - ? matchPath(url, undefined, undefined, ['.sass', '.scss']) + ? matchPath(partialFilePath, undefined, undefined, [ + '.sass', + '.scss', + ]) : undefined; - return newUrl ? new URL(`file://${newUrl}`) : null; + + if (partialFileUrl) { + return new URL(`file://${partialFileUrl}`); + } + + // Checks for an _index file + const indexFilePath = path.join( + partialDirName, + partialFileName, + `_index`, + ); + const indexFileUrl = + matchPath !== null + ? matchPath(indexFilePath, undefined, undefined, [ + '.sass', + '.scss', + ]) + : undefined; + + return indexFileUrl ? new URL(`file://${indexFileUrl}`) : null; }, };