Bootstrapping en Angular

En esta lección, voy a presentar Proceso de arranque de la aplicación de Angular. Bootstrapping es el proceso de lanzamiento y cargando la aplicación en el navegador para el usuario Así que aquí tengo una aplicación de inicio. que fue creado usando la CLI angular y se está ejecutando actualmente y en el navegador aquí, puede ver que se muestra la plantilla de inicio. Estoy haciendo clic en inspeccionar, puedes ver todos los elementos DOM de HTML y todo lo que aquí se rinde. Pero si ve el archivo de origen en su lugar, verás que este es un archivo mucho más corto que esta página ha comenzado como. Aquí hay información básica del encabezado, y luego esta raíz de la aplicación de selector de componente único. Este es el componente raíz de la aplicación. La mayoría de las aplicaciones angulares tienen un componente raíz así, ese componente tiene componentes anidados, que luego tendrá componentes anidados y dependencias propias, y todo esto construye un árbol de componentes estructurales que conforma tu aplicación Angular. También hay cinco archivos JavaScript aquí, hay tiempo de ejecución, polyfills, estilos, proveedores y main. Runtime es un archivo Webpack, que es el software que usa Angular para ayudar a construir y agrupar módulos para servir al navegador. Polyfills contiene scripts para admitir los diferentes tipos de navegadores, y estilos se compilan estilos globales para la aplicación. El proveedor luego contiene scripts angulares así como otros scripts de dependencia de bibliotecas. Y main.js contiene el código para su aplicación angular, y este archivo se transpila del archivo main.ts en el código fuente de su proyecto. Así que ahora voy a cambiar al código de Visual Studio y abra el archivo main.ts, que se encuentra en la carpeta de origen, y en este archivo, verá esta línea llamando al método del módulo de arranque. Esta línea es lo que comienza a arrancar la aplicación. para el navegador, comenzando con el módulo que se pasa al método aquí. Este módulo es el módulo de ruta para la aplicación, y es el punto de partida para que Angular cargue en todos los demás módulos y dependencias. Y este módulo contiene ese componente raíz que estaba en el archivo fuente. Entonces el archivo index.HTML es el archivo que buscan los navegadores y cargar primero, cuando un usuario navega a su sitio. Este fue el archivo de origen que se vio en el navegador. La aplicación bootstrapped se inyecta en el DOM usando este punto de entrada aquí, el selector del componente de ruta. Y a los scripts que estaban al final del archivo fuente. se agregan por angular después del proceso de construcción. Primero tiene que transpilar todo el código TypeScript en JavaScript antes de servirlo en el navegador. Eso es todo por esta lección introducción de aplicaciones, bootstrapping, y mira la siguiente lección para aprender más sobre El proceso de arranque automático de Angular.