CODEWITHSUNDEEP
javascriptgoogle-closure-compiler
Brian Leishman
Brian Leishman

Reputation: 8575

Closure Compiler throws "Variable ... declared more than once" for different files

So far I have what I believe to be a simple setup; I have core.js, signup.js, and login.js, where the core is assumed to be loaded before each of signup.js and login.js, and login.js and signup.js would never be loaded on the same page at the same time.

This is the command I'm using to compile the JS files into different modules with the --module flag

java -jar ../../compilers/closure-compiler.jar \
--module core:1: --js ../../js/core.js \
--module signup:1:core: --js ../../js/signup.js \
--module login:1:core: --js ../../js/login.js \
--compilation_level ADVANCED_OPTIMIZATIONS \
--externs ../../externs/jquery-3.3.js \
--externs ../../externs\sweetalert2.js \
--externs ../../externs\grecaptcha.js

And each of login.js and signup.js have their own form, so I have a variable in each called $Form like so

var $Form = $('#login');

However running that command on my files gives the following error

../../js/login.js:13: ERROR - Variable $Form declared more than once. First occurrence: ../../js/signup.js
var $Form = $('#login');
    ^^^^^^^^^^^^^^^^^^^

Am I doing something wrong with --module flag, or missing something that would indicate that these files never come in contact? Or should I get into the habit of prefacing my variables from each child/page specific JS file like naming using $SignUp_Form and $Login_Form instead?

Upvotes: 2

Views: 1142

Answers (1)

Chad Killingsworth
Chad Killingsworth

Reputation: 14411

The module flag splits files. It does not give any indication that the files are loaded on separate pages.

Your best bet would be to either use distinct variable names, isolate the scopes using function wrappers or use either commonjs or es6 module s.

Upvotes: 1

Related Questions