在vue-cli4中使用jquery

时间:2021-08-14 22:02:07 类型:vue
字号:    

在vue-cli4中使用jquery

1,  安装jquery

    npm install jquery -save

2, 项目下添加vue.config.js文件, 并添加内容如下:

const webpack = require('webpack')
 
module.exports = {
  chainWebpack: config => {
    config.plugin('provide').use(webpack.ProvidePlugin, [{
      $: 'jquery',
      jquery: 'jquery',
      jQuery: 'jquery',
      'window.jQuery': 'jquery'
    }])
  }
}

3, 在vue文件中引入并使用

import $ from 'jquery';
	export default{
		name:'Header',
	}
	$(function(){
		$("#navs>li").hover(function() {
					var li_w=$(this).width();
					$(this).children("ul").width(li_w).fadeIn("slow");
				}, function() {
					$(this).children("ul").fadeOut("slow");
				});
	})


<