运行 ng 构建时执行 JavaScript 文件

Question

我想在每次运行 ng build 时在我的 Angular 应用程序中运行一个 JavaScript 文件。更准确地说，我希望在构建过程之前执行此文件，以便它所做的更改存在于构建中。

它是一个简单的脚本，可以读取应用程序版本及其依赖项并将它们写入对象。

文件名为 pre-build.js，我已尝试在 package.json 中配置 build 命令如下，但是我可以看到脚本未执行：

{
   ...
   ...,
   "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "node pre-build.js && ng build",
    "watch": "ng build --watch --configuration development",
    "test": "ng test"
   },
   ...,
   ...,
}

脚本的路径是./pre-build.js。我假设我必须更改更多配置才能实现此目的，但我无法找出位置。任何线索将不胜感激。

编辑：

这是pre-build.js的内容：

const path = require('path');
const fs = require('fs');
const appVersion = require('./package.json').version;
const appDeps = JSON.stringify(require('./package.json').dependencies);

const versionFilePath = path.join(__dirname + '/src/environments/version.ts');

const src = `export const version = '${appVersion}';\nexport const buildTime = '${new Date()}';\nexport const deps = ${appDeps};`;

// ensure version module pulls value from package.json
fs.writeFile(versionFilePath, src, (err) => {
  if (err) {
    console.log(err);
  }
});

当我在终端中运行 node pre-build.js 时，代码工作正常并更新 version.ts 文件。但我想在每次运行 ng build 时以某种方式自动执行此命令。到目前为止我还做不到。

Answer 1

这样试试：

node ./pre-build.js && ng build

Answer 2

编辑

这个问题的正确答案是你不应该运行 ng build 但应该运行 npm run build 因为你想执行脚本。当您执行 ng build 时，这只会触发 angular 的构建，并且不会更新您的版本文件。

下面是您执行 npm run build 时完全相同代码的示例，因此请务必更新您的构建方式。

试一试，如果这仍然是个问题，请告诉我。

旧答案

您可以创建一个“.sh”脚本来执行您需要的一切。这可能有助于稍后添加更多预或 post 构建命令

这是一个例子

package.json

"scripts": {
  "build:angular": "ng build",
  "build": ./build.sh
}

build.sh

#!/bin/bash
node ./pre-build.js

npm run build:angular

确保 pre-build 是可执行文件 build.sh (chmod https://askubuntu.com/questions/229589/how-to-make-a-file-e-g-a-sh-script-executable-so-it-can-be-run-from-a-termi )

运行 ng 构建时执行 JavaScript 文件

Executing a JavaScript file when running ng build

javascript

node.js

json

angular

typescript