在vue單頁應用中使用jquery

記錄一個今天用到的vue-cli創建的應用中引入jquery的方式。

1. 首選經過npm安裝jquery

npm install jquery --save

1. 在build/webpack.base.conf文件當中引入jquery

module.exports = {
  ...
  resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': resolve('src'),
      'jquery': path.resolve(__dirname, '../node_modules/jquery/src/jquery')
    }
  },
  ...
}

3.在須要的地方

import $ from 'jquery'
export default {
  name: 'hello',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  },
  mounted:function(){
    let test = $('#test').text()
    console.log(test)
  },
  methods:{

  }
}

最後推薦下輪子工廠--一個分享vue,angular優秀組件的網站