致谢 看了这篇成功的
https://blog.csdn.net/ai520587/article/details/84098601
记录一下怎么引用的 万一以后要用呢
注意这里配置的是vue-cli3.0引入jquery的方法,不是vue-cli2.0的配置方法
一、安装jquery
npm install jquery --save
在package.json查看jquery的安装
二、在vue根目录下创建vue.config.js文件 进行vue.config.js配置
这个是以前用于其他的 只是我全贴上了
关于jq的 看一下就知道是哪儿些了 引用链接博主没贴代码 放了截图也一样的 我的可以直接复制
runtimeCompiler: true,
devServer: {
hot: true,
open: true,
port: 8080,
host: "127.0.0.1"
}
const webpack = require('webpack')
module.exports = {
configureWebpack: {
plugins: [
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery",
"windows.jQuery": "jquery"
})
]
},
runtimeCompiler: true,
devServer: {
hot: true,
open: true,
port: 8080,
host: "127.0.0.1"
}
}
三、main.js
import $ from ‘jquery’
四、没有实际运行给你看咋行呢
全部代码
<template>
<div>
<div style="height:100px"></div>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
</template>
<script>
export default {
mounted(){
$("ul li").on("click",function(){
$(this).addClass("active");
$('li').not($(this)).removeClass('active');
});
}
}
</script>
<style scoped>
li{
background-color: green;
width: 20px;
text-align: center;
}
.active{
color: red!important;
}
</style>