使用npm install jquery --save
打开webpack.base.conf.js
在文件头部添加: var webpack = require(‘webpack‘) 引入webpack:
‘use strict‘ const path = require(‘path‘) const utils = require(‘./utils‘) const config = require(‘../config‘) const vueLoaderConfig = require(‘./vue-loader.conf‘) var webpack = require(‘webpack‘)
在module.exports中增加jquery路径的解析:
‘jquery‘: path.resolve(__dirname,‘../node_modules/jquery/src/jquery‘)
1 module.exports = { 2 context: path.resolve(__dirname, ‘../‘), 3 4 .....省略代码..... 5 6 resolve: { 7 extensions: [‘.js‘, ‘.vue‘, ‘.json‘], 8 alias: { 9 ‘vue$‘: ‘vue/dist/vue.esm.js‘, 10 ‘@‘: resolve(‘src‘), 11 ‘jquery‘: path.resolve(__dirname,‘../node_modules/jquery/src/jquery‘) 12 13 } 14 },
完成这两步后在组件中就可以使用jquery了
1 <template> 2 <div style="background-color:red"> 3 <p id="msg">hello world</p> 4 <button @click="showClick"> 5 点击 6 </button> 7 </div> 8 </template> 9 <script> 10 import $ from ‘jquery‘ 11 export default { 12 methods: { 13 showClick () { 14 alert($(‘#msg‘).text()) 15 } 16 } 17 } 18 </script>
原文：https://www.cnblogs.com/judyh/p/9979514.html