Adding as globally
Navigate to the nuxt.config.js file.
It adds the script tag to all pages in your Nuxt app.
export default {
head: {
script: [
{
src: "https://code.jquery.com/jquery-3.5.1.min.js",
},
],
}
// other config goes here
}
If you want to add a script tag before closing the </body>
instead of <head>
tag, you can do it by adding a body: true
.
script: [
{
src: "https://code.jquery.com/jquery-3.5.1.min.js",
body: true,
},
You can also add async, cross-origin attributes to a script tag like this.
script: [
{
src: "https://code.jquery.com/jquery-3.5.1.min.js",
async: true,
crossorigin: "anonymous"
},
],
OUTPUT
<script data-n-head="ssr" src="https://code.jquery.com/jquery-3.5.1.min.js"
crossorigin="anonymous" async=""></script>
Adding to particular page
<script>
export default {
head() {
return {
script: [
{
src: 'https://code.jquery.com/jquery-3.5.1.min.js'
}
],
}
}
}
</script>
Note:
If you want to add a local js file, place it in a root static
folder and add it as follows.
export default {
head() {
return {
script: [
{
src: '/js/jquery.min.js'
}
],
}
}
}
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…