Vue中引入Jquery

2017-08-27  本文已影响0人  简小咖

1、安装

npm install jquery --save

2、配置

在build中 webpack.base.conf.js中,开头添加以下代码

var webpack = require('webpack')

然后在module.exports中添加一段代码,

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: {}

main.js里导入jQuery

import 'jquery'

此时可以写console.log($('选择器'))测试以下

npm run dev    //运行

如果发现编译错误,解决方法:
根目录下.eslintrc.js文件了,在改文件的module.exports中

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

这下大功告成啦!

上一篇下一篇

猜你喜欢

热点阅读