作为已经提出的解决方案的替代方案，我创建了一个简单的JS脚本，将版本写入. TS文件中的一个常量，因此它可以像任何其他TS文件一样读取。

我在任何新版本更改之前调用这个脚本。

代码如下:

// easier with fs-extra, but possible also with node build-in fs
const fs = require('fs-extra');

function storeVersionInTsFile() {
  const packageJson = fs.readJSONSync('./package.json');
  const file = `./src/app/version.ts`;
  const contents = `/**\n * Auto generated file, do not edit.\n */\n\nexport const appVersion = '${packageJson.version}';\n`;
  fs.writeFileSync(file, contents);
}

storeVersionInTsFile()

version.ts的内容:

/**
 * Auto generated file, do not edit.
 */

export const appVersion = '0.3.2';

为了方便起见，我还在package.json中添加了一个脚本:

...
"store-version": "node store-version.js",
"build": "npm run store-version && ng build --configuration production"
...

这个答案只针对Angular 12+。它使用Webpack 5。

根据webpack5文档

新规范不支持这一点，您将得到一个警告。而不是:

import { version } from './package.json';
console.log(version);

use:

import pkg from './package.json';
console.log(pkg.version);

另外，你必须在tsconfig.json中提供

"compilerOptions": {
  ...
  "allowSyntheticDefaultImports": true
  "resolveJsonModule":true
  ...

打印稿

import { Component, OnInit } from '@angular/core';
declare var require: any;

@Component({
  selector: 'app-version',
  templateUrl: './version.component.html',
  styleUrls: ['./version.component.scss']
})
export class VersionComponent implements OnInit {
  version: string = require( '../../../../package.json').version;

  constructor() {}

  ngOnInit() {

  }
}

HTML

<div class="row">
    <p class="version">{{'general.version' | translate}}: {{version}}</p>
</div>

尝试DyslexicDcuk的答案，结果是找不到name require

然后，阅读https://www.typescriptlang.org/docs/handbook/modules.html中的“可选模块加载和其他高级加载场景”部分帮助我解决了这个问题。(Gary在这里提到了https://stackoverflow.com/a/41767479/7047595)

使用下面的声明来要求package.json。

declare function require(moduleName: string): any;

const {version : appVersion} = require('path-to-package.json');

对于那些不喜欢带包裹的人。查看这个插件ngx-build-plus。

提示:如果你想在不同的文件中使用它，就使用一个注入令牌来提供VERSION，这样就没有更多的declare语句了。

这个https://github.com/angular/angular-cli/issues/5190有一个有趣的解决方案，使用shell文件来生成版本。ts文件。@sanjeev在这个论坛上有一个类似的解决方案。

这个解决方案使用Node, javascript和fs模块来实现相同的功能。在linux中工作是肯定的。在Windows中应该工作正常，因为Node/fs是跨平台的…对吧?

add a line to package.json: { "version": "0.0.1", ... "scripts": { "version": "node gen_version.js $npm_package_version", ... }, ... } create gen_version.js (note: it's not typescript) var fs = require('fs'); // arg[0]: node path // arg[1]: this script's path // arg[2]: 1st arg on command line console.log('current version: ' + process.argv[2]) path = 'src/environments/version.ts' script = 'export class Constants {' script += ' static readonly version = \'' + process.argv[2] + '\'' script += '}' fs.writeFile(path, script, function (err, file) { if (err) throw err; console.log('file saved:', path); }); Run it from npm: npm run version > omnitool@0.0.1 version ... > node gen_version.js $npm_package_version current version: 0.0.1 file saved: src/environments/version.ts use from your app: import {Constants} from "../environments/version" ... console.log('Version:', Constants.version)