Vue 中使用 jQuery

小鱼儿 2022-04-06 06:10 324阅读 0赞

首先你已经使用**vue-cli**搭建好了开发的脚手架

## 1.安装jQuery ##

npm install jquery --save

## 2.webpack配置 ##

## 在项目根目录下的build目录下找到webpack.base.conf.js文件，在开头使用以下代码引入webpack，因为该文件默认没有引用
    var webpack = require('webpack')

module.exports中添加

// 原有代码
    resolve: {
      extensions: ['.js', '.vue', '.json'],
      alias: {
        'vue$': 'vue/dist/vue.esm.js',
        '@': resolve('src')
      }
    },
    // 添加代码
    plugins: [
      new webpack.ProvidePlugin({
        $: "jquery",
        jQuery: "jquery",
        jquery: "jquery",
        "window.jQuery": "jquery"
      })
    ],
    // 原有代码
    module: {
      rules: [
        // ......
      ]
    }

## 3.在main.js里导入jQuery ##

import 'jquery'

--------------------

###    启动项目后如果报错： ###

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

该问题和eslint 检查有关，  
修改根目录下.eslintrc.js文件了，在改文件的module.exports中，为env添加一个键值对 `jquery: true` 就可以了

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

--------------------

Github地址：[https://github.com/Lil-El/Movie][https_github.com_Lil-El_Movie]

[https_github.com_Lil-El_Movie]: https://github.com/Lil-El/Movie

发表评论取消回复

表情：

评论列表（有 0 条评论，324人围观）

还没有评论，来说两句吧...

相关阅读

相关在vue中使用JQuery

在vue中使用JQuery 在vue中可能会使用到JQuery，那么就要安装他并引入调用，但是在Vue2.0和Vue3.0中的使用的方式有所不同。最开始都要先下载jq

布满荆棘的人生/ 2023年07月13日 13:50/ 0 赞/ 60 阅读

相关 vue-cli3 中引入 Jquery vue中配置Jquery

1. 安装jquery npm install jquery --save 或在`package.json`中指定版本号，然后运行`npm install`

蔚落/ 2023年05月30日 06:05/ 0 赞/ 33 阅读

相关 Vue 中使用 JQuery 插件不起作用

有时候在 vue 的代码中使用 jQuery 会不起作用，这是因为 vue 还没有绑定变量，所以我们使用的 jQuery 根本就找不到目标变量，就不会执行，正确的做法是先设置一

ゞ浴缸里的玫瑰/ 2022年12月15日 08:34/ 0 赞/ 297 阅读

相关 Vue中使用JQuery加载js

mounted: function() { let _this = this; // 加载技术文件 $.get

水深无声/ 2022年12月13日 01:47/ 0 赞/ 202 阅读

相关 VUE-cli中使用jquery

步骤：全局安装： npm install jquery --save 组件内使用方法：直接引用即可 import $ from 'jquer

痛定思痛。/ 2022年10月15日 09:52/ 0 赞/ 229 阅读

相关 Vue 中使用 jQuery

首先你已经使用vue-cli搭建好了开发的脚手架 1.安装jQuery npm install jquery --save 2.webpack配置

小鱼儿/ 2022年04月06日 06:10/ 0 赞/ 325 阅读

相关 vue中引入jquery

1、在项目中安装jquery。 npm install jquery --save-dev ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5

不念不忘少年蓝@/ 2022年01月23日 00:21/ 0 赞/ 507 阅读

相关 vue 项目中使用 jquery

在 vue 项目中使用 jquery，具体步骤如下 1、npm 安装 jquery 命令如下，@ 后边指定安装的 jquery 版本 npm install

╰+攻爆jí腚メ/ 2022年01月22日 04:55/ 0 赞/ 728 阅读

相关 vue怎么使用jQuery

vue到底怎么使用jQuery呢有时候想在vue里面使用jQuery的功能或者要用jQuery写的现有功能，就很烦， vue到底怎么使用jquery呢，首先vue要

短命女/ 2021年09月24日 04:16/ 0 赞/ 446 阅读

相关如何在vue-cli 3.x中使用jquery

由于项目需求要使用jquery，结果各种引用都不济于事。最后在网上找到了答案，现把它记录一下，给有需要者。首先下载 jquery。 cnpm install

Love The Way You Lie/ 2021年09月17日 01:08/ 0 赞/ 271 阅读