Use jQuery with NuxtJS

nuxt.config.js

const webpack = require('webpack')

module.exports = {
  // other configs
  build: {
    plugins: [
      new webpack.ProvidePlugin({
        $: 'jquery',
        jQuery: 'jquery',
        'window.jQuery': 'jquery'
      })
    ]
  },
  // other configs
}

package.json

{
  // other configs.
  "dependencies": {
    // Replace <jquery.version> with the jquery version you want.
    "jquery": "<jquery.version>"
  },
  // other configs.
}

In the webpack v4, the vendor option was removed

I 've updated.

Save jquery.min.js

modify nuxt.config.js

'plugins': [
     { src: '~/plugins/jquery.min.js', ssr: false }
],

You should install jquery via npm/yarn. You can update it easier.

there is any way to use jquery within Vuejs components with $, please?

there is any way to use jquery within Vuejs components with $, please?

Try this and see if it helps... https://forum.vuejs.org/t/how-to-use-jquery-in-vue-component/45000/5

in Nuxt3

First you need to install jquery in your project

npm i jquery

Then in the file ~/plugins/jquery.js add the following codes:

import $ from 'jquery'
window.jQuery = window.$ = $
export default jQuery;

And finally add the following code to the nuxt.config.ts

plugins: [
  { src: "~/plugins/jquery", mode: "client" },
 ],

Sample

<script setup>
   onMounted(()=>{
      console.log($('body'));
   })
</script>