TypeError: ...: Duplicate declaration "t"

[phinguyen202]

Hi guys,

My library is built successfully but got an error when min.js file to be used (non-minified is work fine), for instance:

ERROR in ../lib/index.es.min.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
TypeError: D:\Code\workspace\svg-sheet-music\lib\index.es.min.js: Duplicate declaration "t"

My package.json:

"devDependencies": {
    ...
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "rollup": "^2.37.1",
    "rollup-plugin-babel": "^4.4.0",
    "rollup-plugin-commonjs": "^10.1.0",
    "rollup-plugin-peer-deps-external": "^2.2.2",
    "rollup-plugin-terser": "^7.0.2",
    "rollup-plugin-typescript": "^1.0.1",
    ...
  },

My rollup config:

{
    input,
    output: {
      file: packageJSON.module,
      format: "es",
      exports: "named"
    },
    plugins: [
      babel({
        exclude: "node_modules/**"
      }),
      commonjs(),
      typescript()
    ]
  },
  {
    input,
    output: {
      file: minifyExtension(packageJSON.module),
      format: "es",
      exports: "named"
    },
    plugins: [
      babel({
        exclude: "node_modules/**"
      }),
      commonjs(),
      typescript(),
      terser()
    ]
  }

I have tried "rollup-plugin-uglify-es" but it isn't work.

[TrySound]

What's your babel config?

[phinguyen202]

What's your babel config?

Hi Chadkin, it is:

{
    "presets": ["@babel/preset-env", "@babel/preset-react"],
}

[TrySound]

Try to remove typescript plugin

[phinguyen202]

If I remove typescript plugin, error will be threw when rollup transpile typescript code.
I tried to re-order plugin but still failed.

[TrySound]

Commonjs cannot parse typescript code so it can't be run before typescript plugin. Could you please create a repository with reproduction. It's hard to guess without all information.

[phinguyen202]

Okay, I will back with a repo.

[phinguyen202]

I finished a simple demo, it works fine!
Trying with complicated code.

[phinguyen202]

Hi @TrySound ,
I have created a repo to reproduce this issue. Please have a look at [DELETED] (please find root cause at fabiosantoscode's answer)

You can go to /test folder, run npm i then npm start and the error will be shown on the console.
If replacing ../lib/index.es.min with ../lib/index.es (in /test/index.js), everything works fine and a music notation will be rendered on the web.

I'm trying to remove parts of the source code to find out which part is made failed.

[TrySound]

One of the reasons this may happen is very old plugins. All migrated to @rollup/plugin-* naming long time ago.

[phinguyen202]

I have tried using following dependencies:

"@rollup/plugin-babel": "^5.2.2",
"@rollup/plugin-commonjs": "^17.0.0",
"@rollup/plugin-typescript": "^8.1.0",

unfortunately, still not working

[TrySound]

I figured this is a bug in terser itself. Raised a bug
terser/terser#921

[fabiosantoscode]

Hey, I thought I'd reply here instead of on the Terser repo.

If the issue really is the code you pasted @TrySound then it might be a babel bug, however I couldn't get any error in the REPL.

Because the output is valid ES code. The name t is reused because the for-of's variables don't get used in the loop in the original version.

export function Stave() {
  const o = [];
  for (const [t, n] of []) {  // Here's a t (for scope)
    const t = true;  // And here's a t (scope of the block in for)
    o.push(t);
  }
}

[TrySound]

Unused variable is also valid in js. Eslint may not be installed in the project.

[TrySound]

Ah, right. It works. Weird then. I didn't find any other duplicated t appearances.

[fabiosantoscode]

What is the JavaScript running on? Safari needs the safari10 option to run properly in some cases.