Wie vue-cli das Bootstrap-Tool vorstellt

In diesem Artikel wird hauptsächlich vorgestellt, wie vue-cli das Bootstrap-Tool vorstellt. Jetzt werde ich das JS mit Ihnen teilen und es als Referenz geben. Wenn Sie sich für js interessieren, folgen Sie bitte dem Herausgeber, um einen Blick darauf zu werfen

Dieser Artikel stellt vor, wie vue-cli das Bootstrap-Tool vorstellt. Teilen Sie es mit allen und hinterlassen Sie eine Notiz für sich.

Die folgenden Vorgänge basieren auf der normalen Installation der Knotenumgebung.

1. Stellen Sie jq vor:

Geben Sie in der npm-Konsole das Projektverzeichnis ein und geben Sie dann den Befehl npm install jquery --save-dev ein (besser um npm durch cnpm zu ersetzen und cnpm zu verwenden, um in häuslichen Umgebungen schneller herunterzuladen).

2. Ändern Sie die Konfigurationsdatei webpack.base.conf.js im Build-Verzeichnis:

1) Fügen Sie das Webpack hinzu

object: var webpack=require('webpack');

2) Fügen Sie die folgende Konfiguration zu module.exports hinzu:

plugins: [ 

 　　　　new webpack.ProvidePlugin({ 

 　　　　　　$:"jquery", 

　　　　　　 jQuery:"jquery", 

　　　　　　 "windows.jQuery":"jquery" 

　　　　 }) 

　　]

3) Fügen Sie die

Eintragsdateimain.js hinzu: jquery aus „jquery“ importieren

3. Bootstrap einführen:

1) Ändern Sie die Datei webpack.base.conf.js:

alias: { 

　　　　 'vue$': 'vue/dist/vue.esm.js', 

　　　　 '@': resolve('src'), 

　　　　 'assets': path.resolve(dirname, '../src/assets'), 

　　　　 'jquery': "jquery/src/jquery" 

　　 }

2) Fügen Sie der Eintragsdatei main.js hinzu:

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

3) Kopieren Sie den Bootstrap in die Assets-Dateiverzeichnis Verschiedene Dateien:

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, dass er zum Lernen aller beiträgt, und ich hoffe auch, dass jeder ihn unterstützt Chinesische PHP-Website.

Verwandte Empfehlungen:

Detaillierte Erläuterung der Beispiele für JS-Funktionsdrosselung und Anti-Shake

Wie Modularität in Js implementiert wird

JS implementiert einfach die gleitende Freigabe von Ladedateninstanzen

Das obige ist der detaillierte Inhalt vonWie vue-cli das Bootstrap-Tool vorstellt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!