Primeros pasos con ionic2

Instalación o configuración

Dado que Ionic 2 mejora cada día, consulte siempre la documentación oficial para realizar un seguimiento de los últimos cambios y mejoras.

Requisitos previos: Necesitará NodeJS para construir proyectos Ionic 2. Puede descargar e instalar el nodo aquí y obtener más información sobre npm y los paquetes que utiliza Ionic 2 [aquí](http://ionicframework.com/docs/resources/using- npm/).

1. Instalación de Ionic 2

Al igual que Ionic 1, puede usar la CLI o la GUI de Ionic para crear y probar aplicaciones rápidamente directamente en el navegador. Incluso tiene toda la funcionalidad para trabajar con sus aplicaciones Ionic 1, ¡así que no necesitará cambiar nada!

Para usar Ionic 2, simplemente instale ionic desde npm:

$ npm install -g ionic

Si recibe un error EACCES, siga las instrucciones aquí para otorgar al nodo los permisos que necesita.

2. Creación de su primera aplicación

Una vez que la CLI esté instalada, ejecute el siguiente comando para iniciar su primera aplicación:

$ ionic start MyIonic2Project

La plantilla de pestañas se usa de forma predeterminada, pero puede elegir otra plantilla pasando una bandera. Por ejemplo:

$ ionic start MyIonic2Project tutorial
$ cd MyIonic2Project
$ npm install

Esto usará la plantilla tutorial.

Para ejecutar su aplicación, cambie a su directorio de proyectos y ejecute ionic serve -lc:

$ ionic serve -lc

El -l activa la recarga en vivo de la página, el -c muestra los registros de la consola. Si tiene problemas para crear su aplicación, asegúrese de que su paquete.json coincida con el de [ionic2-app-base](https://github.com/driftyco/ionic2-app-base/blob/master/package .json)

¡Puedes jugar con tu nueva aplicación allí mismo en el navegador!

3. Creación de un dispositivo

También puede crear su nueva aplicación en un dispositivo físico o en un emulador de dispositivo. Necesitará Cordova para continuar.

Para instalar Cordova, ejecute:

$ npm install -g cordova

Consulte los documentos del simulador de iOS para crear aplicaciones iOS (NOTA: no puede crear dispositivos o emuladores iOS en cualquier sistema operativo que no sea OSX), o los documentos de Genymotion para crear una aplicación de Android.

Ejecutándose en un dispositivo iOS:

Para crear una aplicación iOS, es necesario que trabaje en una computadora OSX, ya que necesitará el marco de cocoa para poder compilar para iOS, si es el caso, primero deberá agregar la plataforma a cordova ejecutando el siguiente comando:

$ ionic cordova platform add ios

Necesitará Xcode para compilar en un dispositivo iOS.

Finalmente, ejecute su aplicación con el siguiente comando:

$ ionic cordova run ios

Ejecutándose en un dispositivo Android:

Los pasos para Android son casi idénticos. Primero, agregue la plataforma:

$ ionic cordova platform add android

Luego instale el SDK de Android que le permite compilar en un dispositivo Android. Aunque el SDK de Android viene con un emulador, es muy lento. Genymotion es mucho más rápido. Una vez instalado, simplemente ejecute el siguiente comando:

$ ionic cordova run android

¡Y eso es! ¡Felicitaciones por crear su primera aplicación Ionic 2!

Ionic también tiene recarga en vivo. Entonces, si desea desarrollar su aplicación y ver los cambios en vivo en el emulador/dispositivo, puede hacerlo ejecutando los siguientes comandos:

Para iOS:

$ ionic cordova emulate ios -lcs

Ojo, en iOS 9.2.2 el livereload no funciona. Si desea trabajar con livereload, edite el archivo config.xml agregando lo siguiente:

<allow-navigation href="*"/>

Luego, en <platform name="ios"> :

<config-file parent="NSAppTransportSecurity" platform="ios" target="*-Info.plist">
  <dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
  </dict>
</config-file>

Para Android:

$ ionic cordova run android -lcs

La l significa recarga en vivo, c para registros de consola y s para registros de servidor. Esto le permitirá ver si hay errores/advertencias durante la ejecución.

Edificio para Windows

Si desea crear su proyecto para Windows, debe trabajar en una computadora con Windows. Para comenzar, instale la plataforma de Windows en su proyecto ionic2 ejecutando el siguiente comando:

$ionic cordova platform add windows

Luego simplemente ejecute el siguiente comando:

$ionic cordova run windows

Para ejecutar en el navegador

$ionic serve

para el dispositivo de inspección del navegador Chrome. (Escriba en la barra de direcciones del navegador Chrome)

chrome://inspect/#devices