windowsでionic4を始める方法
差分
このページの2つのバージョン間の差分を表示します。
両方とも前のリビジョン前のリビジョン次のリビジョン | 前のリビジョン次のリビジョン両方とも次のリビジョン | ||
windowsでionic4を始める方法 [2018/12/22] – [4.新規Ionic4アプリ(Angularベース)の作成] adash333 | windowsでionic4を始める方法 [2018/12/22] – [開発環境] adash333 | ||
---|---|---|---|
行 1: | 行 1: | ||
====== WindowsでIonic4を始める方法 ====== | ====== WindowsでIonic4を始める方法 ====== | ||
+ | スマホアプリ(& | ||
+ | PWA(Progressive Web Apps)という考え方があり、Ionicで作成してPWA対応させたWEBページであれば、WEBページを閲覧するだけで、そのままスマホアプリとしてユーザーにスマホに保存してもらうことが可能だそうです。 | ||
===== 開発環境 ===== | ===== 開発環境 ===== | ||
行 15: | 行 17: | ||
Ionic CLI 4.6.0 | Ionic CLI 4.6.0 | ||
</ | </ | ||
+ | なお、作成したアプリのpackage.jsonの一部を記載させていただきます。 | ||
+ | < | ||
+ | " | ||
+ | " | ||
+ | " | ||
+ | </ | ||
==== 1.Node.jsのインストール ==== | ==== 1.Node.jsのインストール ==== | ||
https:// | https:// | ||
行 60: | 行 67: | ||
数分かかる。 | 数分かかる。 | ||
{{: | {{: | ||
- | ? Install the free Ionic Appflow SDK and connect your app? (Y/ | + | ? Install the free Ionic Appflow SDK and connect your app? (Y/ |
- | 何かいろいろ聞かれるので、下記のように設定。 | + | {{: |
- | {{: | + | {{: |
- | ブラウザが開くので、とりあえず、緑のボタンをクリック。(GitHubアカウント作成済みの場合) | + | 言われた通りに、下記コードを入力。 |
- | {{: | + | < |
- | GitHubのパスワードを入力。 | + | cd myApp |
- | {{: | + | ionic serve |
- | {{: | + | </ |
- | 言われた通り、VisualStudioCodeに戻る。 | + | ブラウザが自動的に開いて、以下のようになる。 |
+ | {{: | ||
+ | |||
+ | ちなみに、この時点で275MBの容量があります。 | ||
+ | ==== 5.home.page.htmlの編集 ==== | ||
+ | src/ | ||
+ | |||
+ | (変更前) | ||
+ | {{: | ||
+ | |||
+ | (変更後) | ||
+ | {{: | ||
+ | |||
+ | これで、Ionic4アプリ(Angularベース)を作成することができました。 | ||
+ | |||
+ | 基本的に、ターミナル(コマンドプロンプト)での操作は、すべて、Angularのものとなるので、Angular CLIのページを参考にしてよいと思います。 | ||
windowsでionic4を始める方法.txt · 最終更新: 2019/02/10 by adash333