方法A:導入(1)main.jsで
npm i jquery
npm i bootstrap
main.jsで
import 'jquery/dist/jquery.min'
import 'bootstrap/dist/css/bootstrap.css'
これが有効になり、他の人は負担の少ないオンラインを行います
抜粋:https://blog.csdn.net/it_all/article/details/87189304
方法2:main.js(2)を導入します
導入main.jsでは、ブートストラップを導入するこの方法は、身体の一部の設定CSSスタイルのHTMLに対して有効ではないかもしれません。
1、jQueryのの導入
(、package.jsonである)現在のプロジェクトディレクトリの下に、コマンドを実行し、実行エラー場合jqueryの--save-devのインストールcnpm、実行はjqueryのをインストールcnpm(cnpmとNPMがある)ので、このプロジェクトにインストールのjQueryます。
そして、2つの場所で(ビルドファイル内)webpack.base.conf.jsを変更します。
1:加入
var webpack=require('webpack');
2在module.exports的里面加入
plugins:[
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
jQuery: "jquery",
$: "jquery"
})
]
導入のjqueryの完了で追加最後の輸入$フォーム「jqueryの」main.js
2、導入bootstrap.cssファイル:
修正webpack.base.conf.js
resolve:{
extensions: ['.js', '.vue', '.json'],
alias: {
'vue$': 'vue/dist/vue.esm.js',
'@': resolve('src'),
'bootstrap':resolve('src/assets/bootstrap'),
}
},
main.jsに導入されたインポート
import'bootstrap / JS / bootstrap.min.js'
import'bootstrap / CSS / bootstrap.min.css'
方法3:index.htmlを導入
この方法は、一般的に、ブートストラップを導入することをお勧めします。
ブートストラップindex.htmlファイルに導入すると、ノートは、このラベルは電話モード、応答不可能に表示される場合があります場合は、追加されていない応答を達成するための<meta>タグを追加しました。
<メタ名= "ビューポート"
コンテンツ= "幅=デバイス幅、ユーザスケーラブル=なし、初期スケール= 1.0、最大規模= 1.0、最小スケール= 1.0">
<メタHTTP-当量= "X- UA-互換性のある」コンテンツ= "IE =エッジ">
(1)ローカル参照:
ロード・ブートストラップファイルに静的なディレクトリ地方分権化ニーズの初
その後、index.htmlの中に導入され、
ディレクトリ・パスは、あなたが置かれているパスです。
(2)リモート導入:
リモートブートストラップファイルの直接ロード
オリジナルリンクします。https://blog.csdn.net/qq_37055675/article/details/73730736