vue-cli構築プロジェクト導入jqueryとjquery-weui手順の詳細
2724 ワード
vueの概要
Vue.jsは、ユーザーインタフェースを構築するための漸進的なフレームワークです.他の大型フレームワークとは異なり,Vueは底から上へ層毎に適用できるように設計されている.Vueのコアライブラリは、ビューレイヤのみに注目し、使いやすいだけでなく、サードパーティのライブラリや既存のプロジェクトとの統合も容易です.一方、Vueは、近代的なツールチェーンやさまざまなサポートクラスライブラリと組み合わせて使用される場合、複雑な単一ページアプリケーションを駆動することができます.
vue jquery導入
1.packageでjsonに依存を加える:
2.次に、統合端末でコマンド:npm install 3を実行する.Webpack静的モジュールパッケージをbuildディレクトリの下に追加します.base.conf.jsに追加:
4.buildディレクトリの下にあるwebpack.base.conf.jsのmodule.exportsの最終加入:
5.上記の手順が完了すると、統合端末でコマンド:npm run devを実行し、jqueryが6に導入される.使用方法、srcディレクトリの下のmain.js導入:import$from'jquery'は、グローバルを構成します.単一のvueで導入する場合は、vueページのscriptにimport$from'jquery'を追加できます.
7.jqueryを導入すると、vueで直接jqueryを使用できます
vue jquery-weuiの導入
1.まず同じpackage.jsonファイルに依存を追加します.
2.統合端末でコマンドを実行します:npm install–save jquery-weui
3.上記の手順が完了すると、vueページのscriptで直接呼び出すことができます.
4.jquery-weuiのメソッドとコンポーネントを直接呼び出すことができます.たとえば、次のようになります.
まとめ
はい、以上はvueがjqueryとjquery-weuiを導入する手順の詳細です.実践は真理性を検証する唯一の基準であり、多くの手で操作すればすぐにvueに上手になります.また、vueが多様な効果を実現する学習サイトをお勧めします.http://618cj.com/category/vueチュートリアル/
Vue.jsは、ユーザーインタフェースを構築するための漸進的なフレームワークです.他の大型フレームワークとは異なり,Vueは底から上へ層毎に適用できるように設計されている.Vueのコアライブラリは、ビューレイヤのみに注目し、使いやすいだけでなく、サードパーティのライブラリや既存のプロジェクトとの統合も容易です.一方、Vueは、近代的なツールチェーンやさまざまなサポートクラスライブラリと組み合わせて使用される場合、複雑な単一ページアプリケーションを駆動することができます.
vue jquery導入
1.packageでjsonに依存を加える:
dependencies:{
"jquery" : "^3.2.1"
}
2.次に、統合端末でコマンド:npm install 3を実行する.Webpack静的モジュールパッケージをbuildディレクトリの下に追加します.base.conf.jsに追加:
var webpack = require("webpack")
4.buildディレクトリの下にあるwebpack.base.conf.jsのmodule.exportsの最終加入:
plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
jQuery: "jquery",
$: "jquery"
})
]
5.上記の手順が完了すると、統合端末でコマンド:npm run devを実行し、jqueryが6に導入される.使用方法、srcディレクトリの下のmain.js導入:import$from'jquery'は、グローバルを構成します.単一のvueで導入する場合は、vueページのscriptにimport$from'jquery'を追加できます.
7.jqueryを導入すると、vueで直接jqueryを使用できます
vue jquery-weuiの導入
1.まず同じpackage.jsonファイルに依存を追加します.
dependencies:{
"jquery-weui" : "^1.2.0"
}
2.統合端末でコマンドを実行します:npm install–save jquery-weui
3.上記の手順が完了すると、vueページのscriptで直接呼び出すことができます.
import weui from 'jquery-weui/dist/js/jquery-weui.min'
import picker from 'jquery-weui/dist/js/city-picker.min'
4.jquery-weuiのメソッドとコンポーネントを直接呼び出すことができます.たとえば、次のようになります.
:$.alert(" ");
toptip:$.toptip(' ', 'success');
:$("#datetime-picker").datetimePicker();
まとめ
はい、以上はvueがjqueryとjquery-weuiを導入する手順の詳細です.実践は真理性を検証する唯一の基準であり、多くの手で操作すればすぐにvueに上手になります.また、vueが多様な効果を実現する学習サイトをお勧めします.http://618cj.com/category/vueチュートリアル/