Using backboneJS and loading two different builds of jquery works but not one or the other
This is a bit of a dated question but still curious and I am not pulling anything up, other than it is bad practice. (BTW the code that this is on will not be going to production with two)
I have a backbone.js app that I am updating jQuery from 1.9.1 to the 3.1.1. With how it is built up right now, I can use 3.1.1 but only if I also have version 2.2.4 loaded in as well. If I remove one or the other script tag, the app breaks and I get Uncaught ReferenceError: jQuery is not defined and Uncaught TypeError: $ is not a function as the errors that range across the board.
I have added var $= jQuery; to where the jQuery is first loaded but that error still persists.
Wondering where I got off track and/or why this is happening.
How the scripts are being loaded in
<script type="text/javascript" src="libs/jquery.min.js"></script>
<script type="text/javascript" src="libs/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="libs/underscore-min.js"></script>
<script type="text/javascript" src="libs/backbone-min.js"></script>
<script type="text/javascript" src="libs/tooltip.js"></script>
<script type="text/javascript" src="libs/popper.js"></script>
<script type="text/javascript" src="libs/bootstrap.js"></script>
<script type="text/javascript" src="libs/tooltip.js"></script>
<script type="text/javascript" src="libs/less.min.js"></script>
<script type="text/javascript" src="libs/mobiledatepicker.jquery.js"></script>
<script type="text/javascript" src="libs/moment.min.js"></script>
<script type="text/javascript" src="libs/serialize.min.js"></script>
<script type="text/javascript" src="libs/sha256.min.js"></script>
Last thing I am on backbone 1.3.3 and bootstrap 4. The code does work up to jQuery version 2.0.3
javascript jquery backbone.js
asked Nov 14 '18 at 21:36
Dex MillsDex Mills
14
|
show 6 more comments
This is a bit of a dated question but still curious and I am not pulling anything up, other than it is bad practice. (BTW the code that this is on will not be going to production with two)
I have a backbone.js app that I am updating jQuery from 1.9.1 to the 3.1.1. With how it is built up right now, I can use 3.1.1 but only if I also have version 2.2.4 loaded in as well. If I remove one or the other script tag, the app breaks and I get Uncaught ReferenceError: jQuery is not defined and Uncaught TypeError: $ is not a function as the errors that range across the board.
I have added var $= jQuery; to where the jQuery is first loaded but that error still persists.
Wondering where I got off track and/or why this is happening.
How the scripts are being loaded in
<script type="text/javascript" src="libs/jquery.min.js"></script>
<script type="text/javascript" src="libs/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="libs/underscore-min.js"></script>
<script type="text/javascript" src="libs/backbone-min.js"></script>
<script type="text/javascript" src="libs/tooltip.js"></script>
<script type="text/javascript" src="libs/popper.js"></script>
<script type="text/javascript" src="libs/bootstrap.js"></script>
<script type="text/javascript" src="libs/tooltip.js"></script>
<script type="text/javascript" src="libs/less.min.js"></script>
<script type="text/javascript" src="libs/mobiledatepicker.jquery.js"></script>
<script type="text/javascript" src="libs/moment.min.js"></script>
<script type="text/javascript" src="libs/serialize.min.js"></script>
<script type="text/javascript" src="libs/sha256.min.js"></script>
Last thing I am on backbone 1.3.3 and bootstrap 4. The code does work up to jQuery version 2.0.3
javascript jquery backbone.js
asked Nov 14 '18 at 21:36
Dex MillsDex Mills
14
jQuery is not definedindicates a plugin is trying to usejQuerybefore it is imported.
– Taplar
Nov 14 '18 at 21:37
Right, I thought it was where it was imported in but I have moved it to the top of the scripts list and it is still throwing that error. jQuery is the first thing loaded in and double checked the network to confirm it is the first thing in.
– Dex Mills
Nov 14 '18 at 21:39
you don't have theasyncattribute on the script include, do you?
– Taplar
Nov 14 '18 at 21:47
You don't want the async attribute on any script include that is a dependency for another script include, so if you didn't have that, that's fine. Not clear why it's saying its not defined then. You said you checked your network console and you see that the request is being made, it's successfully pulling the file, and the resource pulled does indeed include the jQuery source code?
– Taplar
Nov 14 '18 at 21:52
That is correct. It is showing both beings loaded, when it works, as well when it is only one.
– Dex Mills
Nov 14 '18 at 21:55
|
show 6 more comments
This is a bit of a dated question but still curious and I am not pulling anything up, other than it is bad practice. (BTW the code that this is on will not be going to production with two)
I have a backbone.js app that I am updating jQuery from 1.9.1 to the 3.1.1. With how it is built up right now, I can use 3.1.1 but only if I also have version 2.2.4 loaded in as well. If I remove one or the other script tag, the app breaks and I get Uncaught ReferenceError: jQuery is not defined and Uncaught TypeError: $ is not a function as the errors that range across the board.
I have added var $= jQuery; to where the jQuery is first loaded but that error still persists.
Wondering where I got off track and/or why this is happening.
How the scripts are being loaded in
<script type="text/javascript" src="libs/jquery.min.js"></script>
<script type="text/javascript" src="libs/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="libs/underscore-min.js"></script>
<script type="text/javascript" src="libs/backbone-min.js"></script>
<script type="text/javascript" src="libs/tooltip.js"></script>
<script type="text/javascript" src="libs/popper.js"></script>
<script type="text/javascript" src="libs/bootstrap.js"></script>
<script type="text/javascript" src="libs/tooltip.js"></script>
<script type="text/javascript" src="libs/less.min.js"></script>
<script type="text/javascript" src="libs/mobiledatepicker.jquery.js"></script>
<script type="text/javascript" src="libs/moment.min.js"></script>
<script type="text/javascript" src="libs/serialize.min.js"></script>
<script type="text/javascript" src="libs/sha256.min.js"></script>
Last thing I am on backbone 1.3.3 and bootstrap 4. The code does work up to jQuery version 2.0.3
javascript jquery backbone.js
asked Nov 14 '18 at 21:36
Dex MillsDex Mills
14
This is a bit of a dated question but still curious and I am not pulling anything up, other than it is bad practice. (BTW the code that this is on will not be going to production with two)
I have a backbone.js app that I am updating jQuery from 1.9.1 to the 3.1.1. With how it is built up right now, I can use 3.1.1 but only if I also have version 2.2.4 loaded in as well. If I remove one or the other script tag, the app breaks and I get Uncaught ReferenceError: jQuery is not defined and Uncaught TypeError: $ is not a function as the errors that range across the board.
I have added var $= jQuery; to where the jQuery is first loaded but that error still persists.
Wondering where I got off track and/or why this is happening.
How the scripts are being loaded in
<script type="text/javascript" src="libs/jquery.min.js"></script>
<script type="text/javascript" src="libs/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="libs/underscore-min.js"></script>
<script type="text/javascript" src="libs/backbone-min.js"></script>
<script type="text/javascript" src="libs/tooltip.js"></script>
<script type="text/javascript" src="libs/popper.js"></script>
<script type="text/javascript" src="libs/bootstrap.js"></script>
<script type="text/javascript" src="libs/tooltip.js"></script>
<script type="text/javascript" src="libs/less.min.js"></script>
<script type="text/javascript" src="libs/mobiledatepicker.jquery.js"></script>
<script type="text/javascript" src="libs/moment.min.js"></script>
<script type="text/javascript" src="libs/serialize.min.js"></script>
<script type="text/javascript" src="libs/sha256.min.js"></script>
Last thing I am on backbone 1.3.3 and bootstrap 4. The code does work up to jQuery version 2.0.3
javascript jquery backbone.js
javascript jquery backbone.js
asked Nov 14 '18 at 21:36
Dex MillsDex Mills
14
asked Nov 14 '18 at 21:36
Dex MillsDex Mills
14
edited Nov 15 '18 at 17:20
Dex Mills
asked Nov 14 '18 at 21:36
Dex MillsDex Mills
14
asked Nov 14 '18 at 21:36
Dex MillsDex Mills
14
asked Nov 14 '18 at 21:36
Dex MillsDex Mills
14
14
jQuery is not definedindicates a plugin is trying to usejQuerybefore it is imported.
– Taplar
Nov 14 '18 at 21:37
Right, I thought it was where it was imported in but I have moved it to the top of the scripts list and it is still throwing that error. jQuery is the first thing loaded in and double checked the network to confirm it is the first thing in.
– Dex Mills
Nov 14 '18 at 21:39
you don't have theasyncattribute on the script include, do you?
– Taplar
Nov 14 '18 at 21:47
You don't want the async attribute on any script include that is a dependency for another script include, so if you didn't have that, that's fine. Not clear why it's saying its not defined then. You said you checked your network console and you see that the request is being made, it's successfully pulling the file, and the resource pulled does indeed include the jQuery source code?
– Taplar
Nov 14 '18 at 21:52
That is correct. It is showing both beings loaded, when it works, as well when it is only one.
– Dex Mills
Nov 14 '18 at 21:55
|
show 6 more comments
jQuery is not definedindicates a plugin is trying to usejQuerybefore it is imported.
– Taplar
Nov 14 '18 at 21:37
Right, I thought it was where it was imported in but I have moved it to the top of the scripts list and it is still throwing that error. jQuery is the first thing loaded in and double checked the network to confirm it is the first thing in.
– Dex Mills
Nov 14 '18 at 21:39
you don't have theasyncattribute on the script include, do you?
– Taplar
Nov 14 '18 at 21:47
You don't want the async attribute on any script include that is a dependency for another script include, so if you didn't have that, that's fine. Not clear why it's saying its not defined then. You said you checked your network console and you see that the request is being made, it's successfully pulling the file, and the resource pulled does indeed include the jQuery source code?
– Taplar
Nov 14 '18 at 21:52
That is correct. It is showing both beings loaded, when it works, as well when it is only one.
– Dex Mills
Nov 14 '18 at 21:55
jQuery is not defined indicates a plugin is trying to use jQuery before it is imported.– Taplar
Nov 14 '18 at 21:37
jQuery is not defined indicates a plugin is trying to use jQuery before it is imported.– Taplar
Nov 14 '18 at 21:37
Right, I thought it was where it was imported in but I have moved it to the top of the scripts list and it is still throwing that error. jQuery is the first thing loaded in and double checked the network to confirm it is the first thing in.
– Dex Mills
Nov 14 '18 at 21:39
Right, I thought it was where it was imported in but I have moved it to the top of the scripts list and it is still throwing that error. jQuery is the first thing loaded in and double checked the network to confirm it is the first thing in.
– Dex Mills
Nov 14 '18 at 21:39
you don't have the
async attribute on the script include, do you?– Taplar
Nov 14 '18 at 21:47
you don't have the
async attribute on the script include, do you?– Taplar
Nov 14 '18 at 21:47
You don't want the async attribute on any script include that is a dependency for another script include, so if you didn't have that, that's fine. Not clear why it's saying its not defined then. You said you checked your network console and you see that the request is being made, it's successfully pulling the file, and the resource pulled does indeed include the jQuery source code?
– Taplar
Nov 14 '18 at 21:52
You don't want the async attribute on any script include that is a dependency for another script include, so if you didn't have that, that's fine. Not clear why it's saying its not defined then. You said you checked your network console and you see that the request is being made, it's successfully pulling the file, and the resource pulled does indeed include the jQuery source code?
– Taplar
Nov 14 '18 at 21:52
That is correct. It is showing both beings loaded, when it works, as well when it is only one.
– Dex Mills
Nov 14 '18 at 21:55
That is correct. It is showing both beings loaded, when it works, as well when it is only one.
– Dex Mills
Nov 14 '18 at 21:55
|
show 6 more comments
1 Answer
1
active
oldest
votes
So found out this was more to do with the window that I was loading it in. Don't and still can figure out why two version of jQuery would load and make the page responsive but a single one would not.
Issue came down to I was loading the pages and scripts into an electron app.
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script> and
<script>if (window.module) module = window.module;</script>
wrapped around the code cleared up the issue with only loading one.
answered Nov 15 '18 at 22:03
Dex MillsDex Mills
14
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53309080%2fusing-backbonejs-and-loading-two-different-builds-of-jquery-works-but-not-one-or%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
So found out this was more to do with the window that I was loading it in. Don't and still can figure out why two version of jQuery would load and make the page responsive but a single one would not.
Issue came down to I was loading the pages and scripts into an electron app.
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script> and
<script>if (window.module) module = window.module;</script>
wrapped around the code cleared up the issue with only loading one.
answered Nov 15 '18 at 22:03
Dex MillsDex Mills
14
add a comment |
So found out this was more to do with the window that I was loading it in. Don't and still can figure out why two version of jQuery would load and make the page responsive but a single one would not.
Issue came down to I was loading the pages and scripts into an electron app.
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script> and
<script>if (window.module) module = window.module;</script>
wrapped around the code cleared up the issue with only loading one.
answered Nov 15 '18 at 22:03
Dex MillsDex Mills
14
add a comment |
So found out this was more to do with the window that I was loading it in. Don't and still can figure out why two version of jQuery would load and make the page responsive but a single one would not.
Issue came down to I was loading the pages and scripts into an electron app.
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script> and
<script>if (window.module) module = window.module;</script>
wrapped around the code cleared up the issue with only loading one.
answered Nov 15 '18 at 22:03
Dex MillsDex Mills
14
So found out this was more to do with the window that I was loading it in. Don't and still can figure out why two version of jQuery would load and make the page responsive but a single one would not.
Issue came down to I was loading the pages and scripts into an electron app.
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script> and
<script>if (window.module) module = window.module;</script>
wrapped around the code cleared up the issue with only loading one.
answered Nov 15 '18 at 22:03
Dex MillsDex Mills
14
answered Nov 15 '18 at 22:03
Dex MillsDex Mills
14
answered Nov 15 '18 at 22:03
Dex MillsDex Mills
14
answered Nov 15 '18 at 22:03
Dex MillsDex Mills
14
14
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53309080%2fusing-backbonejs-and-loading-two-different-builds-of-jquery-works-but-not-one-or%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
jQuery is not definedindicates a plugin is trying to usejQuerybefore it is imported.– Taplar
Nov 14 '18 at 21:37
Right, I thought it was where it was imported in but I have moved it to the top of the scripts list and it is still throwing that error. jQuery is the first thing loaded in and double checked the network to confirm it is the first thing in.
– Dex Mills
Nov 14 '18 at 21:39
you don't have the
asyncattribute on the script include, do you?– Taplar
Nov 14 '18 at 21:47
You don't want the async attribute on any script include that is a dependency for another script include, so if you didn't have that, that's fine. Not clear why it's saying its not defined then. You said you checked your network console and you see that the request is being made, it's successfully pulling the file, and the resource pulled does indeed include the jQuery source code?
– Taplar
Nov 14 '18 at 21:52
That is correct. It is showing both beings loaded, when it works, as well when it is only one.
– Dex Mills
Nov 14 '18 at 21:55