Monaca Docs
検索…
Monaca とは
Monaca リリース情報
Monacaガイド
Monaca での開発の概要
Monaca クラウド IDE
Monaca Localkit
Monaca CLI
概要
Monaca CLI コマンド
プロジェクトの構成
ペアリングとデバッグ
リモートビルドと配布申請
トラブルシューティング ガイド
チュートリアル
テンプレート
Vue 2 & Onsen UI 2 入門
Monaca デバッガー
チームダッシュボード
他のプラットフォームからの移行
チュートリアル
APIの解説
サンプル & Tips
機能
FAQ
対応環境
トラブルシューティング
Monaca製品サイト
英語
GitBook
上で動作しています
Vue 2 & Onsen UI 2 入門
新しい
Vue with Onsen UI template
テンプレートは、Monaca CLI に統合され、モバイルの開発にアプローチするのに最適な方法です。
Onue UI テンプレートを使用して Vue を Monaca CLI にインポートする方法を解説します。
ステップ 1 : Vue CLI のインストール
コマンドプロンプト ( Windows の場合 ) またはターミナル ( Mac の場合 ) を開き、次のコマンドを実行します。
npm
install
-g vue-cli
ステップ2: テンプレートのインポート
1.
次のコマンドを使用して、新規のプロジェクトを作成します。
vue init OnsenUI/vue-cordova-webpack projectName
2. プロジェクトフォルダーに移動して、次のコマンドを実行します。
cd
projectName
npm
install
ステップ 3 : Monaca CLI での実行
Monaca CLI で下記のことが可能となります。
ローカル上でのプロジェクトの新規作成、Monaca クラウド上に保存されたプロジェクトのインポート ( クラウドからローカルへ ) またはクローン。
お好みのコードエディターを利用して Monaca アプリの開発。
アプリのデバッグを Monaca デバッガーやブラウザで行えます。
プロジェクトのリモートビルド ( ローカル上での各種セットアップは必要ありません ) 。
要件
Monaca CLI をインストールしていない場合は、下記のコマンドを実行してください。
npm
install
-g monaca
テンプレートの実行
このセクションでは、Vue テンプレートを使用して Monaca CLI を使用する方法を示します。 Monaca の機能を利用するには、以下の手順に沿って試してください。
1.
リリース用にテンプレートをビルドし、
www
フォルダーにファイルを生成します。
npm
run build
2. 開発モードで実行し、ホットモジュール機能を利用して変更箇所をメモリに読み込みます。
npm
run dev
3. 実機でのデバッグは、
Monaca デバッガー
をインストールして、次のコマンドを実行します。
monaca debug
4. 下記のコマンドでプロジェクトを簡単に iOS と Android のアプリとして作成できます。
monaca remote build --browser
詳細については、次の内容を参照してください。
Monaca CLI チュートリアル
Monaca CLI マニュアル
前
テンプレート
次
Monaca デバッガー
最終更新
1yr ago
リンクのコピー
概要
ステップ 1 : Vue CLI のインストール
ステップ2: テンプレートのインポート
ステップ 3 : Monaca CLI での実行
要件
テンプレートの実行