javascript - bootstrap angular 5

Cargar bibliotecas externas desde CDN con angular-cli

Question

Me gustaría usar angular-cli para crear una aplicación que incluya el código de mi aplicación pero no incluya el marco Angular2 u otras bibliotecas de JavaScript externas grandes en el código incluido. Me gustaría cargar estas bibliotecas desde un CDN cuando se carga la página. ¿Hay alguna forma de hacer esto?

Además, ¿hay una forma de hacerlo conservando los beneficios de una compilación local donde solo se cargan las partes del marco Angular2 que estoy usando?

Vi esta pregunta, pero fue para SystemJS y no creo que se aplique a Angular-cli: cómo cargar angular2 usando CDN y SystemJS

Answer 1

Al crear una aplicación con Angular, versión 2 o superior, utiliza un sistema de compilación que solo incluye las partes de la plataforma Angular que utiliza. Las plantillas se pueden compilar en el momento de la compilación, lo que permite que el proceso de compilación elimine el compilador de plantillas de su carga útil agrupada. Finalmente, el proceso de compilación hace temblar árboles con la ayuda del análisis estático de su código, que elimina aún más del paquete de carga útil las partes no utilizadas de la plataforma.

Si proporciona Angular desde un CDN, tendría que ser el fregadero de la cocina, toda la plataforma. Esto sería enorme y un detrimento para su aplicación.

Está mucho mejor permitiendo el agrupamiento angular de las partes de la plataforma que necesita. A medida que el plugin de árboles en árbol de WebPack mejore, los tamaños de sus paquetes se harán más pequeños.

Answer 2

Yo agregaría toda tu aplicación a un CDN como Akamai . Por ejemplo (dependiendo de cómo esté estructurada su aplicación), podría almacenar en caché archivos como los de la siguiente lista ...

• index.html
• Elemento de lista
• aplicacion.css
• aplicacion.js
• templates.js
• vendors.css
• vendors.js

Esto proporcionaría un rendimiento aún mejor que el simple almacenamiento en caché de los archivos del marco angular en el CDN.

Answer 3

Simplemente necesita agregar las etiquetas <script src=""> apropiadas que apuntan a la CDN al archivo index.html . Recuerde eliminar los archivos .js de angular-cli.json para que no se angular-cli.json la aplicación.

Actualmente, no puede hacer eso con los archivos js de Angular 2, ya que se incluyen automáticamente en su aplicación. Aunque las actualizaciones más recientes permiten que los servidores y navegadores web almacenen en caché los archivos del proveedor, no se vuelven a descargar en todas las visitas a su aplicación, sino solo cuando cambia el hash.