Install the Ionic 4 CLI

Chris Griffith
InstructorChris Griffith
Share this video with your friends

Social Share Links

Send Tweet
Published 6 years ago
Updated 4 years ago

Learn how to install the Ionic 4 CLI and validate its installation.

Instructor: [00:00] To get started with Ionic, we first need to install node.js and NPM as these are required to use the Ionic CLI. If you don't already have node installed in your computer, you can download it from the node.js website.

[00:14] Once you have it installed, verify the version of node by executing node -v in your terminal or command line. We should also verify the version of NPM as well by executing NPM -v. Now let's install the Ionic CLI by running NPM install -g ionic.

[00:35] For Linux and Mac users, you may want to prepend sudo to that command for it to install properly. For Windows users, make sure you're installing them from an admin account. Once complete, you'll also want to install a Cordova CLI as well by running NPM install -g cordova. Odds are you'll be publishing your Ionic application as a Cordova-based native mobile application.

[01:02] With our installations complete, we can create our first Ionic project. From the command line, I will run ionic start myNewApp blank --type=angular. Let's break this down. The start command will tell the Ionic CLI to generate a new Ionic application. Next, we'll define the project name, myNewApp. The CLI will create a new directory with this name and install the project there.

[01:30] After the project name, we'll tell the CLI which template we want to use, in this case, the blank template. Ionic currently has two other templates available, tabs and sidemenu. Depending on your application's navigation design, you can jump start your development.

[01:47] The final element in our command is the --type=angular flag. The Ionic CLI supports creating Ionic applications for older versions as well as, soon, for other frameworks like Viewer React. Since we want to create an Ionic 4-based application, we'll set this flag to type of angular.

[02:09] With our project generated, we will change our working director to the newly generated one then run the command ionic serve. This will build our application, launch our browser, and load our application for us.

[02:24] Now that it's done, we can see the Ionic blank template running in our browser. If we want to make changes to our application, Ionic serve would automatically recompile and reload our application for us.

egghead
egghead
~ 3 minutes ago

Member comments are a way for members to communicate, interact, and ask questions about a lesson.

The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io

Be on-Topic

Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.

Avoid meta-discussion

  • This was great!
  • This was horrible!
  • I didn't like this because it didn't match my skill level.
  • +1 It will likely be deleted as spam.

Code Problems?

Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context

Details and Context

Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!

Markdown supported.
Become a member to join the discussionEnroll Today