Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
TypeError: jQuery present, loading script in head
See original GitHub issueWhen using jQuery and loading JS pack from the <head> Bootstrap 5 throws an error:
The offending line:
should check for the presence of body.
Docs do not state that JS bundle needs to be in the body so I conclude this is a bug. Happy to submit a PR if confirmed.
- Operating system and version: macOS Catalina
- Browser and version: Chrome 83.0.4103.116
Demo site: https://amazing-heisenberg-e74368.netlify.app/ (see console)
Issue Analytics
- State:
- Created 3 years ago
- Comments:14 (11 by maintainers)
Top Results From Across the Web
Use jQuery without Script tag in head - Stack Overflow
So I want to make jQuery load inside my script. the user doesn't have to add the <script> to the head, but the...
Read more >5 Easy Ways to Fix the "jQuery is Not Defined" Error - Kinsta
The "jQuery is not defined" error means a call for a specific jQuery that wasn't available when the website loaded. Here's how to...
Read more >Chapter 10 JavaScript for Shiny
You can run this script either in RStudio IDE or VSCode. ... To use jQuery in a web page, we must import its...
Read more >Why $(document).ready(function() not work in a Blade view ?
Put your jquery after everything else on page, below body tag. Load it in head section. I never had any problem doing it...
Read more >jQuery and Ajax Tutorial
Take note that $() is an alias of jQuery() function. Recall that JavaScript's identifier must start with an alphabet, '_' or '$' ....
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
@Johann-S @chrisdavies71 while moving the script to the body certainly works, it introduces a limitation. I can see associated costs but not many benefits, so I’d like to discuss if that limitation is justified.
To give some background, I’m working with a Rails app using Turbolinks, JS bundles are optimized for caching and placed in
head. This works without issues in v4.To make this work with v5, I can’t move everything into
body(Turbolinks need to stay in head), so I’ll need a separate bundle. This isn’t always a trivial task.So it looks to me like we’re trading the flexibility of being able to load JS code from anywhere for the abillity to read an attribute from the
body. Is there anything else on the roadmap that depends on the JS code being run from thebodythat would make a stronger case for strict placement inside ofbody?Perhaps we could maintain the flexibility if: a) reading
data-no-jqueryattribute doesn’t throw an error when executed from theheadb) just likejQueryis found on thewindowobject, we could look for a flag property on thewindowobject to opt out ofjQueryplugins (e.g.window.bsNoJquery), rather than looking for that flag on thebodyCan you try to load the JS at the end of the body ? That’s what we recommend here: https://v5.getbootstrap.com/docs/5.0/getting-started/introduction/#js