So führen Sie Bootstrap in ein Vue-Projekt ein

vueBootstrap in das Projekt eingeführt? Der folgende Artikel stellt es Ihnen vor. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird für alle hilfreich sein.

Empfohlene verwandte Tutorials: „Bootstrap-Tutorial“

Bei der Einführung von Bootstrap in das Vue-Projekt müssen Sie zunächst zwei Abhängigkeiten einführen: jQuery und Popper

Schritt eins, Installation

1, NPM-Installation

Installation Die Der Befehl lautet wie folgt:

cnpm install bootstrap --save-dev
cnpm install jquery --save-dev
cnpm install popper.js --save-dev

Die neueste Version ist standardmäßig installiert. Wenn Sie die V3-Version von Bootstrap installieren möchten (weniger Abhängigkeiten), können Sie:

cnpm install bootstrap@3 --save-dev

Oder verwenden Sie die Visual Window-Installation

2 Installation

1. Suchen Sie nach „Projekt“ und „Abhängigkeiten installieren“. Bootstrap installieren

Schritt 2. Einführung

Schreiben Sie auf der Seite main.js den folgenden Code

// 引入jQuery、bootstrap
import $ from 'jquery'
import 'bootstrap'

// 引入bootstrap样式
import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap/dist/js/bootstrap.min.js'

// 全局注册 $
Vue.prototype.$ = $

Der dritte Schritt besteht darin, jQuery zu konfigurieren

Schreiben Sie in vue.config.js den folgenden Code (falls kein vue vorhanden ist). .config.js, dann im Geschwisterpaket package.json. Erstellen Sie manuell ein neues Verzeichnis im Verzeichnis

! !

Das obige ist der detaillierte Inhalt vonSo führen Sie Bootstrap in ein Vue-Projekt ein. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!