Comment introduire jquery dans le webpack vue-cli (tutoriel détaillé)

J'utilise le modèle webpack pour introduire jquery dans le projet généré par vue-cli. Tout d'abord, ajoutez "jquery": "^2.2.3" aux dépendances dans package.json, puis installez-vous. content pour plus de détails. Article suivant

Après avoir passé un après-midi entier aujourd'hui, j'ai finalement introduit jquery dans le projet généré par vue-cli et je l'ai enregistré. (webpack pour les modèles)

Ajoutez d'abord "jquery" : "^2.2.3" aux dépendances dans package.json, puis installez

et ajoutez-le à webpack.base.conf.js

var webpack = require("webpack")

Ajoutez

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

à la fin de module.exports, puis assurez-vous de réexécuter dev

Introduisez-le dans main.js et ce sera okimport $ from 'jquery'

Voyons comment introduire jquery dans vue

1.

2. build/webpack.base.conf.js

npminstall jquery --save

3. Introduisez jquery

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

dans main.js 4. eslint

import $ from 'jquery'

Le l'étape suivante consiste à modifier .eslintrc dans le fichier .js du répertoire racine. Dans le module.exports du fichier modifié, ajoutez simplement une paire clé-valeur jquery : true pour env

Ce qui précède est ce que j'ai compilé. pour tout le monde. J’espère que cela sera utile à tout le monde à l’avenir.

Articles connexes :

Résoudre le problème du déploiement à chaud ne détectant pas les modifications de fichiers dans Webpack

Dans webpack-dev-server Atteindre automatiquement mise à jour de la page

Obtenez une loupe grâce à la technologie jquery

Comment utiliser la technologie de reconnaissance d'image Puppeteer pour implémenter le robot d'exploration d'index Baidu

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!