I just started a new project and am working with a bootstrap theme that I would like integrated with my Nuxt.js project.
I believe I have loaded all of the css asset files properly, although I am trying to figure out how to properly add the JS files.
I have tried loading the script source files in nuxt.config.js
like this:
export default {
mode: 'universal',
/*
** Headers of the page
*/
head: {
title: process.env.npm_package_name || '',
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
{ hid: 'description', name: 'description', content: process.env.npm_package_description || '' }
],
link: [
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
],
script: [
{ src: './assets/js/jquery-1.11.0.min.js'},
{ src: './assets/bootstrap/js/bootstrap.min.js'},
{ src: './assets/js/jquery.backstretch.min.js'},
{ src: './assets/js/owl.carousel.min.js'},
{ src: './assets/js/jquery.knob.min.js'},
{ src: './assets/js/jquery.magnific-popup.min.js'},
{ src: './assets/js/jquery.simple-text-rotator.min.js'},
{ src: './assets/js/jquery.waypoints.js'},
{ src: './assets/js/wow.min.js'},
{ src: './assets/js/smoothscroll.js'},
{ src: './assets/js/jquery.fitvids.js'},
{ src: './assets/js/gmaps.js'},
{ src: './assets/js/custom.js'},
{ src: 'http://maps.google.com/maps/api/js?sensor=true'}
]
},
...
and I have also tried adding theme directly within my index.vue
file like this:
<script>
// import Logo from '~/components/Logo.vue'
export default {
components: {
// Logo
},
head () {
return {
script: [
{ src: '/assets/js/jquery-1.11.0.min.js'},
{ src: '/assets/bootstrap/js/bootstrap.min.js'},
{ src: '/assets/js/jquery.backstretch.min.js'},
{ src: '/assets/js/owl.carousel.min.js'},
{ src: '/assets/js/jquery.knob.min.js'},
{ src: '/assets/js/jquery.magnific-popup.min.js'},
{ src: '/assets/js/jquery.simple-text-rotator.min.js'},
{ src: '/assets/js/jquery.waypoints.js'},
{ src: '/assets/js/wow.min.js'},
{ src: '/assets/js/smoothscroll.js'},
{ src: '/assets/js/jquery.fitvids.js'},
{ src: '/assets/js/gmaps.js'},
{ src: '/assets/js/custom.js'},
{ src: 'http://maps.google.com/maps/api/js?sensor=true'}
]
}
}
}
</script>
I've tried starting the paths with ~/
, /
as well as ./
The issue is that these source files are not being found with the declared path.
Any ideas or help is greatly appreciated!