Skip to content
Merged
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
3 changes: 3 additions & 0 deletions changelog.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,6 @@
## V3.1.1
- fix build with `bundle: true` & `splitting: true` & multiple entrypoints

## V3.1.0
- fix [issue#61](https://github.com/indooorsman/esbuild-css-modules-plugin/issues/61)
- fix [issue#59](https://github.com/indooorsman/esbuild-css-modules-plugin/issues/59)
Expand Down
26 changes: 22 additions & 4 deletions index.js
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ export const setup = (build, _options) => {
}
);
console.log(warnings.join('\n'));
}
};

patchedBuild.onLoad({ filter: /.+/, namespace: pluginCssNamespace }, (args) => {
const { path } = args;
Expand All @@ -71,7 +71,7 @@ export const setup = (build, _options) => {
});

patchedBuild.onLoad(
{ filter: new RegExp(`:${injectorVirtualPath}$`), namespace: pluginJsNamespace },
{ filter: new RegExp(`^:.*${injectorVirtualPath}$`), namespace: pluginJsNamespace },
(args) => {
log(`[${pluginJsNamespace}] on load injector:`, args);

Expand All @@ -93,8 +93,8 @@ export const setup = (build, _options) => {

/** @type {import('esbuild').OnResolveResult} */
const r = { namespace: ns, path: originPath, pluginData: { ...(args.pluginData ?? {}) } };
if (originPath.endsWith(`:${injectorVirtualPath}`)) {
r.path = `:${injectorVirtualPath}`;
if (path.endsWith(`:${injectorVirtualPath}`)) {
r.path = path.replace(pluginJsNamespace, '');
}
log('resolved:', r);

Expand Down Expand Up @@ -320,9 +320,27 @@ export const setup = (build, _options) => {
/** @type {[string, string][]} */
const filesToBuild = [];
warnMetafile();
const cssOutputsMap = Object.entries(r.metafile?.outputs ?? {}).reduce((m, [o, { inputs }]) => {
const keys = Object.keys(inputs);
if (keys.length === 1 && new RegExp(`^${pluginCssNamespace}:.+\.css$`).test(keys[0])) {
m[keys[0].replace(`${pluginCssNamespace}:`, '')] = o;
}
return m;
}, {});
Object.entries(r.metafile?.outputs ?? {}).forEach(([outfile, meta]) => {
if (meta.cssBundle) {
filesToBuild.push([outfile, meta.cssBundle]);
} else {
const inputs = Object.keys(meta.inputs);
inputs.forEach((item) => {
if (item.endsWith(`:${injectorVirtualPath}`)) {
const sourceCss = item
.replace(pluginJsNamespace, '')
.replace(`:${injectorVirtualPath}`, '')
.replace(/^:+/, '');
filesToBuild.push([outfile, cssOutputsMap[sourceCss]]);
}
});
}
});

Expand Down
2 changes: 1 addition & 1 deletion lib/utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -174,7 +174,7 @@ const digestPlaceholder = '__digest_placeholder__';

/**
* @param {string} to
* @returns string
* @returns {string}
*/
const relativeToCwd = (to) => relative(process.cwd(), to);

Expand Down
8 changes: 4 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "esbuild-css-modules-plugin",
"version": "3.1.0",
"version": "3.1.1",
"description": "A esbuild plugin to bundle css modules into js(x)/ts(x), based on extremely fast [Lightning CSS](https://lightningcss.dev/)",
"main": "./index.cjs",
"module": "./index.js",
Expand Down Expand Up @@ -40,14 +40,14 @@
},
"devDependencies": {
"@types/lodash-es": "^4.17.12",
"@types/node": "^20.10.0",
"esbuild": "^0.19.8"
"@types/node": "^20.12.7",
"esbuild": "^0.20.2"
},
"peerDependencies": {
"esbuild": "*"
},
"dependencies": {
"lightningcss": "^1.22.1",
"lightningcss": "^1.24.1",
"lodash-es": "^4.17.21"
},
"publishConfig": {
Expand Down
23 changes: 23 additions & 0 deletions test/test.js
Original file line number Diff line number Diff line change
Expand Up @@ -149,6 +149,29 @@ import cssModulesPlugin from '../index.js';
await esbuild.build(buildOptions);
console.log('[test][esbuild:no:bundle] done, please check `test/dist/no-bundle`', '\n');

await esbuild.build({
...buildOptions,
entryPoints: [
'./app.jsx',
'./components/hello.world.jsx'
],
splitting: true,
bundle: true,
packages: 'external',
outdir: './dist/bundle-splitting',
loader: {
'.jpg': 'file'
},
plugins: [
cssModulesPlugin({
inject: true
})
],
logLevel: 'debug',
metafile: true
});
console.log('[test][esbuild:bundle:splitting] done, please check `test/dist/bundle-splitting`', '\n');

// testing no metafile & write false
const r = await esbuild.build({
...buildOptions,
Expand Down