Desarrollo de aplicaciones con la CLI de PhoneGap

NOTA

Adobe recomienda el uso del Editor de SPA para proyectos que requieren una representación de cliente basada en el marco de aplicaciones de una sola página (por ejemplo, React). Más información.

En cualquier momento, como desarrollador, puede ejecutar la aplicación en un dispositivo o en un emulador, siempre que haya configurado el entorno de desarrollo.

Para ejecutar los siguientes ejemplos necesitará un sistema que ejecute OSx (Mac) con Xcode o un sistema Mac/Win/Linux con el SDK de Android instalado.

Bootstrap su entorno de desarrollo

Configuración de la CLI de PhoneGap

Para iOS: Para desarrollar iPhone y iPad, necesita el IDE Xcode de Apple.

Para Android: Para desarrollarse para iPhone y iPad, necesita el Android Stuido IDE de Google.

Descargar la fuente

Una vez que haya superado con éxito el entorno de desarrollo, descargue la fuente desde el icono de compilación de aplicaciones de AEM:

  • Haga clic en el escaparate de mosaico del PhoneGap Build.

chlimage_1-45

  • Haga clic en Descargar fuente.
  • Seleccione el origen que desee en el modal Descargar origen.

chlimage_1-46

NOTA

El origen de desarrollo contiene el estado más reciente de la aplicación, al tiempo que incluye cambios no escalonados. Utilice el origen Ensayo para crear candidatos a la versión para enviarlos a los proveedores del almacén de aplicaciones.

Si nunca realiza la etapa de la aplicación, al seleccionar Ensayo se déclencheur el flujo de trabajo de ensayo (sugerencia: esto se mostrará como una aplicación escalonada en la aplicación PhoneGap Enterprise Viewer (disponible en AppStore y Google PlayStore).

  • Haga clic en Descargar y guarde el ZIP en su equipo.
  • Extraiga el archivo zip descargado en su área de trabajo.

Genere y cargue la aplicación (desde el origen)

La CLI de PhoneGap puede crear un proyecto de plataforma, compilar el origen e implementar la aplicación en un único comando.

NOTA

Puede realizar todos estos pasos por separado, consulte Documentos de CLI de PhoneGap.

  1. Asegúrese de haber instalado la CLI de PhoneGap, consulte arriba.
  2. En una ventana de consola (o terminal), navegue al directorio raíz del origen extraído.
  3. Introduzca el siguiente comando:
phonegap run android

// -- or -- //

phonegap run ios
NOTA

Si tiene problemas en este momento, vuelva a lo básico para solucionar problemas -

  1. Crear una nueva carpeta (prueba de mkdir)
  2. Navegar a esta nueva carpeta (prueba de CD)
  3. Ejecutar 'phonegap create helloWorld'
  4. Navegar a helloWorld (cd helloWorld)
  5. Ejecute 'phonegap run android (o reemplace android con ios como se ha indicado anteriormente).
  6. El emulador abrirá la ejecución de la aplicación PhoneGap recién creada, diciendo "Preparado para el dispositivo" si el puente de JavaScript a nativo está operativo.

Esto comprobará que el entorno de desarrollo de la CLI de PhoneGap está activo y funcionando correctamente.

Depurar JavaScript con la depuración de Safari e IOS

Puede depurar los JavaScript de la aplicación con las herramientas de desarrollador de Safari, del mismo modo que lo haría con una aplicación web.

Habilitar las herramientas para desarrolladores de Safari

Para habilitar las herramientas del desarrollador:

  • Abrir las preferencias de Safari

    • Haga clic en Safari en la barra de menús
    • Haga clic en Preferencias

  • Haga clic en Avanzadas en la ventana Preferencias

chlimage_1-47

  • Marque "Mostrar el menú Revelar en la barra de menús"
  • Cerrar la ventana Preferencias

Conectar Safari a iOS

Puede conectar Safari a un dispositivo iOS o a un emulador.

  • En una ventana de consola, navegue al directorio raíz del origen extraído.
  • Introduzca el siguiente comando para iniciar la aplicación en el dispositivo o emulador.
phonegap run <platform> --device

// -- or -- //

phonegap run <platform> --emulator
  • Abrir Safari
  • Haga clic en Desarrollar en la barra de menús
  • Seleccionar submenú del simulador de iOS
  • Haga clic en home.html

chlimage_1-48

Depurar JavaScript con el inspector web de Safari

Puede establecer puntos de interrupción en cualquier lugar del origen. Al interactuar con el emulador o el dispositivo, la ejecución de la aplicación se detendrá en esos puntos de interrupción. Puede realizar un paso a través de la ejecución e inspeccionar los valores en las variables.

  • Haga clic en Recursos en la ventana Inspector de Web
  • Navegue por el árbol de origen y haga clic en el archivo de origen deseado
  • Haga clic en el número de línea adyacente para agregar un punto de interrupción
  • Interactuar con el dispositivo o emulador

chlimage_1-49

  • Utilice los botones de control para continuar la ejecución, pasar el ratón por encima, entrar y salir de los métodos:

NOTA

Para ver los valores de las variables, en el método actual, pase el ratón.

Pasos siguientes

Una vez que haya aprendido acerca del desarrollo de aplicaciones con la CLI de PhoneGap, consulte Acceso a funciones del dispositivo.

En esta página