Jq et vuejs peuvent-ils être mélangés ?

jq et vuejs peuvent être mélangés. Méthode : 1. Utilisez l'outil npm pour installer jquery ; 2. Configurez les fichiers "webpack.base.conf.js" et "module.exports" ; " Importer 'jquery'" introduisez simplement jq.

L'environnement d'exploitation de ce tutoriel : système Windows 7, vue version 2.9.6, ordinateur DELL G3.

Parfois, quand je pense à vue.js, je pense automatiquement à utiliser l'échafaudage vue-cli pour construire un projet. Cependant, parfois les scénarios commerciaux ne conviennent pas à l'utilisation de l'échafaudage vue-cli. Dans ce cas, utilisez vue+ Mélanger jquery et. la combinaison de leurs avantages améliorera considérablement l’efficacité du développement.

Comment utiliser jquery dans le projet vue

1 Installez jquery.

Entrez le répertoire racine du projet et exécutez : npm install jquery --savenpm install jquery --save

项目的package.json会自动添加依赖信息

2、webpack配置

找到项目的build目录中的webpack.base.conf.js文件，引入：var webpack = require('webpack')

然后在module.exports中添加一段代码，

resolve: {
....
},
//添加jquery
plugins: [
  new webpack.optimize.CommonsChunkPlugin('common.js'),
  new webpack.ProvidePlugin({
    jQuery: "jquery",
    $: "jquery"
  }),
],
module: {.....

3、找到项目的main.js，添加以下代码：import 'jquery'

这样使用npm run dev

Le package.json du projet ajoutera automatiquement des informations sur les dépendances

2 Configuration du Webpack

Trouvez le webpack dans le répertoire de construction du projet. .base.conf.js, introduisez : var webpack = require('webpack')

Puis ajoutez un morceau de code dans module.exports, 🎜

<el-row id="form">....
jqueryTest(){
 console.log($("form"))
}

🎜3 Trouvez le main.js de. le projet, Ajoutez le code suivant : import 'jquery'🎜🎜Utilisez npm run dev pour réexécuter le projet🎜🎜Test, le test personnel a réussi🎜rrreee🎜 Recommandations associées : "🎜Tutoriel vue.js🎜》🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!