fix: inline import.meta.url shims in CJS

Author: fi3ework

packages/core/src/plugins/cjsShim.ts

@@ -1,12 +1,11 @@
-import { type RsbuildPlugin, rspack } from '@rsbuild/core';
+import type { RsbuildPlugin } from '@rsbuild/core';
 
-const importMetaUrlShim = `var __rslib_import_meta_url__ = /*#__PURE__*/ (function () {
+const importMetaUrlShim = `/*#__PURE__*/ (function () {
   return typeof document === 'undefined'
     ? new (require('url'.replace('', '')).URL)('file:' + __filename).href
     : (document.currentScript && document.currentScript.src) ||
       new URL('main.js', document.baseURI).href;
-})();
-`;
+})()`;
 
 // This Rsbuild plugin will shim `import.meta.url` for CommonJS modules.
 // - Replace `import.meta.url` with `importMetaUrl`.
@@ -19,22 +18,8 @@ export const pluginCjsShim = (): RsbuildPlugin => ({
     api.modifyEnvironmentConfig((config) => {
       config.source.define = {
         ...config.source.define,
-        'import.meta.url': '__rslib_import_meta_url__',
+        'import.meta.url': importMetaUrlShim,
       };
     });
-
-    api.modifyRspackConfig((config) => {
-      config.plugins ??= [];
-      config.plugins.push(
-        new rspack.BannerPlugin({
-          banner: importMetaUrlShim,
-          // Just before minify stage, to perform tree shaking.
-          stage: rspack.Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE - 1,
-          raw: true,
-          footer: true,
-          include: /\.(js|cjs)$/,
-        }),
-      );
-    });
   },
 });

tests/integration/shims/cjs/src/index.ts

@@ -1,3 +1,4 @@
-export const foo = () => {
-  console.log(import.meta.url);
-};
+const url = import.meta.url;
+const readUrl = url;
+
+export default readUrl;

tests/integration/shims/index.test.ts

@@ -1,4 +1,5 @@
 import { join } from 'node:path';
+import { pathToFileURL } from 'node:url';
 import { buildAndGetResults } from 'test-helper';
 import { describe, expect, test } from 'vitest';
 
@@ -21,25 +22,20 @@ test('shims for __dirname and __filename in ESM', async () => {
 describe('shims for `import.meta.url` in CJS', () => {
   test('CJS should apply shims', async () => {
     const fixturePath = join(__dirname, 'cjs');
-    const { entries } = await buildAndGetResults(fixturePath);
-    for (const shim of [
-      `var __rslib_import_meta_url__ = /*#__PURE__*/ function() {
-    return 'undefined' == typeof document ? new (require('url'.replace('', ''))).URL('file:' + __filename).href : document.currentScript && document.currentScript.src || new URL('main.js', document.baseURI).href;
-}();`,
-      'console.log(__rslib_import_meta_url__);',
-    ]) {
-      expect(entries.cjs).toContain(shim);
-    }
+    const { entryFiles } = await buildAndGetResults(fixturePath);
+    const exported = await import(entryFiles.cjs);
+    const fileUrl = pathToFileURL(entryFiles.cjs).href;
+    expect(exported.default).toBe(fileUrl);
   });
 
   test('ESM should not be affected by CJS shims configuration', async () => {
     const fixturePath = join(__dirname, 'cjs');
     const { entries } = await buildAndGetResults(fixturePath);
     expect(entries.esm).toMatchInlineSnapshot(`
-      "const foo = ()=>{
-          console.log(import.meta.url);
-      };
-      export { foo };
+      "const url = import.meta.url;
+      const readUrl = url;
+      /* harmony default export */ const src = readUrl;
+      export { src as default };
       "
     `);
   });