Jak dołączyć wersję git do aplikacji angular-cli?

Potrzebuję wyświetlić wersję git na stronie mojej aplikacji angular2. Projekt oparty jest na kanciastym-cli.Jak dołączyć wersję git do aplikacji angular-cli?

W jaki sposób można rozbudować budowę, aby zmiana wersji Git została umieszczona na przykład w environment.ts lub innym miejscu dostępnym dla aplikacji?

Źródło

2017-02-10 Vilmantas Baranauskas

Chyba * Angular-cli * brakuje potrzebnej funkcjonalności skryptowania wstępnego. Ale możesz chyba użyć prostego skryptu * NPM *. – Yuri

Zgodnie z sugestią @Yuri, udało mi się rozwiązać ten problem za pomocą skryptów npm.

Defined git.version.ts w korzeniu kątowego-CLI projektu:

import fs = require('fs'); 
import { Observable } from 'rxjs'; 

let exec = require('child_process').exec; 

const revision = new Observable<string>(s => { 
    exec('git rev-parse --short HEAD', 
     function (error: Error, stdout: Buffer, stderr: Buffer) { 
      if (error !== null) { 
       console.log('git error: ' + error + stderr); 
      } 
      s.next(stdout.toString().trim()); 
      s.complete(); 
     }); 
}); 

const branch = new Observable<string>(s => { 
    exec('git rev-parse --abbrev-ref HEAD', 
     function (error: Error, stdout: Buffer, stderr: Buffer) { 
      if (error !== null) { 
       console.log('git error: ' + error + stderr); 
      } 
      s.next(stdout.toString().trim()); 
      s.complete(); 
     }); 
}); 

Observable 
    .combineLatest(revision, branch) 
    .subscribe(([revision, branch]) => { 
     console.log(`version: '${process.env.npm_package_version}', revision: '${revision}', branch: '${branch}'`); 

     const content = '// this file is automatically generated by git.version.ts script\n' + 
      `export const versions = {version: '${process.env.npm_package_version}', revision: '${revision}', branch: '${branch}'};`; 

     fs.writeFileSync(
      'src/environments/versions.ts', 
      content, 
      {encoding: 'utf8'} 
     ); 
    });

Dodano pre-build haka w package.json:

"scripts": { 
    "ng": "ng", 
    ... 
    "start": "ng serve --proxy proxy-config.json", 
    "prebuild.prod": "ts-node git.version.ts", 
    "build.prod": "ng build -prod", 
    ... 
},

Użyj generowane src/environments/versions.ts w Aplikacja.

Źródło

2017-02-13 08:44:45

Polecenie '' 'ts-node git.version.ts''' nie działa i nie wiem dlaczego Otrzymuję: ' '' Czy miałeś na myśli jedno z nich? odbudować prefiks profil '' ' – George

Zastosowanie zadanie łyk użyciu łyk-replace i git-rev-sync, aby dodać hash i oddział na budowie:

1) Utwórz zadanie haustem

var gulp   = require('gulp'), 
    replace   = require('gulp-replace'), 
    git    = require('git-rev-sync'), 

gulp.task('git', function() { 
    gulp.src('src/index.html') 
     .pipe(replace('{{git-branch}}', git.branch())) 
     .pipe(replace('{{git-hash}}', git.short())) 
     .pipe(gulp.dest('src/')) 
}); 

// Build Tasks 
gulp.task('build', ['git']);

2) Dodaje się Poniższy kod do pliku index.html:

{{git-branch}}@{{git-hash}}

3) Uruchom

gulp build

Źródło

2017-07-19 17:24:50 abahet

Wystarczy zainstalować ten pakiet git-revision-webpack-plugin

Proste WebPACK plugin, który generuje wersję i COMMITHASH plików podczas kompilacji oparte na lokalnym repozytorium git.Kod

Próbka:

Wewnątrz webpack.config.js (lub dowolny dev - plik prod)

const GitRevisionPlugin = require('git-revision-webpack-plugin'); 
const gitRevisionPlugin = new GitRevisionPlugin(); 

plugins: [ 
    new DefinePlugin({ 
     'VERSION': JSON.stringify(gitRevisionPlugin.version()), 
     'COMMITHASH': JSON.stringify(gitRevisionPlugin.commithash()), 
     'BRANCH': JSON.stringify(gitRevisionPlugin.branch()), 
    }), 
    ]

w szablonie (kątowa):

{{ VERSION }} 
{{ COMMITHASH }} 
{{ BRANCH }}

Źródło

2017-11-07 10:36:37

Jak można narazić konfigurację Webpack w projekcie kątowym-cli bez wysuwania? – Zoidy

Przepraszam, ale nie rozumiem. –

poszedłem ze zmodyfikowanym wersja Vilmantas Baranauskas

przeniosłem src/index.html do src/index.base.html i dodaje pusty <meta name="revision" content=""> wewnątrz głowicy

Przykład:

<head> 
<meta charset="utf-8"> 
<title>MySuperAwesome Angular</title> 
<base href="/"> 

<meta name="viewport" content="width=device-width, initial-scale=1"> 
<meta name="revision" content=""> 
<link rel="icon" type="image/x-icon" href="favicon.ico">

Następnie zmodyfikowanej git.version.ts takiego:

import 'rxjs/add/observable/combineLatest'; 

import { readFileSync, writeFileSync } from 'fs'; 
import { join } from 'path'; 
import { Observable } from 'rxjs/Observable'; 

const indexBasePath = join(__dirname, 'src'); 

const exec = require('child_process').exec; 

const revObs = new Observable<string>(s => { 
    exec('git rev-parse --short HEAD', 
    function (error: Error, stdout: Buffer, stderr: Buffer) { 
    if (error !== null) { 
     console.log('git error: ' + error + stderr); 
    } 
    s.next(stdout.toString().trim()); 
    s.complete(); 
    }); 
}); 

const branchObs = new Observable<string>(s => { 
    exec('git rev-parse --abbrev-ref HEAD', 
    function (error: Error, stdout: Buffer, stderr: Buffer) { 
    if (error !== null) { 
     console.log('git error: ' + error + stderr); 
    } 
    s.next(stdout.toString().trim()); 
    s.complete(); 
    }); 
}); 

Observable 
.combineLatest(revObs, branchObs) 
.subscribe(([revision, branch]) => { 
    console.log(`revision: '${revision}', branch: '${branch}'`); 

    const baseHTML = readFileSync(join(indexBasePath, 'index.base.html'), 'utf8'); 
    const html = baseHTML 
    .replace('<meta name="revision" content="">', `<meta name="revision" content="${ revision }">`); 

    writeFileSync(
    join(indexBasePath, 'index.html'), 
    html, 
    { encoding: 'utf8' } 
); 
});

W tym przykładzie tylko umieścić rewizji, ale może być bardziej dokładny i umieścić oddział i wersję w swoim html sekcji HEAD

Źródło

2018-01-17 10:59:40 colthreepv

Jak dołączyć wersję git do aplikacji angular-cli?

Odpowiedz

Powiązane problemy