Une brève discussion sur l'utilisation de npm pour installer bootstrap et jquery dans les projets Vue

Cet article vous expliquera comment utiliser npm pour installer bootstrap et jquery dans un projet Vue. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il sera utile à tout le monde.

[Recommandation associée : "tutoriel vue.js"]

Utilisez npm pour installer bootstrap dans le projet Vue et jquery

Après de nombreuses enquêtes et expériences, j'ai résumé l'utilisation du framework bootstrap dans les projets vue. Faites attention à l'installation de npm.

Le plug-in js dans bootstrap dépend de jquery. , donc dans jquery doit être installé avant cela.

Installation de jquery

1. Ajoutez une ligne de code dans package.json : "jquery": "^2.2.3"

"dependencies": {
   "element-ui": "^2.0.5",
   "vue": "^2.5.2",
   "vue-router": "^3.0.1",
   "jquery": "^2.2.3"
 }

2. . Ajoutez une ligne de données au fichier de build webpack.base.conf.js :

//注：...代表省略自有的，
//必定事先声明webpack，不然下面会不识别webpack
const webpack = require('webpack')
...
module.exports = {
    resolve: {
        ...
        alias: {
          ...
          'jquery': 'jquery' 
        }
    },
    plugins: [
        new webpack.ProvidePlugin({
          $: "jquery",
          jQuery: "jquery",
          "windows.jQuery": "jquery"
        })
    ],
    ...
}

3 Ajoutez à main.js : importez $ from 'jquery'

4. jquery@ 2.2.3 –save-dev

De cette façon, jquery est installé.

Installation de bootstrap :

1. Utilisez npm install bootstrap@3.3.0 –save-dev

2. Présentez

import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap/dist/js/bootstrap.min.js'

à la page requise et enfin npm exécutez dev pour démarrer le projet, et tout ira bien.

Pour plus de connaissances sur la programmation, veuillez visiter : Vidéo de programmation ! !

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!