vue 2を迅速に構築する.0+boostrapプロジェクト

一、Vue CLI初期化Vueプロジェクト

グローバルインストールvue cli npm install--global vue-cli

webpackテンプレートに基づく新しいプロジェクトvue init webpack my-project

を作成する

プロジェクトディレクトリに入ってnpm run dev

を試運転する
二、BootStrapをVueプロジェクトに加入する

インストールJQuery(BoostrapはJQueryに依存するため)npm install jquery--save-dev

インストールBoostrapnpm install bootstrap--save-dev

はmainです.jsにjquery,bootstrapをそれぞれ追加する.css, bootstrap.js

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

任意のテンプレートに次のコードが追加されていることを確認します:

       
    

        

            

                

                    
       
                    ×Close
                
                

                    
         
                
                

                      
                      
                
            
        
    

npm run devを実行すると、ページが表示されます.
ボタンにはbootstrapのボタンスタイルが表示され、Bootstrapスタイルライブラリの追加に成功したことを証明するボタンが表示されます.ボタンはポップアップモードダイアログボックスに正しく応答し、JQueryライブラリとBootstrapのjsライブラリの追加に成功したことを証明します.