ホームページ > ウェブフロントエンド > Vue.js > vue.jsにブートストラップを導入する方法

vue.jsにブートストラップを導入する方法

coldplay.xixi
リリース: 2023-01-13 00:44:45
オリジナル
4210 人が閲覧しました

ブートストラップを vue.js に導入する方法: まず [npm install bootstrap --save-dev] コマンドを使用してインストールし、次に [main.js で [import 'bootstrap 関連ファイル パス'] 構文を使用します。 js】を導入するだけです。

vue.jsにブートストラップを導入する方法

このチュートリアルの動作環境: Windows7 システム、Vue2.9.6&&bootstrap3 バージョン、Dell G3 コンピューター。

【おすすめ関連記事: vue.js

vue.js にブートストラップを導入する方法:

1. コマンドを使用します:

npm install bootstrap --save-dev
ログイン後にコピー

2. インストールが成功すると、package.json フォルダーにブートストラップ モジュールが表示されます。この時点で、次の内容を main.js に追加する必要があります:

import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap/dist/js/bootstrap.min'
ログイン後にコピー

この時点で、ブートストラップの導入は完了しました。次に焦点が当てられます。これは、ブートストラップと VUE にはブートストラップと呼ばれる特別な設計があるためです。 -vue.js なので、これを導入すると、提供される独自のスタイルを直接使用できるようになり、ネイティブ ブートストラップよりもはるかに優れています。 main.js ファイルに追加します:

npm i vue bootstrap-vue bootstrap
ログイン後にコピー

関連する無料学習の推奨事項:

javascript

(ビデオ)

以上がvue.jsにブートストラップを導入する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート