使用vue脚手架的项目如何引入JQuery第三方插件
1:下载jquery
npm install jquery --save
2:打开build文件夹下的webpack.base.conf.js文件:
1)在最上方 引入webpack
var webpack=require('webpack')
2)在module.exports里 配置JQuery插件:
  plugins: [ 
           new webpack.ProvidePlugin({ 
                 $:"jquery", 
                 jQuery:"jquery", 
                "windows.jQuery":"jquery"
        }) 
      ],
3:在入口文件main.js中输入
import $ from 'jquery'
4、测试使用


最后,要补充一点:
之前的测试例子失败了,是因为我把代码没有写到 $(); 里面,具体原因再来回顾一下下~~
通俗的来讲,$(function(){})里是加载完成才运行 (一进页面就加载) 写在外面边加载边运行(一般是全局变量)
补充:
1、$(function(){...}); 的完整写法是 $(document).ready(function(){...});
作用是保证DOM(浏览器对象模型)结构渲染完成后代码再执行,避免DOM结构未完成,找不到元素的错误。另外一个作用是当成立即执行匿名函数使用,避免引入全局变量(function(){ ... })()。
var a=1; //定义一个全局变量
(function(){
var b=2;//定义一个局部变量
alert(b);//输出2
})()
alert(a);//输出1
alert(b);//报错,b未定义,Uncaught ReferenceError: b is not defined
感谢https://zhidao.baidu.com/question/391884710628993645.html~
使用vue脚手架的项目如何引入JQuery第三方插件的更多相关文章
- 在vue项目中引入jquery
		在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ... 
- vue-cli配置jquery 以及jquery第三方插件
		只使用jquery: 1. cnpm install jquery --save 2. cnpm install @types/jquery --save-dev (不使用ts的不需要安装此声明 ... 
- 脚手架搭建的vue项目里引入jquery和bootstrap
		引入jquery: 1.在cmd输入:npm install jquery,回车,等待.. 2.在webpack.base.conf.js里进行如下操作: 3.在webpack.prod.conf.j ... 
- vue-cli3.0以上项目中引入jquery的方法
		这里配置的是vue-cli3.0引入jquery的方法,不是vue-cli2.0的配置方法 一.安装jquery npm install jquery --save 二.在vue.config.js ... 
- 使用vue脚手架搭建项目并将px自动转化为rem
		一.安装node.js环境 二.node.js安装完成后使用npm安装vue脚手架vue-cli和安装webpack,我这里用cnpm cnpm i @vue/cli -g //全局安装脚手架3.0 ... 
- Vue脚手架搭建项目
		全局安装vue脚手架 $ npm install -g vue-cli 卸载方法 $ npm uninstall -g vue-cli 查看vue版本(注意:大写的V) $ vue -V 创建项目 $ ... 
- 基于vue脚手架的项目打包上线(发布)方法和误区
		最近要把vue脚手架开发的一个项目上线,只知道vue脚手架是基于node的服务端项目,那么只需要 npm run dev 就可以轻松启动整个项目,当我想当然的给服务器配置合适的node环境(这里也遇到 ... 
- 1.vue脚手架搭建项目
		前言: 在使用Vue-cli脚手架搭建项目之前,需要安装node.js和npm以及vue-cli. 开始搭建项目: 1.打开cmd win+R 2.转到要搭建的项目路径: g: cd Webapp/v ... 
- web项目中引入jquery easyui
		jQuery easyui是一个基于jquery的用户界面插件集合,可以做出各种炫酷页面效果,大中型项目都可以使用些框架,非常好用,而且它有中文网,提供了大量的demo.下面我们看怎么将它引入到项目中 ... 
随机推荐
- vue下实现input实现图片上传,压缩,拼接以及旋转
			背景 作为一名前端工作人员,相信大家在开发系统的时候,经常有遇到需要这么一种需求,就是需要为用户保存上传的图片,很多小白遇到这个问题的时候,都会虎躯一震,以为会是一个棘手的问题,当你读完这篇文章的时候 ... 
- DS博客大作业--树 (陈梓灿组)
			1.树的存储结构说明 定义的结构体中,name是用于存放文件名称,string类型是字符串类型,定义了child孩子结点和brother兄弟结点. 2.树的函数说明 1.main函数 main函数中主 ... 
- yue
			1. 字节流与二进制文件 1.我的代码 public class Student { private int id; private String name; private int age; pri ... 
- 百度echars 插件 横坐标信息倾斜显示
			只需要 在xAxis 中加入 axisLabel:{ interval:0,//横轴信息全部显示 ... 
- Is JavaScript a pass-by-reference or pass-by-value language?
			Is JavaScript a pass-by-reference or pass-by-value language? A very detailed explanation about copyi ... 
- 自动化框架Quantum Automation Framework+cucumber+perfecto
			名词解释 Quantum: 一款基于JAVA的自动化框架,支持手机和桌面WEB的自动化测试.与cucumber和perfecto实现了整合,用于BDD自动化. Refer: http://projec ... 
- StringUtils.isBlank()检验String 类型的变量是否为空
			在校验一个String类型的变量是否为空时,通常存在3中情况 是否为 null 是否为 "" 是否为空字符串(引号中间有空格) 如: " ". Str ... 
- 阶段3 2.Spring_02.程序间耦合_4 曾经代码中的问题分析
			创建新的项目 修改打成jar包 创建一个接口 用来模拟保存的方法 创建接口的实现类 我们没有IAccountDao这个类.那么就需要去创建Iaccountdao IAccountDao接口的创建 创建 ... 
- SAS数据挖掘实战篇【七】
			SAS数据挖掘实战篇[七] 6.5 SAS EM数据挖掘-----预测模型 1 问题定义 目标:建立模型预测贷款申请的信用状态,选择最优的模型来预测和减少损失. 数据集:SAMPSIO.DMAGE ... 
- java:LeakFilling (Mybatis)
			1.实体类属性与数据库中字段名字不一样时,或者起别名时: TbOrderMapper.xml配置文件中,配置resultMap标签: 其它相同的标签也需要配,否则查询不出来对应数据. 2.一对一关联: ... 
