vue2引入jquery

发表于 分类于 ， 阅读次数： 本文字数： 735 阅读时长 ≈ 1 分钟
vue2引入并使用jquery

vue2引入jquery

  • 安装jquery

    1
    2
    //安装jquery
    npm install jquery --save-dev

  • package.json版本查看

    1
    "jquery": "^3.5.1",

  • webpack.base.conf.js

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    //第一行添加
    var webpack = require('webpack')

    module.exports = {
      ...
      resolve: {
        extensions: ['.js', '.vue', '.json'],
        alias: {
          'vue$': 'vue/dist/vue.esm.js',
          '@': resolve('src'),
          'jquery': 'jquery' ,
        }
      },
      plugins: [
        new webpack.optimize.CommonsChunkPlugin('common.js'),
        new webpack.ProvidePlugin({
          $: "jquery",
          jQuery: "jquery",
          "windows.jQuery": "jquery"
        })
      ]
    }

  • main.js

    1
    2
    //引入
    import $ from 'jquery';

  • 组件中可以使用jquery库的语法