1.首先执行:npm install  jQuery --save-dev,在package.json里加入jQuery。

2.修改build下的webpack.base.conf.js

方法一:

首先加入:

const webpack = require("webpack")

然后在module.exports 对象中加入:

  plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
jQuery: "jquery",
$: "jquery"
})
]

方法二:

先加入:

const webpack = require("webpack")

然后:

  resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
'vue$': 'vue/dist/vue.esm.js',
'@': resolve('src'),
'jquery': 'jquery'
}
},

最后:

  plugins: [
new webpack.ProvidePlugin({
jQuery: "jquery",
$: "jquery"
})
]

3.在app.vue中调用jquery

  mounted: function() {
console.log($);
console.log($('#ss')[0].innerHTML);
},

打印结果:

如何在vue-cli webpack中全局引入jquery的更多相关文章

  1. vue-cli webpack 中全局引入 jquery

    1.安装 jquery npm install jquery --save-dev 2.修改 webpack.base.conf.js 方法一 首先加入: const webpack = requir ...

  2. vue cli web pack 全局引入jquery

    之前 装过,装 npm i —save  jquery  然后直接执行了第二步 往后 1,首先在 package.json 里加入, 然后 npm install 2, 在webpack.base.c ...

  3. 在Vue的webpack中结合runder函数

    在Vue的webpack中结合runder函数 1.引入: <h1>下面是vue的内容:</h1> <div id="app"> <log ...

  4. 如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件

    copy内容的网址: https://segmentfault.com/a/1190000007020623 使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要 ...

  5. 如何在 vue 项目里正确地引用 jquery

    转载 2016年11月13日 使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要修改的是build/webpack.base.conf.js,修改两处的代码 / ...

  6. 如何在 vue 2.0+ 中引入全局的stylus文件,且能正常

    由于stylus在引用时,不能像一般的css文件直接在main.js中引用,就算引用了也会只能使用转换后的css,不能使用里面的函数,方法等,原因可能是:在这里引入会被直接编译成css,不能在别的模板 ...

  7. Vue CLI 3 中文文档

    翻译文档 文档翻译全貌 前言 之前写了一篇Vue CLI 3.x 版本的简单体验,当时文档还不全,具体的使用方法并不是很清楚,大概是2月7号,收到Vue CLI 3接近Beta版的提示,作者尤雨溪也讲 ...

  8. vue-cli3项目中全局引入less sass文件 以及使用本地图片在不同地方规则

    第一种直接在main.js中引入,需要声明loader demo: import '!style-loader!css-loader!less-loader!./assets/css/common.l ...

  9. vue+vuecli+webpack中使用mockjs模拟后端数据

    前言 使用mockjs可以事先模拟数据,前提是和后端约定好了数据接口,怎样的数据.使用mock就可以生成你要的数据了,从而实现开发时前后端分离. 其主要功能是: 基于数据模板生成模拟数据. 基于HTM ...

随机推荐

  1. 【java】HashMap、Map、Set、HashMap.put()、HashMap.keySet()、HashMap.entrySet()、Map.Entry内部类

    package com.tn.hashMap; public class Student { private String id; private String name; public Studen ...

  2. 二叉树Binary_Tree(1):二叉树及其数组实现

    定义 二叉树: 二叉树是一种特殊的树.二叉树的特点是每个结点最多有两个儿子,左边的叫做左儿子,右边的叫做右儿子,或者说每个结点最多有两棵子树.更加严格的递归定义是:二叉树要么为空,要么由根结点.左子树 ...

  3. ConcurrentDictionary内部函数的使用说明

    AddOrUpdate(...)函数的使用: private static ConcurrentDictionary<long, string> condic = new Concurre ...

  4. [array] leetcode - 42. Trapping Rain Water - Hard

    leetcode - 42. Trapping Rain Water - Hard descrition Given n non-negative integers representing an e ...

  5. VS2012 未找到与约束ContractName Microsoft.VisualStudio.Text.ITextDocumentFactoryService

    最近新换了系统还真是问题多多呀!! 系统更新补丁后打开 VS2012 ,新建C#项目的时候出现这个问题 VS2012 未找到与约束ContractName Microsoft.VisualStudio ...

  6. 瞎j8封装第二版之数据层的封装

    看了以前写的代码,对就是下面这个 手把手封装数据层之DataUtil数据库操作的封装 觉得以前写的代码好烂啊!!!,重新理了一下思路,写得更规范和简练,应该效率也会高很多,用了一下下午写的连接池(半废 ...

  7. myecplise自带的tomcat问题

    今天做一个项目时候,发现myecplise自带的tomcat上面部署了是可以运行的,可是当部署到自己下载的tomcat时候,就报错,tomcat可以启动,项目无法启动,查了问题,发现是web,xml中 ...

  8. C#中&与&&的区别

    c#&是什么意思? 看过一些文章,关于这个的简单而容易被忽略的语法,说的总有点瑕疵. 贴代码15秒之内应该能知道c#中一个&和两个&&的区别,开始计数了........ ...

  9. bzoj 4653: [Noi2016]区间

    Description 在数轴上有 n个闭区间 [l1,r1],[l2,r2],...,[ln,rn].现在要从中选出 m 个区间,使得这 m个区间共同包含至少一个位置.换句话说,就是使得存在一个 x ...

  10. elasticsearch 源码本地环境搭建

    elasticsearch6.0.0 源码本地环境搭建步骤如下: 1.资源准备 ElasicSearch版本:6.0.0: https://github.com/elastic/elasticsear ...