Vue 中使用 jQuery

编译报错：$ is undefined or no-undef '$' is not defined，or Jquery undefined

假设你已经使用vue-cli搭建好了开发的脚手架，接下来，看下面。。。

安装 jQuery，项目根目录下运行以下代码

npm install jquery --save

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: [
// ......
  ]
}

最后在main,js添加

import $ from "jquery"