Nuxtjs 引入jq的第三方库报错jquery.bgswitcher.js:559 Uncaught ReferenceError: jQuery is not defined方案(已解决)

 

 

 demo 请狠狠的戳这里   https://download.lllomh.com/cliect/#/product/LC13263245955860

网上很多资料,但是没有一个是关于nuxt 导入jq插件的相关的,有的也是告诉你怎么导入jq而已.这里记录下导入 依赖jq 的插件写法:

这里我就根据 jQuery.headroom.js 插件为例子

1,首先改造一下该插件的写法:   /plugins/bgswitcher.js

export function chatBg($,jQuery){

... code

}

2,在需要使用的地方导入: pages/home.vue:

import {chatBg} from '../../plugins/bgswitcher'

3,调用的时候传进去:

  mounted() {
    chatBg($,jQuery)
    jQuery(function($) {
      $('.bg-slider').bgSwitcher({
        images: ['img/main01.jpg','img/main02.jpg','img/main03.jpg','img/main04.jpg','img/main05.jpg'],
      });
    });
  },

这样就可以使用了.