从脚本文件而不是CLI运行Angular CLI脚本？本地化/国际化

Question

我们正在为我们的Angular 2应用程序进行国际化/本地化的设置，并且我希望能够编写一些脚本来执行各种任务，例如生成翻译源文件，使用特定语言的翻译构建和/或提供应用程序。

与其在package.json文件中编写脚本，我希望能够在scripts /目录中捕获单独的脚本文件，而package.json文件中的脚本只需指向这些文件。

例如，我想将package.json中的内容更改为以下形式：

"scripts": {

    //other irrelevant scripts

    "generateXLF": "ng-xi18n --i18nFormat=xlf  --outFile=./src/locale/baseFile/messages.xlf",

    //other irrelevant scripts
},

而应该像这样：

"scripts": {

    //other irrelevant scripts

    "generateXLF": "node ./build/scripts/locale/generateXLF.js"

    //other irrelevant scripts
},

或者换成这样：

"scripts": {

    //other irrelevant scripts

    "serveLocale": : "./node_modules/.bin/ngc --i18nFile=./src/locale/languages/($someLocaleIPassIn)/messages.($someLocaleIPassIn).xlf --locale=($someLocaleIPassIn) --i18nFormat=xlf",

    //other irrelevant scripts
},

而不是这样：

"scripts": {

    //other irrelevant scripts

    "serveLocale": : "node ./build/scripts/locale/serveLocale.js $someLocaleIPassIn"

    //other irrelevant scripts
},

基本上我需要做以下操作：

• 编写脚本，能够封装/执行我通常必须使用大量标志运行的Angular CLI命令。 例如，如何从脚本文件中使用一堆标志运行"ng serve"？
• 能够将参数传递给这些脚本

目前我已经部分完成了。例如，在我的generateXLF.js文件中，我目前只是尝试运行ng serve，没有任何参数或标志，就像这样：

var ngServe = require('@angular/cli/commands/serve');
new ngServe.default();

但是我一直收到这个错误提示：

C:\Projects\MyProject\StyleGuide\node_modules\@angular\cli\ember-cli\lib\models\command.js:77
    this.isWithinProject = this.project.isEmberCLIProject();
                                   ^

TypeError: Cannot read property 'isEmberCLIProject' of undefined
    at Class.init (C:\Projects\MyProject\StyleGuide\node_modules\@angular\cli\ember-cli\lib\models\command.js:77:40)
    at Class.superWrapper [as init] (C:\Projects\MyProject\StyleGuide\node_modules\core-object\lib\assign-properties.js:34:20)
    at Class.CoreObject (C:\Projects\MyProject\StyleGuide\node_modules\core-object\core-object.js:9:15)
    at Class (C:\Projects\MyProject\StyleGuide\node_modules\core-object\core-object.js:21:5)
    at Class (C:\Projects\MyProject\StyleGuide\node_modules\core-object\core-object.js:21:5)
    at C:\Projects\MyProject\StyleGuide\build\scripts\locale\generateXLF.js:32:5
    at Object.<anonymous> (C:\Projects\MyProject\StyleGuide\build\scripts\locale\generateXLF.js:37:3)
    at Module._compile (module.js:570:32)
    at Object.Module._extensions..js (module.js:579:10)
    at Module.load (module.js:487:32)

Process finished with exit code 1

当我在命令行中运行ng serve时，它非常有效，但是当我尝试从脚本中运行它时，它就不能工作。我猜想我需要设置脚本文件来知道我的.angular-cli.json文件和package.json文件在哪里，并对这些文件中的信息进行处理，以使ng serve从脚本文件中正确运行。但是我可能完全错了，不知道失败的原因。

简而言之：如何成功地从脚本文件中运行带有标志的Angular CLI脚本？如何获取传递的参数？

- Rebel Fornea

Answer 1

最终我解决了问题。这是我的脚本compileInLocale.js：

#! /usr/bin/env node

const angularCli = require('@angular/cli');
const fileSystem = require('fs');
const chalk = require('chalk');

var command = process.argv.slice(2, 3).toString();
var locale = process.argv.slice(3, 4).toString();

console.log(chalk.bgBlueBright.bold('Attempting to execute ' + __filename + ' with command "' +
command + '" and locale "' + locale + '".\n'));

makeArguments(command, locale);

/**
 * @name makeArguments
 * @description Create the array of arguments to send to the Angular CLI
 * @param {String} commandToRun the ng command we want to run, such as 'serve' or 'build'
 * @param {String} specifiedLocale the locale that the developer specified when they called
 * the script.  For example, the string 'es' from the following command line
 * entry:  'npm run serveInLocale es'
 * @returns {void} Nothing.
 */
function makeArguments(commandToRun, specifiedLocale) {

var localeFile = './src/locale/languages/' + specifiedLocale + '/messages.' + specifiedLocale + '.xlf';

if (fileSystem.existsSync(localeFile)) {

    /*
     @TODO: add in logic to build the base translation file, then compare the contents of the
     @TODO <source> tags in the translation file to the <source> tags in the file we are trying
     @TODO to serve to see if it is up-to-date.
     */

    var argArray = [
        commandToRun,
        '--aot',
        '--i18nFile=' + localeFile,
        '--locale=' + specifiedLocale,
        '--i18nFormat=xlf'
    ];

    console.log(chalk.bgGreen.bold('Preparing to ' + commandToRun + ' file ' + localeFile + '.\n'));

    serveInSpecifiedLocale(argArray);
}
else {
    console.log(chalk.bgRed.bold('Cannot ' + commandToRun + ' file ' + localeFile + '.  File does not exist!\n'));
}
}

/**
 * @name serveInSpecifiedLocale
 * @description Send an object to the Angular CLI containing our arguments array, and other
 * properties that Angular CLI needs to execute our command.
 * @param {Array} argArray the array of arguments we want to give to the CLI
 * @returns {void} Nothing.
 */
function serveInSpecifiedLocale(argArray) {

/*
@TODO: move this to its own file.  We will have more scripts in the
@TODO future which need to send arguments to the Angular CLI.
*/

angularCli({
    cliArgs: argArray,
    inputStream: process.stdin,
    outputStream: process.stdout
});
}

使用以下命令运行它：
npm run buildInLocale es
或者这个：
npm run serveInLocale fr

在package.json中有类似于这样的内容：

"serveInLocale": "node ./build/scripts/locale/compileInLocale.js serve",
"buildInLocale": "node ./build/scripts/locale/compileInLocale.js build"    

根据您键入的是buildInLocale还是serveInLocale，脚本将被命中，其中一个参数是serve或build，后跟区域设置作为另一个参数，如果我们有该区域设置的文件，则脚本可以工作。

附注：我最终做了很多工作来弄清楚这一点，但毫无意义。因为Angular 2中用于国际化的本地工具（i18n属性）在涉及到双向绑定时没有支持翻译的方法，所以我们最终会使用类似于ngx-translate的东西。不过，我仍然想发布我的解决方案，以防其他人需要编写脚本来运行通常从CLI运行的脚本。

- Rebel Fornea

---

类型错误：angularCli 不是一个函数。 - Andurit

Answer 2

使用 angularCli.default({}) 代替 angularCli({})

- Stephanie Cray