Starting a new Ionic project using Sass

In this recipe, you will learn how to build and maintain your Ionic projects using Sass.

Getting ready

Read the Installing the Ionic Framework recipe of this chapter to find out how to set up a new Ionic project.

How to do it...

In the Installing the Ionic Framework recipe you have learn how to set up the CLI tool, now will learn how to use Sass in your Ionic projects:

1. Start a new Ionic by running the following command in your console:

   ionic start recipe2
   

2. Then, navigation to the recipe2 folder and run the following command in your console to set up Sass:

   ionic setup sass
   

3. Now, start your Ionic app by running the following command in your console:

   ionic serve
   

4. Open the scss/ionic.app.scss file in your text editor and edit the $positive variable as follows:

   $positive: #f00 !default; //red
   

5. After saving the scss/ionic.app.scss file, you will find that your browser automatically reloads. The hyperlinks and other elements are colored red now.

How it works...

Before...