vue-cli中使用jquery_清玖_前端开发者

一.安装依赖

npm install jquery --save

npm install jquery --save

二.全局导入(必须先安装依赖)

第一步

webpack.base.conf.js里加入(新版的可能找不到这个文件,你可以npm install webpack --save-dev进行手动安装)

webpack.base.conf.jsnpm install webpack --save-dev

var webpack = require("webpack")

var webpack = require("webpack")

第二步

module.exports的最后加入

module.exports

plugins: [
 new webpack.optimize.CommonsChunkPlugin('common.js'),
 new webpack.ProvidePlugin({
 jquery: "jquery",
 $: "jquery"
 })
]

plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
jquery: "jquery",
$: "jquery"
})
]

第三步

main.js 引入

main.js

import $ from 'jquery'  //你做到这一步页面中你直接使用$就是jq了

import $ from 'jquery' //你做到这一步页面中你直接使用$就是jq了

新版

新版

直接在main.js 引入

main.js

import jquery from 'jquery'  //你做到这一步页面中你直接使用$就是jq了

import jquery from 'jquery' //你做到这一步页面中你直接使用$就是jq了

三.单个vue组件导入(必须先安装依赖)

然后在组件的script中

<script>
  import $ from "jquery"   //其实嘛你安装依赖后你在node_modlules文件中的一个文件相对路径而已
  console.log($) //你可以打印瞧瞧
</script>

<script>
import $ from "jquery" //其实嘛你安装依赖后你在node_modlules文件中的一个文件相对路径而已
console.log($) //你可以打印瞧瞧
</script>

» 本文来自:前端开发者 » 《vue-cli中使用jquery_清玖_前端开发者》
» 本文链接地址:https://www.rokub.com/73650.html
» 您也可以订阅本站:https://www.rokub.com
赞(0)
64K

评论 抢沙发

评论前必须登录!