美文网首页
在vue中引用jquery包

在vue中引用jquery包

作者: 一名有马甲线的程序媛 | 来源:发表于2017-12-20 15:22 被阅读11次

    一、在npm下载jquery

    1.在cmd中cd到项目目录下
    2.npm install jquery


    image.png

    这样我们项目目录下,就多了node_modules目录,里面有jquery目录。以后我们用npm下载的其他也会到node_modules目录下。
    我们需要知道的是如果存在于node_modules里面的模块,只要不和内置模块名冲突,那么会”智能加载”,不需要写什么路径。
    在package.json中也可查到是否成功引入了jquery包


    image.png

    二、在vue中引用jquery

    在build下的webpack.base.conf.js文件中进行配置


    image.png
    // 在开头引入webpack,后面的plugins那里需要
    const webpack = require('webpack')
    
    // 在最底部增加一个plugins
     plugins: [
      new webpack.ProvidePlugin({
       $: "jquery",
       jQuery: "jquery"
      })
     ],
    
    image.png

    然后一定要重新npm run dev

    三、在页面中引用jquery

    在main.js文件中引入就ok了~

    import $ from 'jquery'
    

    相关文章

      网友评论

          本文标题:在vue中引用jquery包

          本文链接:https://www.haomeiwen.com/subject/bjpgwxtx.html