创建一个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的第三方插件的更多相关文章

  1. vue之导入Bootstrap以及jQuery的两种方式

    Vue引入bootstrap主要有两种方法 方法一:在main.js中引入,此方法导入的bootstrap中对于html,body的一些预设置的css样式可能无效. 一.引入jQuery 在当前项目的 ...

  2. vue之导入Bootstrap和Jquery

    Vue引入bootstrap主要有两种方法 方法一:在main.js中引入,此方法导入的bootstrap中对于html,body的一些预设置的css样式可能无效. 一.引入jQuery 在当前项目的 ...

  3. webpack系列——webpack3导入jQuery的新方案

    本文的目的 拒绝全局导入jQuery!! 拒绝script导入jQuery!! 找到一种只在当前js组件中引入jQuery,并且使用webpack切割打包的方案! 测试环境 以下测试在webpack3 ...

  4. vue项目搭建和开发流程 vue项目配置ElementUI、jQuery和Bootstrap环境

    目录 一.VUE项目的搭建 1. 环境搭建 2. 项目的创建和启动 二. 开发项目 1. 配置vue项目启动功能 2. 开发vue项目 (1)项目文件的作用 (2)vue项目开发流程 (3)vue项目 ...

  5. vue项目引入bootstrap、jquery

    在进行vue的学习,项目中需要引入bootstrap.jquery的步骤. 一.引入jQuery 在当前项目的目录下(就是package.json),运行命令 cnpm install jquery ...

  6. Vue.Js加入bootstrap及jquery,或加入其他插件vue-resource,vuex等

    .引入jquery 项目目录下输入 cnpm install jquery --save-dev      用npm下载jq依赖 若想加入其他js库,如vue-resource,执行命令cnpm in ...

  7. vue工程化之项目引入jquery

    既然写项目,那么少不了用jq,那我们就引入进来吧 1.因为已经安装了vue脚手架,所以需要在webpack中全局引入jquery 打开package.json文件,在里面加入这行代码,jquery后面 ...

  8. vue/cli 3 引入 使用jQuery

    注意这里配置的是vue-cli3.0引入jquery的方法,不是vue-cli2.0的配置方法 一.安装jquery npm install jquery --save 二.一般安装成功后在packa ...

  9. Mac下通过npm安装webpack 、vuejs,以及引入jquery、bootstrap等(初稿)

    前言: 初次接触前端开发技术,一些方向都是在同事的指引和自己的探索后,跑了个简易web,迈入全栈系列.由于是事后来的文章,故而暂只是杂记,写的粗略且不清晰,后续将补之. 主要参考文档: http:// ...

随机推荐

  1. hbase 性能优化 (转载)

    一.服务端调优 1.参数配置 1).hbase.regionserver.handler.count:该设置决定了处理RPC的线程数量,默认值是10,通常可以调大,比如:150,当请求内容很大(上MB ...

  2. 树莓派B+使用入门&RPI库安装&wringPi库安装

    最近看看试用一下树莓派进行一些开发操作,于是入手一块Raspberry Pi B+的板子来玩.由于没有显示器,没有备用的键盘和鼠标,所以想到用SSH来控制树莓派,刚开始还很担心已经安装好的操作系统到底 ...

  3. Fiddler和app抓包

    1:请在“运行”,即下面这个地方输入certmgr.msc并回车,打开证书管理. 打开后,请点击操作--查找证书,如下所示: 然后输入“fiddler”查找所有相关证书,如下所示: 可以看到,我们找到 ...

  4. vue-cli 2篇官方文档记录收藏

    https://cli.vuejs.org/guide/ http://vuejs-templates.github.io/webpack/

  5. 如何修改SnipeIT的部分设置

    作为一款开源的资产管理系统,Snipe-IT非常的好用又结实,但是原始设置对中国用户有些不方便,部分汉化没有完成,需要直接修改代码,下面把常用的修改记录如下: 1.修改资产打印标签中的文本名称 找到  ...

  6. NOIP2013提高组 T2 火柴排队

    一开始看也想不到这居然要用到逆序对,归并排序. 先来看看题目: 涵涵有两盒火柴,每盒装有 n 根火柴,每根火柴都有一个高度. 现在将每盒中的火柴各自排成一列, 同一列火柴的高度互不相同, 两列火柴之间 ...

  7. css3_transition: 体验好的过渡效果。附 好看的按钮

    利用css的transition属性详解,上图就是利用transition效果做的一个按钮. transition属性://举例子:transition:all 1s ease;transition: ...

  8. c++链表基本操作

    #include <stdlib.h> #include <malloc.h> #include <stdio.h> typedef struct Node { i ...

  9. [jzoj]3468.【NOIP2013模拟联考7】OSU!(osu)

    Link https://jzoj.net/senior/#main/show/3468 Description osu 是一款群众喜闻乐见的休闲软件. 我们可以把osu的规则简化与改编成以下的样子: ...

  10. # xrdp 在linux deploy 折腾记录

    xrdp 在linux deploy 折腾记录 1. xrdp connect fail vnc 不管用tiger or vnc4server都可以正常用,但xrdp无法连接 netstat -tnl ...