Simple contact with Ionic: Building Ionic Android development environment under Windows

[size=large] (1) A brief introduction to Ionic:

        First of all, what is Ionic.
        Ionic is a front-end framework for developing Hybrid/Web APP based on PhoneGap and AngularJS. Other similar frameworks are: Intel XDK, etc.
        Simply put, you can package and publish your web application as an IOS/Android APP, and provide many powerful services and new features beyond PhoneGap.
        It still sounds tempting, in fact, this is one of the most popular Hybrid APP development methods. Next, we will introduce how to build the Ionic development environment under Windows.
        Before starting I assume you have an understanding of the following concepts.
                Java JDK
                Apache Ant
                Android SDK
                NodeJS #The
        above terms will not be repeated here. If you are not clear, you can refer to them by yourself#

(2) Installation steps:

        Ionic official tutorial: http://learn.ionicframework.com/videos/windows-android/
        The following content refers to the official tutorial.

        1. Download JDK and configure the Java runtime environment

        Download address: http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html (please choose the corresponding version of your computer)
        Java environment variable configuration: see: http:// zhidao.baidu.com/question/1366931535221381339.html

        2. Download Apache Ant and add its bin directory path to the Path

        download address: http://mirror.tcpdiag.net/apache//ant/binaries/apache-ant- 1.9.4-bin.zip
        After the download is complete, decompress the file to a safe directory, and then add the bin folder path in the changed folder to the system Path environment variable. If it is stored in the Program Files directory of the C drive, then Add the following value to Path C:\Program Files\apache-ant-1.9.4\bin; (adding method is the same as java configuration path variable, note that the value of each environment variable is separated by;)
[u] Note: The download address cannot be opened. I downloaded apache-ant-1.9.7 from http://ant.apache.org/bindownload.cgi and unzipped it to C:/Java/ [/u]

        3. Download the Android SDK and Configure the SDK runtime environment

        Download address: http://developer.android.com/sdk/index.html Here you can only download the Android SDK without downloading Android Studio together. After the download is complete and installed, add two values ​​to the system Path environment variable. They are the path of the tools directory in the Android SDK and the path of platform-tools. For example:
                C:\Program Files (x86)\Android\android-sdk\tools;
                C:\Program Files (x86)\Android\android-sdk\platform-tools;
        Here I found that there is no "" in the Android SDK installation directory "platform-tools" folder, so I asked the Android development partner next door, he said that it is only in ADT, and then sent me this folder in his environment, which can be used normally.
        In fact, the correct solution should be:
        run the android.bat file in the tools directory, then the following interface will appear, check the Android SDK Platform-tools and install it.

        Note: The pure version of the SDK I downloaded here does not have any Android system before, so like Platform-tools, you need to check the required version here and install it. There needs to be at least one system here, otherwise the virtual machine cannot be created. Of course, if you debug with a real machine, you can do it without relying on it.

Note: The download address cannot be opened

        4. Download NodeJS for Windows and install it

        Download address: https://nodejs.org/download/
        Installing the NodeJS environment under Windows is very simple, just download the correct version from the NodeJS official website and install it.
        Note that the file to be downloaded is the file marked in the red box in the figure below.

Note: Download and install directly at https://nodejs.org/en/

        5. Use nmp provided in NodeJS to install Ionic and Cordova

        . The environment that needs to be configured in the above steps is completed. Next, you only need to log in the console Ionic and Cordova can be installed with just a few lines of commands.
        Enter the cmd window, enter the following command
           $ npm install -g cordova

        Press Enter and the system will automatically install Cordova;
        after installation, enter
npm install -g ionic
        to install Ionic
Note: The installation and download time will take about an hour or two, be patient, Don't worry #Complete
        all the above steps, you can start to quickly develop Android APP with Ionic happily#

(3) Create an Android project and call the virtual machine to run:

        1. Create an APP and enter ionic start myapp

        in the console ,         where myapp is you the name of the app


        2. Enter the created APP directory

cd myapp
        3. Select and configure the Android environment

ionic platform add android

        4. Package and generate the APP

ionic build android

        5. Run the APP (need to create a new virtual machine/connect the mobile phone first, the new method: open the Android SDK installation directory AVD Manager.exe select New)

ionic run android

        At this step, the system will open the virtual machine to run a simple sample APP.

        To learn more, go to Ionic's official website: http://ionicframework.com/ for extended reading.
[/size]

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=326404283&siteId=291194637