mscottb / angularstarter

Base hecha en Angular, para iniciar proyectos. Incluye nuevas funciones.

Angular Starter Kit

Este proyecto se basa en el CLI de angular en su version 6. Al cual se le agregan nuevas opciones a las herramientas actualmente disponibles.

• Pre Compilador SASS
• Modulo Router Incluido
• Integracion Jest
• integracion Prettier
• Integracion TestCafe - EN PROCESO
• Integracion Bootstrap 4
• Reduccion en el tamaño de las imagenes con Gulp + Plugins
• Agregado i18n Pipes, trabajando en la configuracion regional es-CL

Como Ocupar AngularStarterKit

Instalar lo siguente:

• Typescript Por las dudas.

• AngularCLI para ocupar los comandos del CLI y facilitar el desarrollo.

• Yarn Opcion a NPM, no es obligatorio, pero no esta demas probar.

se debe clonar el repositorio con el sigueinte comando.

git clone https://github.com/MscottB/AngularStarter

A continuación, Installar las dependencias.

Yarn Install

Y por ultimo iniciar angular.

Yarn start

Cambios Realizados

Las herramientas que tiene angular se mantiene, y se han agregado nuevas opciones las cuales son:

función	herramienta angular	Nueva opcion	Nuevo comando(Anteponer Yarn/NPM)
Test Unit	Karma/Jasmine	Jest	test-j,test-watch,test-ci, test-coverage
Test End-to-End	Protactor/Selenium	TestCafe	e2e-tc,e2e-ci
Formatting	TSLint	TSLint+Prettier	format
compress images	No Posee	Gulp + Plugins	img,tiny

Posibles Problemas

En caso de presentar problemas Prettier con TSList por un tema de reglas, se debe ocupar el siguente comando:

yarn tslint-config-prettier-check ./tslint.json

Al realizar test con jest, para disminuir los codigos de error que puede devolver zone, habilitar la siguiente linea en el archivo src/setupJest.ts:

Error.stackTraceLimit = 1;

Datos Extras

i18n Pipes

Se ha agregado esta caracteristica, para trabajar los siguientes pipes, dependiendo de la configuracion regional aplicada, en este caso es es-CL(Por defecto angular trabaja en en-US).

Para saber las opciones disponibles ver el siguiente enlace.

Pipes:

• DatePipe
• CurrencyPipe(para saber el codigo de divisa de un pais ver el siguiente enlace)
• DecimalPipe
• PercentPipe

Opciones para comprimir imagenes

La configuracion de origen/destino de las imagenes se encuentra en gulp-config/path-gulpfile.json, actualmente se poseen dos opciones:

• tiny: el cual no ocupa la API, y es capaz de trabajar con 20 imagenes(PNG/JPG) al mismo tiempo.(Necesita conexion a internet) - Mayor poder de Compresión

• img: Comprime las imagenes(JPG,PNG,GIF,SVG) sin la necesidad de conexion a internet.- Menor poder de Compresión

---

Author

Michael Scott Bravo.

• Github/MscottB

License

Copyright © 2018, Michael Scott Bravo. Released under the MIT License.