SyntaxError: Identifier '__filename' has already been declared

[bashmish]

I'm using the esbuild plugin @chialab/esbuild-plugin-commonjs to transpile named exports from CJS to EMS, the esbuild config is pretty much the following (but you can find all details in bashmish/storybook-builder-wds#2):

import { build } from 'esbuild';
import esbuildCommonjsPlugin from '@chialab/esbuild-plugin-commonjs';

// ...

await build({
  entryPoints: modules,
  outdir: './my-dir',
  bundle: true,
  format: 'esm',
  splitting: true,
  sourcemap: true,
  alias: {
    assert: require.resolve('browser-assert'),
    lodash: dirname(require.resolve('lodash-es/package.json')),
    path: require.resolve('path-browserify'),
  },
  plugins: [esbuildCommonjsPlugin()],
});

I run into the issue with the following syntax:

const require = __moduleCreateRequire(import.meta.url);
const __filename = new URL(import.meta.url).pathname;
const __dirname = __pathDirname(__filename);

found in 2 package:

• node_modules/@chialab/estransform/dist/index.js
  lines 4-5-6 in https://cdn.jsdelivr.net/npm/@chialab/estransform@0.17.3/dist/index.js
• node_modules/@chialab/node-resolve/dist/index.js
  lines 4-5-6 in https://cdn.jsdelivr.net/npm/@chialab/node-resolve@0.17.0/dist/index.js

resulting in the following error:

ERR! /path/to/node_modules/@chialab/estransform/dist/index.js:62
ERR! const __filename = new URL(__esbuild_register_import_meta_url__).pathname;
ERR!       ^
ERR!
ERR! SyntaxError: Identifier '__filename' has already been declared
ERR!     at internalCompileFunction (node:internal/vm:73:18)
ERR!     at wrapSafe (node:internal/modules/cjs/loader:1176:20)
ERR!     at Module._compile (node:internal/modules/cjs/loader:1218:27)
ERR!     at Module._compile (/path/to/node_modules/esbuild-register/dist/node.js:2258:26)
ERR!     at extensions..js (/path/to/node_modules/esbuild-register/dist/node.js:4814:15)
ERR!     at Module.load (node:internal/modules/cjs/loader:1117:32)
ERR!     at Module._load (node:internal/modules/cjs/loader:958:12)
ERR!     at Module.require (node:internal/modules/cjs/loader:1141:19)
ERR!     at require (node:internal/modules/cjs/helpers:110:18)
ERR!     at Object.<anonymous> (/path/to/node_modules/@chialab/cjs-to-esm/lib/index.js:1:118)
ERR!  /path/to/node_modules/@chialab/estransform/dist/index.js:62

[bashmish]

My workaround is just to remove these 3 lines from both packages:

• https://github.com/bashmish/storybook-builder-wds/pull/2/files#diff-a57f398d52d049d190e14c1b305dec4426fc7cf102a52f007669103a725eef03
• https://github.com/bashmish/storybook-builder-wds/pull/2/files#diff-e874fe89b94b912ade872ad63ac605d50c4c560ee26c36ceb7491d18209876ac

None of these 3 const is used anywhere below, so these patches were OK.

Renaming __filename to filename and __dirname to dirname works too.

I think __filename and __dirname are reserved in Node and you can't redefine them, especially not with const. But this code is maybe targeting browser for some reason to polyfill/browserify them? Maybe some config of the bundler/compiler should be fixed.

[edoardocavazza]

Hi @bashmish, thanks for the report!

It seems that the problem is due to the fact that the packages are meant to be used as ESM modules.
As long as we can, we would like to avoid distributing the commonjs compatible version as well.

However, actually those variables are not used in the distribution files, so we have removed them in this PR. We hope it will solve the problem. Alternatively, we will consider distributing the package in the two formats.

[bashmish]

@edoardocavazza thanks for a quick fix!

Indeed I use it in the CommonJS module. Looking forward to the release and gonna test it right away.