vue :关于引用jquery的二三问题

webpack版本:3.6.0

首先是引用jquery。

有两个地方要改。

1 (项目地址)/build/webpack.base.conf.js

2 (项目地址)/src/main.js

webpack.base.conf.js:

(1) 在'use strict'下面引入webpack变量。

const webpack = require('webpack')

(2) module.exports 对象:

(有就修改,没有就添加。)

resolve 对象:

resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': resolve('src'),
      'jquery': 'jquery'
    }
  },

plugins 对象:

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

main.js:

import $ from 'jquery'

和其他 import 放到一起就行。

我们可以验证一下是否引入成功了。

随便找个vue文件:

mounted () {    
    $('body').css({
      'background-color':'#efefef'
    })
  },

可以发现页面的背景颜色确实是改掉了。

猜你喜欢

转载自www.cnblogs.com/foxcharon/p/8930954.html