diff --git a/README.md b/README.md index a01b669..cca61e4 100644 --- a/README.md +++ b/README.md @@ -99,8 +99,9 @@ Please note that no options are required. However, depending on your configurati | Option | Default value | Description | | -------------------------- | ---------------------------------- | ------------------------------------------------------------------------------ | +| `additonalData` | `undefined` | An optional string to append to the top of source files. | | `allowUnknownClassnames` | `false` | Disables TypeScript warnings on unknown classnames (for default imports only). | -| `classnameTransform` | `asIs` | See [`classnameTransform`](#classnameTransform) below. | +| `classnameTransform` | `"asIs"` | See [`classnameTransform`](#classnameTransform) below. | | `customMatcher` | `"\\.module\\.(c\|le\|sa\|sc)ss$"` | Changes the file extensions that this plugin processes. | | `customRenderer` | `false` | See [`customRenderer`](#customRenderer) below. | | `customTemplate` | `false` | See [`customTemplate`](#customTemplate) below. | diff --git a/src/helpers/__tests__/getDtsSnapshot.test.ts b/src/helpers/__tests__/getDtsSnapshot.test.ts index dc53dba..99041d4 100644 --- a/src/helpers/__tests__/getDtsSnapshot.test.ts +++ b/src/helpers/__tests__/getDtsSnapshot.test.ts @@ -330,4 +330,32 @@ describe('helpers / cssSnapshots', () => { expect(dts).toMatchSnapshot(); }); }); + + describe('with additonalData enabled', () => { + const fileName = join(__dirname, 'fixtures', 'test.module.scss'); + const css = readFileSync(fileName, 'utf8'); + const options: Options = { + additonalData: '.my-data {\n color: red;\n}\n\n', + }; + + const cssExports = getCssExports({ + css, + fileName, + logger, + options, + processor, + compilerOptions, + directory: __dirname, + }); + + it('should return a dts file that contains additional data', () => { + const dts = createDtsExports({ + cssExports, + fileName, + logger, + options, + }); + expect(dts).toContain('my-data'); + }); + }); }); diff --git a/src/helpers/getCssExports.ts b/src/helpers/getCssExports.ts index 562228e..009b416 100644 --- a/src/helpers/getCssExports.ts +++ b/src/helpers/getCssExports.ts @@ -52,17 +52,19 @@ export const getCssExports = ({ compilerOptions: tsModule.CompilerOptions; directory: string; }): CSSExportsWithSourceMap => { - try { - const fileType = getFileType(fileName); - const rendererOptions = options.rendererOptions ?? {}; + const rawCss = options.additonalData ? options.additonalData + css : css; + + const fileType = getFileType(fileName); + const rendererOptions = options.rendererOptions ?? {}; - let transformedCss = ''; - let sourceMap: RawSourceMap | undefined; + let transformedCss = ''; + let sourceMap: RawSourceMap | undefined; + try { if (options.customRenderer) { // eslint-disable-next-line @typescript-eslint/no-var-requires const customRenderer = require(options.customRenderer) as CustomRenderer; - transformedCss = customRenderer(css, { + transformedCss = customRenderer(rawCss, { fileName, logger, compilerOptions, @@ -71,7 +73,7 @@ export const getCssExports = ({ switch (fileType) { case FileType.less: less.render( - css, + rawCss, { syncImport: true, filename: fileName, @@ -122,10 +124,12 @@ export const getCssExports = ({ const importers = [aliasImporter, sassTildeImporter]; - const result = sass.compile(fileName, { + const result = sass.compileString(rawCss, { importers, loadPaths: [filePath, 'node_modules', ...(loadPaths ?? [])], sourceMap: true, + syntax: fileType === FileType.sass ? 'indented' : 'scss', + url: new URL(`file://${fileName}`), ...sassOptions, }); @@ -135,14 +139,14 @@ export const getCssExports = ({ } case FileType.styl: - transformedCss = stylus(css, { + transformedCss = stylus(rawCss, { ...(rendererOptions.stylus ?? {}), filename: fileName, }).render(); break; default: - transformedCss = css; + transformedCss = rawCss; break; } } diff --git a/src/options.ts b/src/options.ts index da348e9..fcf9a9a 100644 --- a/src/options.ts +++ b/src/options.ts @@ -20,6 +20,7 @@ export interface RendererOptions { } export interface Options { + additonalData?: string; allowUnknownClassnames?: boolean; classnameTransform?: ClassnameTransformOptions; customMatcher?: string;