change - router angular navigationend

Cómo insertar un número de compilación o marca de tiempo en el momento de la compilación en AngularCLI

Question

Quiero tener una marca de tiempo o un número de compilación en algún lugar de mi aplicación Angular2 para poder saber si un usuario está utilizando una versión antigua en caché o no.

¿Cómo hacer esto con AngularCLI en Angular2 en tiempo de compilación / compilación AOT?

Answer 1

1. Instalar el plugin npm install replace-in-file --save-dev

2. Agregar a la nueva propiedad del entorno src / environment / environment.prod.ts

   export const environment = {
     production: true,
     version: ''{BUILD_VERSION}''
   }

3. Agregue el archivo de construcción replace.build.js a la raíz de su carpeta

   var replace = require(''replace-in-file'');
   var buildVersion = process.argv[2];
   const options = {
     files: ''src/environments/environment.prod.ts'',
     from: /{BUILD_VERSION}/g,
     to: buildVersion,
     allowEmptyPaths: false,
   };
   
   try {
     let changedFiles = replace.sync(options);
     console.log(''Build version set: '' + buildVersion);
   }
   catch (error) {
     console.error(''Error occurred:'', error);
   }

4. agregar scripts a package.json

   "updateBuild": "node ./replace.build.js"

5. Usa environment.version en tu aplicación

6. Antes de compilar la llamada npm run updateBuild -- 1.0.1

PD. Siempre debes recordar que {BUILD_VERSION} nunca se confirma.

PD. Escribí una solución un poco mejor en mi blog.

PS.3 como @Julien-100000 mencionó que no debería comprometer environment.prod.ts con la versión actualizada. La actualización de la versión debe ocurrir solo en el proceso de compilación. Y nunca se debe comprometer.

Answer 2

Agrega este paso a tu trabajo de jenkins:

echo export class MyVersion {public static readonly number = ''%SVN_REVISION%''} > src/myVersion.ts

Puedes acceder al número así:

import {MyVersion} from "../myVersion";

export class AppComponent {
    constructor() {
        console.log("Welcome to MyApp version " + MyVersion.number);
    }
}

Esta solución es + liviana , + fácil de leer , + robusta .

Answer 3

No es necesario instalar replace-in-file o realizar cualquiera de los pasos mencionados en @VolodymyrBilyachat.

Solución simple: Uso de entornos angulares

Justo dentro del entorno deseado. *. Ts file (Para obtener más información acerca de los entornos que leen angular-2-and-environment-variables ), requiera package.json así:

export const environment = {
    version: require(''../package.json'').version
};

Luego dentro de su entorno de importación de aplicaciones:

import { environment } from ''../environments/environment'';

Y tienes el environment.version . Si no cannot find name ''require'' error de cannot find name ''require'' , lea esta respuesta

Más información

Nota: Como @VolodymyrBilyachat se menciona en los comentarios, esto incluirá su archivo package.json en el archivo del paquete final.

Answer 4

Quizás esta es una buena solución para alguien ... https://medium.com/@amcdnl/version-stamping-your-app-with-the-angular-cli-d563284bb94d

Lo que describe es cómo usar los datos de git y tener el último hash de confirmación como número de compilación.

Al agregar un paso de postinstalación en su package.json, se generará un archivo al ejecutar el script de instalación.