Saltar al contenido

Angular 2 con CLI: compilación para producción

Solución:

Actualizado para Angular v6 +

# Prod - these are equivalent
ng build --configuration=production
ng build --c=production
ng build --prod=true

# Dev - and so are these
ng build --configuration=development
ng build --c=development
ng build --prod=false
ng build

Más configuraciones de bandera aquí

https://angular.io/cli/build


Según github wiki v2 + de Angular-cli, estas son las formas más comunes de iniciar una compilación de desarrollo y producción

# Prod these are equivalent
ng build --target=production --environment=prod
ng build --prod --env=prod
ng build --prod

# Dev and so are these
ng build --target=development --environment=dev
ng build --dev --env=dev
ng build --dev
ng build

Hay diferentes indicadores predeterminados que afectarán las compilaciones de –dev vs –prod.

Flag                 --dev      --prod
--aot                false      true
--environment        dev        prod
--output-hashing     media      all
--sourcemaps         true       false
--extract-css        false      true

--prod también establece las siguientes configuraciones no marcables:

  • Agrega trabajador de servicio si está configurado en .angular-cli.json.
  • Reemplaza process.env.NODE_ENV en módulos con el production
    value (esto es necesario para algunas bibliotecas, como react).
  • Ejecuta UglifyJS en el código.

Necesito solucionar algunos problemas para que AOT funcione. Cuando corrí:

ng build –prod –aot = falso

Me volvería a devolver un error similar a

Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory'

Originalmente, tuve que hacer una refactorización del proyecto para que AOT funcionara. Sin embargo, pueden ser una solución si se encuentra con este error. Tratar

npm yo [email protected]

https://github.com/angular/angular-cli/issues/7113

Intente usar: ng build –target = production Esto debería funcionar.

prueba esto

 ng build --env=prod

El sistema de compilación tiene como valor predeterminado el entorno de desarrollo que usa environment.ts, pero si lo haces ng build --env=prod luego environment.prod.ts se utilizará en su lugar.

resultado de muestra si su proyecto es una nueva aplicación angular de cli.

 10% building mod3439ms building modules                                                                     1ms add01564ms 917ms asset45ms emittingHash: 9216e76d6f10637c945c                  
Version: webpack 2.1.0-beta.22
Time: 6358ms
            Asset       Size  Chunks             Chunk Names
   main.bundle.js     2.6 MB    0, 2  [emitted]  main
 styles.bundle.js    10.2 kB    1, 2  [emitted]  styles
        inline.js    5.53 kB       2  [emitted]  inline
         main.map    2.61 MB    0, 2  [emitted]  main
       styles.map    14.2 kB    1, 2  [emitted]  styles
       inline.map    5.59 kB       2  [emitted]  inline
       index.html  482 bytes          [emitted]  
assets/.npmignore    0 bytes          [emitted]  
chunk    {0} main.bundle.js, main.map (main) 2.06 MB {1} [initial] [rendered]
chunk    {1} styles.bundle.js, styles.map (styles) 9.96 kB {2} [initial] [rendered]
chunk    {2} inline.js, inline.map (inline) 0 bytes [entry] [rendered]
Child html-webpack-plugin for "index.html":
         Asset     Size  Chunks       Chunk Names
    index.html  2.82 kB       0       
    chunk    {0} index.html 350 bytes [entry] [rendered]

Listo y está por debajo de / dist a menos que haya cambiado outDir en angular-cli.json

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *