npm を使用して Vue プロジェクトにブートストラップと jquery をインストールすることについての簡単な説明

この記事では、npm を使用して Vue プロジェクトにブートストラップと jquery をインストールする方法を紹介します。一定の参考値があるので、困っている友達が参考になれば幸いです。

[関連する推奨事項: 「vue.js チュートリアル 」]

npm を使用してブートストラップと jquery をインストールする

多くの問い合わせと実験を経て、vue プロジェクトでのブートストラップ フレームワークの使用方法をまとめました。npm のインストールに注意してください。

ブートストラップの js プラグインは jquery に依存しているため、jquery ではこの前にインストールする必要があります。

jquery のインストール

1. package.json に次のコード行を追加します: "jquery": "^2.2.3"

"dependencies": {
   "element-ui": "^2.0.5",
   "vue": "^2.5.2",
   "vue-router": "^3.0.1",
   "jquery": "^2.2.3"
 }

2ビルド ファイル webpack.base.conf.js にデータ行を追加します:

//注：...代表省略自有的，
//必定事先声明webpack，不然下面会不识别webpack
const webpack = require('webpack')
...
module.exports = {
    resolve: {
        ...
        alias: {
          ...
          'jquery': 'jquery' 
        }
    },
    plugins: [
        new webpack.ProvidePlugin({
          $: "jquery",
          jQuery: "jquery",
          "windows.jQuery": "jquery"
        })
    ],
    ...
}

3. main.js に追加します: import $ from 'jquery'

4. npm install を使用します。 jquery@ 2.2.3 –save-dev

このようにして jquery がインストールされます。

ブートストラップ インストール:

1. npm install bootstrap@3.3.0 –save-dev

を使用します。 2.

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

を必要なページに導入し、最後に npm run dev を実行してプロジェクトを開始すれば問題ありません。

プログラミング関連の知識について詳しくは、プログラミング ビデオをご覧ください。 ！

以上がnpm を使用して Vue プロジェクトにブートストラップと jquery をインストールすることについての簡単な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。