Browser: Identifier X has already been declared

Question

I am using ES6 with Babel in my project and I am getting an error when I declare one of my const

'use strict';

const APP = window.APP = window.APP || {};
const _ = window._;

APP.personalCard = (function () {

   ...

}());

the error

Uncaught TypeError: Identifier 'APP' has already been declared

and that is the whole file, I don't have that declare anywhere else in that file. But I have declared that var in the top of the other files.

What do you think it should be ?

Answer 1

But I have declared that var in the top of the other files.

That's the problem. After all, this makes multiple declarations for the same name in the same (global) scope - which will throw an error with const.

Instead, use var, use only one declaration in your main file, or only assign to window.APP exclusively.
Or use ES6 modules right away, and let your module bundler/loader deal with exposing them as expected.

Answer 2

I had a very close issue but in my case, it was Identifier 'e' has already been declared.

In my case caused because of using try {} catch (e) { var e = ... } where letter e is generated via minifier (uglifier).

So better solution could be use catch(ex){} (ex as an Exception)

Hope somebody who searched with the similar question could find this question helpful.

Answer 3

Remember that window is the global namespace. These two lines attempt to declare the same variable:

window.APP = { ... }
const APP = window.APP

The second definition is not allowed in strict mode (enabled with 'use strict' at the top of your file).

To fix the problem, simply remove the const APP = declaration. The variable will still be accessible, as it belongs to the global namespace.