• 技术文章 >web前端 >Vue.js

    vue项目中能引jquery吗

    藏色散人藏色散人2021-11-18 10:36:09原创122

    vue项目中能引jquery,其引入方法是:1、修改package.json;2、在终端里输入npm install,导入依赖;3、修改webpack.base.conf;4、在组件中引入jquery即可。

    本文操作环境:windows7系统、jquery2.2.3版、DELL G3电脑

    vue项目中能引jquery吗?

    在vue项目中引入JQuery

    用vue-cli脚手架工具构建项目成功后 当需要引入JQ,可用以下方法:

    修改package.json

      首先在package.json里的dependencies加入"jquery" : "^2.2.3"

      当然你可以修改你想引入的版本,这里引入2.2.3

    导入依赖

      在终端里输入npm install,导入依赖。

    修改 webpack.base.conf 

      代码如下 ,看图修改;

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

    在组件中引入jquery,进行使用

      我们想在哪个组件中使用jQuery库,首先要使用如下命令引入jquery,然后就可以正常使用了

      这里我们在main.js里面进行全局引入

    import $ from 'jquery'

    测试使用:

      先重新启动应用:npm run dev 刷新页面

    推荐学习:《jquery视频教程》《vue教程

    以上就是vue项目中能引jquery吗的详细内容,更多请关注php中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    专题推荐:vue jquery
    上一篇:深入浅析Vue中的模板语法:插值和指令 下一篇:看看Vue中如何封装一个自动化注册全局组件
    php中文网线上培训班

    相关文章推荐

    • 浅析Vue中hash路由和history路由的区别• 什么是vitepress?怎么将vuepress升为vitepress?• 总结分享一些关于vue的前端基础面试题• 深入浅析Vue中的模板语法:插值和指令

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网