Webpack+Vue如何导入Jquery和Jquery的第三方插件
创建一个jquery-vendor.js文件
import $ from 'jQuery';
console.log($);
window.$ = $;
window.jQuery = $;
export default $;
导入JQuery,并赋值给window对象,使其成为一个全局变量。
在vue组件做如下引用
import $ from './assets/jquery-v';
import 'bootstrap-material-design';
//调用初始化
$(function(){
$.material.init();
});
注意:
1. 只可以在vue的组件中引用
2.如果在main.js中引入jquery.js是Ok的,但这种情况下无论是在mian.js或者是vue组件中引入jquery的第三方插件就有问题了。
Webpack+Vue如何导入Jquery和Jquery的第三方插件的更多相关文章
- vue之导入Bootstrap以及jQuery的两种方式
Vue引入bootstrap主要有两种方法 方法一:在main.js中引入,此方法导入的bootstrap中对于html,body的一些预设置的css样式可能无效. 一.引入jQuery 在当前项目的 ...
- vue之导入Bootstrap和Jquery
Vue引入bootstrap主要有两种方法 方法一:在main.js中引入,此方法导入的bootstrap中对于html,body的一些预设置的css样式可能无效. 一.引入jQuery 在当前项目的 ...
- webpack系列——webpack3导入jQuery的新方案
本文的目的 拒绝全局导入jQuery!! 拒绝script导入jQuery!! 找到一种只在当前js组件中引入jQuery,并且使用webpack切割打包的方案! 测试环境 以下测试在webpack3 ...
- vue项目搭建和开发流程 vue项目配置ElementUI、jQuery和Bootstrap环境
目录 一.VUE项目的搭建 1. 环境搭建 2. 项目的创建和启动 二. 开发项目 1. 配置vue项目启动功能 2. 开发vue项目 (1)项目文件的作用 (2)vue项目开发流程 (3)vue项目 ...
- vue项目引入bootstrap、jquery
在进行vue的学习,项目中需要引入bootstrap.jquery的步骤. 一.引入jQuery 在当前项目的目录下(就是package.json),运行命令 cnpm install jquery ...
- Vue.Js加入bootstrap及jquery,或加入其他插件vue-resource,vuex等
.引入jquery 项目目录下输入 cnpm install jquery --save-dev 用npm下载jq依赖 若想加入其他js库,如vue-resource,执行命令cnpm in ...
- vue工程化之项目引入jquery
既然写项目,那么少不了用jq,那我们就引入进来吧 1.因为已经安装了vue脚手架,所以需要在webpack中全局引入jquery 打开package.json文件,在里面加入这行代码,jquery后面 ...
- vue/cli 3 引入 使用jQuery
注意这里配置的是vue-cli3.0引入jquery的方法,不是vue-cli2.0的配置方法 一.安装jquery npm install jquery --save 二.一般安装成功后在packa ...
- Mac下通过npm安装webpack 、vuejs,以及引入jquery、bootstrap等(初稿)
前言: 初次接触前端开发技术,一些方向都是在同事的指引和自己的探索后,跑了个简易web,迈入全栈系列.由于是事后来的文章,故而暂只是杂记,写的粗略且不清晰,后续将补之. 主要参考文档: http:// ...
随机推荐
- python 项目实例
参考: https://blog.csdn.net/yz764127031/article/details/71522161 https://www.cnblogs.com/linuxprobe/p ...
- linux磁盘满了的处理
1.查看磁盘使用情况 cd / df -h 如果 总量Size和Used一样,按就证明磁盘满了 2.查看当前文件下每个文件大小 du -sh * 一层一层去查,就可以查到占用空间最大的那个文件及产生 ...
- c# asp.net mvc使用斑马GK888t打印机打印标签
前言 c#语言,asp.net mvc,南京都昌电子病历模板工具(类似word),斑马GK888t,打印手腕带和标签纸. 实现步骤为:在页面上显示一个或多个都昌模板工具,点击页面上的button,出现 ...
- c# asp.net mvc4 使用uploadify插件实现上传功能
[1]首先去官网下载插件:http://www.uploadify.com/download/ .ww我使用的是免费的,基于flash的版本.因为基于H5的版本需付费使用,然后使用该插件也就是做做毕设 ...
- 阿里云 DTS 实践
控制台 https://dts.console.aliyun.com/#/task/basic/ 操作 填写源目标和目的数据库信息 选择需要迁移的数据库 检查通过 现在好像是免费的,计时收费也很便宜 ...
- 关于 js中replace 特殊符号 ‘.’ 的问题
问题: 字符串转数组,但是分割点在‘.’ ,需要保留每个后缀的 ‘.’ + 类型 解决: let videoType = '.avi.rmvb.rm.asf.divx.mpg.mpeg.mpe.wmv ...
- Python练手例子(16)
91.时间函数举例1. #!/usr/bin/python #coding=utf-8 import time if __name__ == '__main__': #time.time()返回当前的 ...
- LAMP构架搭建论坛
安装MYSQL数据库服务程序 LAMP动态网站部署架构是一套由Linux+Nginx+MYSQL+PHP组成的动态网站系统解决方案,具有免费.高效.扩展性强且资源消耗低等优良特性.使用手工 ...
- ASP.NET Core应用的错误处理[4]:StatusCodePagesMiddleware中间件如何针对响应码呈现错误页面
StatusCodePagesMiddleware中间件与ExceptionHandlerMiddleware中间件比较类似,它们都是在后续请求处理过程中“出错”的情况下利用一个错误处理器来完成最终的 ...
- 1.9 From Native to HTML5
The mobile technology has become more and more mature, and it has evolved from a ridiculous situatio ...