Desarrollo de aplicaciones con la CLI de PhoneGap developing-apps-with-phonegap-cli

CAUTION
AEM 6.4 ha llegado al final de la compatibilidad ampliada y esta documentación ya no se actualiza. Para obtener más información, consulte nuestra períodos de asistencia técnica. Buscar las versiones compatibles here.
NOTE
Adobe recomienda utilizar el Editor de SPA para proyectos que requieren una representación del lado del cliente basada en el marco de aplicaciones de una sola página (por ejemplo, React). Más información.

Como desarrollador, puede ejecutar la aplicación en un dispositivo o en un emulador en cualquier momento, 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 para Android instalado.

Bootstrap del entorno de desarrollo bootstrap-your-development-environment

Configuración de la CLI de PhoneGap

Para iOS: Para desarrollar para iPhone y iPads, necesita Apple Xcode IDE.

Para Android: Para desarrollar iPhone y iPads, necesita el Android Studio IDE de Google.

Descargar la fuente download-the-source

Una vez que haya mejorado correctamente su entorno de desarrollo, descargue la fuente desde el mosaico de la versión de la aplicación AEM:

  • Haga clic en la cadena desplegable de mosaicos del PhoneGap Build.

chlimage_1-45

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

imagen_1-46

NOTE
La fuente de desarrollo contiene el estado más reciente de la aplicación, al tiempo que incluye cambios no escalonados. Utilice la fuente de ensayo para crear candidatos para enviar a proveedores de tiendas de aplicaciones.
Si nunca realiza la fase de la aplicación, la selección de Ensayo déclencheur el flujo de trabajo de ensayo (sugerencia: esto se mostrará como una aplicación provisional en la aplicación de visor empresarial PhoneGap (disponible en App Store y Google PlayStore).
  • Haga clic en Descargar y guarde el ZIP en su equipo.
  • Extraiga el archivo zip descargado en su espacio de trabajo.

Generar y cargar la aplicación (desde el origen) build-and-load-the-app-from-source

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

NOTE
Puede realizar todos estos pasos por separado; consulte Documentos CLI de PhoneGap.
  1. Asegúrese de haber instalado la CLI de PhoneGap, consulte más arriba.
  2. En una ventana de consola (o terminal), vaya al directorio raíz del origen extraído.
  3. Introduzca el siguiente comando:
phonegap run android

// -- or -- //

phonegap run ios
NOTE
Si tiene problemas en este punto, vuelva a lo básico para solucionar problemas:
  1. Crear una nueva carpeta (prueba mkdir)
  2. Vaya a esta nueva carpeta (prueba cd)
  3. Ejecutar 'phonegap create helloWorld'
  4. Vaya a helloWorld (cd helloWorld)
  5. Ejecute 'phonegap run android (o reemplace android con ios como se ha indicado anteriormente).
  6. El emulador se abrirá ejecutando la aplicación PhoneGap recién creada, diciendo "Preparado para el dispositivo" si el puente de JavaScript a nativo está en funcionamiento.
Esto comprobará que su entorno de desarrollo de CLI de PhoneGap está funcionando correctamente.

Depurar JavaScript con la depuración de Safari y IOS debug-javascripts-with-safari-and-ios-debug

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

Habilitar las herramientas para desarrolladores de Safari enable-safari-developer-tools

Para habilitar las herramientas para desarrolladores:

  • 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 menú Desarrollo en la barra de menús"
  • Cierre de la ventana Preferencias

Conexión de Safari a iOS connect-safari-to-ios

Puede conectar Safari a un dispositivo iOS o emulador.

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

// -- or -- //

phonegap run <platform> --emulator
  • Abrir Safari
  • Haga clic en Desarrollo en la barra de menús
  • Seleccione el submenú Simulador de iOS
  • Haga clic en home.html

chlimage_1-48

Depurar JavaScript con el inspector web de Safari debug-javascript-with-safari-s-web-inspector

Puede establecer puntos de interrupción en cualquier lugar del origen. Cuando interactúe con su emulador o dispositivo, la ejecución de su aplicación se detendrá en esos puntos de interrupción. Puede pasar por la ejecución e inspeccionar los valores en las variables.

  • Haga clic en Recursos en la ventana Inspector 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.
  • Interaccione con el dispositivo o emulador

imagen_1-49

  • Utilice los botones de control para continuar la ejecución, dar un paso más allá, entrar en los métodos y salir de ellos:

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

Pasos siguientes the-next-steps

Una vez que sepa cómo desarrollar aplicaciones con la CLI de PhoneGap, consulte Acceso a las funciones del dispositivo.

recommendation-more-help
547b817b-14b5-4d82-aa0f-a64750e0e592