vue中引入jquery报错问题

vue-cli搭建的vue项目中使用到jquery插件，需要引入jquery，

在无任何配置的情况下，直接在组件中import引入，在mounted时候打印$ 会显示undefined报错问题，

感觉直接引入不应该报这种错误，之前这么使用都是没问题的，网上查阅说有可能是如果项目使用了 eslint语法检验，此时会提示找不到 $或者jquery的错误。

错误如下：

http://eslint.org/docs/rules/no-undef '$' is not defined

http://eslint.org/docs/rules/no-undef 'jQuery' is not defined

我的报错显然跟eslint无关，但还是进行了相关配置，配置如下：

在eslintrc.js文件的module.exports中，为env添加一个键值对 jquery: true 就可以了，也就是：

env: {
// 原有
browser: true,
// 添加
jquery: true
}

由于不是eslint的问题，我这边配置完之后当然还是报错$ undefined，

然后就考虑是jquery引入方式的问题，换了一种方式引入，

1. 在package.json中安装 jquery文件到dependencies中

2.在build文件夹下找到webpack.base.conf.js文件进行设置，使用webpack引入jquery，

　　（1）在头部引入webpack var webpack = require(‘webpack’)

　　（2）在module对jquery进行全局配置，在module.exports中加入以下代码

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

　　（3）在main.js中引入 jquery，

import $ from 'jquery'

　　（4）配置完毕，重新运行项目，OK

转载于:https://www.cnblogs.com/fairy62/p/9389659.html

vue中引入jquery报错问题相关推荐

vite：vue中引入图片报错require is not defined
问题在 vite 项目中这样引入图片报错 images: require('../assets/images/right.png') 改为 images: new URL('../assets/im ...
Vue scss 引入变量报错
官网css引入配置参考文章我在项目里自定义了vue.config.js的rules关于scss的loader所以我是直接子啊loader配置options就可以 { test: /\.scss$/ ...
vue学习笔记十：Vue中引入jquery
文章目录前言一.引入方式 1.使用Vue CLI 创建的项目 2.直接引入vue方式的项目二.使用方法 1.使用Vue CLI 创建的项目 2.直接引入vue方式的项目总结前言本篇实现vu ...
(vue中使用v-for报错)You are binding v-model directly to a v-for iteration alias.
(vue中使用v-for报错)You are binding v-model directly to a v-for iteration alias. 分析: 这个错误是由于在使用v-for循环做一些 ...
关于如何在vue中引入jquery？
相信大家有时候都会遇到在vue的项目中引入jquery,但是不会失效,今天就带领大家手把手在vue项目中引入jquery,亲测有效! 1.安装jquery npm install jquery --s ...
中引入文件报错_关于前端开发中的模块化
前端开发离不开模块化,与模块化有关的关键字有以下几个: require/module.exports export/import define/require/exprots define/seajs ...
vue中引入jquery
1.在项目中安装jquery. npm install jquery --save-dev 2.在项目根目录下的build/webpack.base.conf.js文件中: ① 先写以下代码 var ...
vue中集成jsplumb报错`Cannot read property ‘parentNode‘ of null`，且无法渲染连线的问题
简介我在项目中使用了typescript+vue+jsplumb作为流程图框架. 问题我在容器中使用的是v-for指令渲染. 从配置文件中读取流程图的json并且存入this.items变量中通 ...
vue 中引入 jquery
1)打开 package.json 文件,在里面加入这行代码,jquery 后面的是版本.如下: dependencies:{"jquery":"^2.2.3" ...

vue中引入jquery报错问题

vue中引入jquery报错问题相关推荐

最新文章

热门文章