Iniciaré por implementar y utilizar una herramientas para automatizar la ejecución de las tareas para la construcción de mi app; y así enfocarnos únicamente en la codificación y aminorar los defectos en el despliegue. Todo esto no sin antes, brevemente describir los prerrequisitos del ambiente local.
PRERREQUISITOS
GIT 1.9.x
Maven 3.x.xy
GlassFish Server Open Source Edition 4.x
Configuración y prueba ambiente local.
Descargar el proyecto del repositorio
git clone ssh://git@repo-domain:<port>/my-app-angular2.git
O bien, de este proyecto base que comparto como referencia, el archivo de configuración de gulp hace referencia a gulconfig.json, éste únicamente contiene las rutas destino y origen, y demás información relativa a nuestro ambiente local de desarrollo, más adelante doy un ejemplo:
git clone https://github.com/yanellyjm/angular-typescript-gulp
GULPCONFIG
Recomiendo validar los json por ejemplo en http://www.jsoneditoronline.org/ abajo un ejemplo del gulpconfig.
Dentro del folder del proyecto ejecutamos las sentencias que abajo se indican para generar la app angular, el war y desplegar la aplicación; en este caso en Glassfish, la última sentencia requiere que previamente hayamos configurado el plugin de maven para Glassfish, esto se describe aquí.
cd angular-typescript-gulp mvn clean install mvn glassfish:mvn
Iniciamos el servidor como se indica abajo.
sudo /opt/glassfish4/bin/asadmin start-domain
O bien, realizamos el despliegue manual de la aplicación.
GULP
Es importante el qué, iniciaremos por mencionar que es gulp para la automatización de tareas como:
Rendimiento/Optimización
Minificación de los JS y CSS
Concatenación de los JS
Creación de MAP JS
Despliegue
Copiado de los archivos en un folder para el despliegue
Automatización de validación de los JS y CSS
Configuración de la ejecución de tareas secuencial y paralela.
Instalación
La app tiene la siguiente estructura de carpetas, algunas no se incluyen porque el proyecto que comparto es únicamente se acota a Angular-Typescript-Gulp, durante la generación de la app se crea el folder app,
Como usuario root ejecutamos:
sudo apt-get install npm
npm install -g gulp
Como usuario local dentro del folder de la app ejecutamos:
/src/main/webapp/resources/js/app$ npm install
Ejecutamos el comando que habilita la tarea de compilación y despliegue, la cual es la tarea por default que se configuró.
/src/main/webapp/resources/js/app$ gulp
Por último, habilitamos el modo de Desarrollo, con esto no será necesario estar regenerando la app cada vez que realicemos un cambio.
/src/main/webapp/resources/js/app$ gulp watch
Finalmente, la descripción de las tareas y funciones utilizadas se puede consultar fácilmente consultando las referencias que abajo comparto. Felices despliegues!!