So führen Sie Bootstrap in vue.js ein

So führen Sie Bootstrap in vue.js ein: Verwenden Sie zuerst den Befehl [npm install bootstrap --save-dev], um es zu installieren. Verwenden Sie dann die Syntax [import 'bootstrap related file path'] in [main.js], um es einzuführen Es.

Die Betriebsumgebung dieses Tutorials: Windows7-System, Vue2.9.6 und Bootstrap3-Version, Dell G3-Computer.

【Empfohlene verwandte Artikel: vue.js】

vue.js So führen Sie Bootstrap ein:

1. Verwenden Sie den Befehl:

npm install bootstrap --save-dev

2. Nach erfolgreicher Installation können Sie es im Paket installieren. json-Ordner Siehe das Bootstrap-Modul. Zu diesem Zeitpunkt müssen Sie den folgenden Inhalt zu main.js hinzufügen:

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

Jetzt ist die Einführung von Bootstrap vorbei. Als nächstes kommt unser Fokus, denn BootStrap und VUE haben ein spezielles Design namens Bootstrap-vue.js, also nach uns Einführung Sie können die von ihnen bereitgestellten proprietären Stile direkt verwenden, was viel besser ist als der native Bootstrap

3. Verwenden Sie den Befehl:

npm i vue bootstrap-vue bootstrap

4. Fügen Sie in der main.js-Datei hinzu:

import Vue from 'vue'
import BootstrapVue from 'bootstrap-vue'
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'
Vue.use(BootstrapVue)

Verwandte kostenlose Lernempfehlungen: Javascript (Video)

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