Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: position of named export in injected css #184

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 10 additions & 10 deletions __tests__/__snapshots__/index.test.ts.snap
Original file line number Diff line number Diff line change
Expand Up @@ -756,17 +756,17 @@ var modules_efa96bb5 = {\\"partial\\":\\"first_partial\\",\\"first\\":\\"first_f

var first = /*#__PURE__*/Object.freeze({
__proto__: null,
css: css$1,
'default': modules_efa96bb5
'default': modules_efa96bb5,
css: css$1
});

var css = \\".second_second {\\\\n color: royalblue;\\\\n}\\";
var modules_7a038d99 = {\\"second\\":\\"second_second\\"};

var second = /*#__PURE__*/Object.freeze({
__proto__: null,
css: css,
'default': modules_7a038d99
'default': modules_7a038d99,
css: css
});

(async () => {
Expand Down Expand Up @@ -896,17 +896,17 @@ var modules_efa96bb5 = {\\"partial\\":\\"first_partial\\",\\"first\\":\\"first_f

var first = /*#__PURE__*/Object.freeze({
__proto__: null,
css: css$1,
'default': modules_efa96bb5
'default': modules_efa96bb5,
css: css$1
});

var css = \\".second_second {\\\\n color: royalblue;\\\\n}\\";
var modules_7a038d99 = {\\"second\\":\\"second_second\\"};

var second = /*#__PURE__*/Object.freeze({
__proto__: null,
css: css,
'default': modules_7a038d99
'default': modules_7a038d99,
css: css
});

(async () => {
Expand Down Expand Up @@ -2284,8 +2284,8 @@ export { css, css as default };
`;

exports[`extract preserve-modules: js 3`] = `
"import { css } from './foo.css.js';
import { css as css$1 } from './bar.css.js';
"import css from './foo.css.js';
import css$1 from './bar.css.js';

console.log(css, css$1);
"
Expand Down
7 changes: 5 additions & 2 deletions __tests__/fixtures/modules/composed.css.d.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,8 @@
export var css: string;
var css: string;
interface ModulesExports {"primary":"#BF4040","composition":"composed_composition composition2_compositioned"}
interface ModulesExports {inject:()=>void}
declare const modules_2a102cc5: ModulesExports;
export default modules_2a102cc5;
export default modules_2a102cc5;
export {
css
};
7 changes: 5 additions & 2 deletions __tests__/fixtures/modules/style.css.d.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,8 @@
export var css: string;
var css: string;
interface ModulesExports {"primary":"#BF4040","secondary":"#1F4F7F","module":"style_module","module2":"style_module2 composed_composition composition2_compositioned"}
interface ModulesExports {inject:()=>void}
declare const modules_5a199c00: ModulesExports;
export default modules_5a199c00;
export default modules_5a199c00;
export {
css
};
7 changes: 5 additions & 2 deletions __tests__/fixtures/modules/subdir/composition2.css.d.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,8 @@
export var css: string;
var css: string;
interface ModulesExports {"compositioned":"composition2_compositioned"}
interface ModulesExports {inject:()=>void}
declare const modules_354770d7: ModulesExports;
export default modules_354770d7;
export default modules_354770d7;
export {
css
};
16 changes: 11 additions & 5 deletions __tests__/fixtures/named-exports/style.css.d.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,13 @@
export var css: string;
export var valid: "style_valid";
export var _new: "style_new";
export var _css: "style_css";
var css: string;
var valid: "style_valid";
var _new: "style_new";
var _css: "style_css";
interface ModulesExports {"valid":"style_valid","new":"style_new","css":"style_css"}
declare const modules_5a199c00: ModulesExports;
export default modules_5a199c00;
export default modules_5a199c00;
export {
css,
valid,
_new,
_css
};
15 changes: 9 additions & 6 deletions src/loaders/postcss/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -132,8 +132,9 @@ const loader: Loader<PostCSSLoaderOptions> = {
const saferId = (id: string): string => safeId(id, path.basename(this.id));
const modulesVarName = saferId("modules");

const output = [`export var ${cssVarName} = ${JSON.stringify(res.css)};`];
const dts = [`export var ${cssVarName}: string;`];
const output = [`var ${cssVarName} = ${JSON.stringify(res.css)};`];
const dts = [`var ${cssVarName}: string;`];
const outputExports = [cssVarName];

if (options.namedExports) {
const getClassName =
Expand All @@ -146,8 +147,9 @@ const loader: Loader<PostCSSLoaderOptions> = {
this.warn(`Exported \`${name}\` as \`${newName}\` in ${humanlizePath(this.id)}`);

const fmt = JSON.stringify(modulesExports[name]);
output.push(`export var ${newName} = ${fmt};`);
if (options.dts) dts.push(`export var ${newName}: ${fmt};`);
output.push(`var ${newName} = ${fmt};`);
if (options.dts) dts.push(`var ${newName}: ${fmt};`);
outputExports.push(newName);
}
}

Expand Down Expand Up @@ -203,7 +205,8 @@ const loader: Loader<PostCSSLoaderOptions> = {
if (!options.inject) output.push(`var ${modulesVarName} = ${JSON.stringify(modulesExports)};`);

const defaultExport = `export default ${supportModules ? modulesVarName : cssVarName};`;
output.push(defaultExport);
const namedExport = `export {\n ${outputExports.filter(Boolean).join(",\n ")}\n};`;
output.push(defaultExport, namedExport);

if (options.dts && (await fs.pathExists(this.id))) {
if (supportModules)
Expand All @@ -217,7 +220,7 @@ const loader: Loader<PostCSSLoaderOptions> = {
`declare const ${modulesVarName}: ModulesExports;`,
);

dts.push(defaultExport);
dts.push(defaultExport, namedExport);
await fs.writeFile(`${this.id}.d.ts`, dts.filter(Boolean).join("\n"));
}

Expand Down