使用vue-cli开发过程中如何把jQuery设置为全局

说明：vue-cli是vue快速构建项目的命令行式开发模式。

vue主要针对数据层，更多的操作在数据上，很少在DOM上，偶尔也会需要操作DOM，偶尔也会用到JQ插件，下面简单说下如何在使用vue-cli开发时候把JQ设置为全局的公用方法。

步骤：

1、npm install jquery -S

此时package.json内会自动添加一个最新版本的jquery，如果需要指定版本，安装的时候自己指定。

如下图

2、打开build/webpack.base.conf.js文件，最上面先添加一行：var webpack = require("webpack")

再在下面添加上webpack的插件如下图的位置

3、此时已经成功吧JQ设置为全局了，使用的时候可以像使用script那样正常使用了！

时间： 2024-10-01 11:13:47

使用vue-cli开发过程中如何把jQuery设置为全局的相关文章

Vuex内容解析和vue cli项目中使用状态管理模式Vuex

中文文档:vuex官方中文网站一.vuex里面都有些什么内容? const store = new Vuex.Store({ state: { name: 'weish', age: 22 }, getters: { personInfo(state) { return `My name is ${state.name}, I am ${state.age}`; } } mutations: { SET_AGE(state, age) { commit(age, age); } }, acti

Vue CLI 3开发中屏蔽烦人的EsLint错误

问题 Vue开发中,特别是当你阅读分析别人的其中早期版本的Vue代码时往往会遭遇到满屏幕的烦人的EsLint错误.有关EsLint这个工具的作用不再赘述.查阅网上参考文档,大多是针对早起版本Vue CLI工具项目的,在我最新使用的Vue CLI 3生成的工程中根本不起作用.无奈之下,认真学习了Vue CLI 3官方文档,终于找到最佳答案. 办法 Vue这个前端框架相对于React和Angular,入门会非常快.但是,到了中后期实战阶段仍然有许多工程实际问题需要我们一块一块地攻克.Vue CLI这

Vue CLI 3搭建vue+vuex 最全分析

一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@vue/cli 全局安装的 npm 包,提供了终端里的vue命令(如:vue create .vue serve .vue ui 等命令) CLI 服务:@vue/cli-service是一个开发环境依赖.构建于 webpack 和 webpack-dev-server 之上(提供如:serve.build 和 inspect 命令) CLI 插件:给Vue 项目提供可选功能的 npm 包 (如

Vue CLI 3开发中试用UIkit 3组件库

一.UIkit组件库与vuikit简介在选择好意中的前端开发基本框架后,接下来一个重要任务就是选择一款好的UI组件库.其中,UIkit组件库是一款基于Less+JS的一款轻量级.模块化.响应式的前端UI组件库.特别是,从版本3.0.0 beta 31开始完全脱离了jQuery框架.UIkit组件库的一个重要特点是,其提供的组件大部分是非常基础性的,但是也有一部分组件相当实用,例如Slideshow组件.Upload组件.Video组件等,在github网站上的评价星数是13K,相当不错.另一个

使用vue cli开发项目中遇到的坑

一.部署文件使用vue cli 开发项目,执行npm run build命令生成dist静态文件,将dist文件包放到服务器中即可. 刚接触webpack,不知道怎么部署前端文件,原以为需要将app文件上传,在 inux上安装node,以及npm install 一系列的包,捣鼓了很久,发现只需要执行 npm run build 将源码打包成一个静态文文件即可,上传静态文件dist,将 controller指向index.html. 二.跨域问题实行前后端分离,使用vue i

vue cli 3 +jquery

const webpack = require('webpack')module.exports = { // baseUrl type:{string} default:'/' // 将部署应用程序的基本URL // 将部署应用程序的基本URL. // 默认情况下,Vue CLI假设您的应用程序将部署在域的根目录下. // https://www.my-app.com/.如果应用程序部署在子路径上,则需要使用此选项指定子路径.例如,如果您的应用程序部署在https://www.foobar.c

vue03----生命周期、nextTick()、ref、filter、computed、vue中异步请求渲染问题（swiper不轮播）（在开发过程中遇到什么问题、踩过的坑）

### 1.vue的组件和实例都有生命周期,而且是一样的生命周期:(组件从创建到销毁的过程) 创建挂载更新销毁组件到达某一个阶段就会自动触发某一些函数,这个函数就叫生命周期的钩子函数. 创建:组件创建的时候触发 beforeCreate created 组件刚创建的数据请求挂载:创建完成挂载前后触发 beforeMount mounted DOM的初始化操作更新:数据发生改变的时候触发 beforeUpdate updated 数据的变化监听,尽量不要在这里

vue cli中环境变量和模式

环境变量配置环境变量可以在以下文件中配置: .env # 在所有的环境中被载入 .env.local # 在所有的环境中被载入,但会被 git 忽略 .env.[mode] # 只在指定的模式中被载入 .env.[mode].local # 只在指定的模式中被载入,但会被 git 忽略 (.local优先于.env生效) 文件内部使用键值对的方式对变量进行配置被载入的变量将会对 vue-cli-service 的所有命令.插件和依赖可用,同时为一个特定模式准备的环境文件的 (例如 .env.

helloworld of vue + electron 开发过程日志

helloworld 开发过程日志 helloworld of vue + electron 1. 相关技术栈 2. 安装开发环境 2.1. 安装Node.js 2.2. 使用NPM(节点包管理器)镜像 2.3. 安装vue-cli 3. hello world 3.1. 创建项目 3.2. 运行VUE项目 3.3. 安装electron 3.4. 通过electron运行VUE项目 3.5. 使用electron-builder 打包发布 4. 完善配置 5. 总结 1. 相关技术栈 Chro