Add Jquery to Vue-Cli 3
#2 You forget to add configureWebpack into vue.config.js
const webpack = require('webpack')
module.exports = {
configureWebpack: {
plugins: [
new webpack.ProvidePlugin({
$: 'jquery',
jquery: 'jquery',
'window.jQuery': 'jquery',
jQuery: 'jquery'
})
]
},
}
Solved it by adding to main.js
window.$ = window.jQuery = require('jquery');
That did it for me and jQuery is now available globally.
Another approach would be;
Vue.use({
install: function(Vue, options){
Vue.prototype.$jQuery = require('jquery'); // you'll have this.$jQuery anywhere in your vue project
}
});
I hope this will help someone stumbling over the same problem in the future. If you still can't figure it out, check this question or have a look at the documentation.
edit: make sure you ran npm install jquery
.
I did it by following steps:
first install jquery
npm install jquery --save-dev
in any component or view:
<script>
import jQuery from "jquery";
const $ = jQuery;
window.$ = $;
....
....
....
or as above answer, both are same:
window.$ = window.jQuery = require("jquery");
now you can use anywhere in the page, for globally availability, simply follow the above said answer.