1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

ionicを初めて使う時の環境構築

Last updated at Posted at 2020-08-12

##想定環境

  • npmがインストールされていること
$npm --version
6.14.7
  • nodeがインストールされていること
$node --version 
v14.8.0               

##環境構築

1.Ionic CLIをインストール

$npm install -g @ionic/cli

*以前にインストールしたことがあり、エラーになってしまう場合は下記コマンド

$npm uninstall -g ionic
$npm install -g @ionic/cli

2.プロジェクトを作成したいディレクトリに移動してサンプルプロジェクト作成
("myApp"という名前でサンプルプロジェクトが作成されます)

$ionic start myApp

3.プロジェクト作成にあたりいくつかの質問があるので答える

  • Angulerで作成するのか、Reactで作成するのかはここで選択します
Framework?
>Angular
>React
  • どのようなテンプレートにするのかはここで選択します
? Starter template
>blank
>tabs
>sidemenu

*テンプレートイメージは下記です(ionic公式)
スクリーンショット 2020-08-12 23.12.34.png

4.サンプルプロジェクトに移動

$cd myApp

5.サンプルプロジェクトを立ち上げる

$ionic serve

このような画面が立ち上がると成功です(tabsを選択したので下にtabsがあります)
スクリーンショット 2020-08-12 23.15.51.png

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?