diff --git a/package.json b/package.json index 42675df..2746205 100644 --- a/package.json +++ b/package.json @@ -75,7 +75,8 @@ "postcss-load-config": "^2.1.0", "reserved-words": "^0.1.2", "sass": "^1.26.5", - "stylus": "^0.54.7" + "stylus": "^0.54.7", + "tsconfig-paths": "^3.9.0" }, "devDependencies": { "@types/icss-utils": "^4.1.0", diff --git a/src/helpers/__tests__/__snapshots__/getDtsSnapshot.test.ts.snap b/src/helpers/__tests__/__snapshots__/getDtsSnapshot.test.ts.snap index 1eb3858..8c9bf13 100644 --- a/src/helpers/__tests__/__snapshots__/getDtsSnapshot.test.ts.snap +++ b/src/helpers/__tests__/__snapshots__/getDtsSnapshot.test.ts.snap @@ -9,6 +9,14 @@ Object { } `; +exports[`utils / cssSnapshots with baseUrl and paths in compilerOptions sass should find the files 1`] = ` +Object { + "big-font": "tsconfig-paths-module__big-font---3FOK9", + "class-with-mixin": "tsconfig-paths-module__class-with-mixin---Uo34z", + "public-module": "tsconfig-paths-module__public-module---2IHe1", +} +`; + exports[`utils / cssSnapshots with file 'empty.module.less' createExports should create an exports file 1`] = ` "declare let classes: { diff --git a/src/helpers/__tests__/external/package/public.module.scss b/src/helpers/__tests__/external/package/public.module.scss new file mode 100644 index 0000000..451877b --- /dev/null +++ b/src/helpers/__tests__/external/package/public.module.scss @@ -0,0 +1,3 @@ +.public-module { + color: green; +} diff --git a/src/helpers/__tests__/fixtures/tsconfig-paths.module.scss b/src/helpers/__tests__/fixtures/tsconfig-paths.module.scss new file mode 100644 index 0000000..0cfe09c --- /dev/null +++ b/src/helpers/__tests__/fixtures/tsconfig-paths.module.scss @@ -0,0 +1,2 @@ +@import '@scss/_external.module.scss'; +@import 'alias.scss'; diff --git a/src/helpers/__tests__/getDtsSnapshot.test.ts b/src/helpers/__tests__/getDtsSnapshot.test.ts index 0979ddf..e778503 100644 --- a/src/helpers/__tests__/getDtsSnapshot.test.ts +++ b/src/helpers/__tests__/getDtsSnapshot.test.ts @@ -186,4 +186,29 @@ describe('utils / cssSnapshots', () => { expect(classes).toMatchSnapshot(); }); }); + + describe('with baseUrl and paths in compilerOptions', () => { + const fileName = join(__dirname, 'fixtures', 'tsconfig-paths.module.scss'); + const css = readFileSync(fileName, 'utf8'); + const compilerOptions = { + baseUrl: __dirname, + paths: { + '@scss/*': ['external/package/*'], + 'alias.scss': ['external/package/public.module.scss'], + }, + }; + + it('sass should find the files', () => { + const classes = getClasses({ + css, + fileName, + logger, + options, + processor, + compilerOptions, + }); + + expect(classes).toMatchSnapshot(); + }); + }); }); diff --git a/src/helpers/getClasses.ts b/src/helpers/getClasses.ts index da865c7..c52d8d4 100644 --- a/src/helpers/getClasses.ts +++ b/src/helpers/getClasses.ts @@ -5,6 +5,7 @@ import sass from 'sass'; import stylus from 'stylus'; import { extractICSS } from 'icss-utils'; import tsModule from 'typescript/lib/tsserverlibrary'; +import { createMatchPath } from 'tsconfig-paths'; import { Logger } from './logger'; import { Options, CustomRenderer } from '../options'; @@ -71,6 +72,14 @@ export const getClasses = ({ } else if (fileType === FileTypes.scss || fileType === FileTypes.sass) { const filePath = getFilePath(fileName); const { includePaths, ...sassOptions } = rendererOptions.sass || {}; + const { baseUrl, paths } = compilerOptions; + const matchPath = + baseUrl && paths ? createMatchPath(path.resolve(baseUrl), paths) : null; + + const aliasImporter: sass.Importer = (url) => { + const newUrl = matchPath !== null ? matchPath(url) : undefined; + return newUrl ? { file: newUrl } : null; + }; transformedCss = sass .renderSync({ @@ -80,6 +89,7 @@ export const getClasses = ({ data: css.replace(/(@import ['"])~(?!\/)/gm, '$1'), indentedSyntax: fileType === FileTypes.sass, includePaths: [filePath, 'node_modules', ...(includePaths || [])], + importer: [aliasImporter], ...sassOptions, }) .css.toString(); diff --git a/yarn.lock b/yarn.lock index 537c644..507b517 100644 --- a/yarn.lock +++ b/yarn.lock @@ -605,6 +605,11 @@ resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.3.tgz#bdfd69d61e464dcc81b25159c270d75a73c1a636" integrity sha512-Il2DtDVRGDcqjDtE+rF8iqg1CArehSK84HZJCT7AMITlyXRBpuPhqGLDQMowraqqu1coEaimg4ZOqggt6L6L+A== +"@types/json5@^0.0.29": + version "0.0.29" + resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee" + integrity sha1-7ihweulOEdK4J7y+UnC86n8+ce4= + "@types/less@^3.0.1": version "3.0.1" resolved "https://registry.yarnpkg.com/@types/less/-/less-3.0.1.tgz#625694093c72f8356c4042754e222407e50d6b08" @@ -3084,6 +3089,13 @@ json5@^0.5.0: resolved "https://registry.yarnpkg.com/json5/-/json5-0.5.1.tgz#1eade7acc012034ad84e2396767ead9fa5495821" integrity sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE= +json5@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/json5/-/json5-1.0.1.tgz#779fb0018604fa854eacbf6252180d83543e3dbe" + integrity sha512-aKS4WQjPenRxiQsC93MNfjx+nbF4PAdYzmd/1JIj8HYzqfbu86beTuNgXDzPknWk0n0uARlyewZo4s++ES36Ow== + dependencies: + minimist "^1.2.0" + jsprim@^1.2.2: version "1.4.1" resolved "https://registry.yarnpkg.com/jsprim/-/jsprim-1.4.1.tgz#313e66bc1e5cc06e438bc1b7499c2e5c56acb6a2" @@ -4567,6 +4579,11 @@ strip-ansi@^6.0.0: dependencies: ansi-regex "^5.0.0" +strip-bom@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-3.0.0.tgz#2334c18e9c759f7bdd56fdef7e9ae3d588e68ed3" + integrity sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM= + strip-bom@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-4.0.0.tgz#9c3505c1db45bcedca3d9cf7a16f5c5aa3901878" @@ -4790,6 +4807,16 @@ ts-jest@^25.4.0: semver "6.x" yargs-parser "18.x" +tsconfig-paths@^3.9.0: + version "3.9.0" + resolved "https://registry.yarnpkg.com/tsconfig-paths/-/tsconfig-paths-3.9.0.tgz#098547a6c4448807e8fcb8eae081064ee9a3c90b" + integrity sha512-dRcuzokWhajtZWkQsDVKbWyY+jgcLC5sqJhg2PSgf4ZkH2aHPvaOY8YWGhmjb68b5qqTfasSsDO9k7RUiEmZAw== + dependencies: + "@types/json5" "^0.0.29" + json5 "^1.0.1" + minimist "^1.2.0" + strip-bom "^3.0.0" + tslib@^1.10.0: version "1.11.0" resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.11.0.tgz#f1f3528301621a53220d58373ae510ff747a66bc"