2017-07-26 12 views
2

私たちは、Angular 2アプリケーションで国際化/ローカリゼーションを行うことを念頭に置いています。翻訳ソースファイルの生成、ビルド、および/またはレンダリングなど、さまざまなタスクを実行するスクリプトを書くことができます。特定の言語の翻訳をアプリケーションに提供することができます。CLIではなくスクリプトファイルからAngular CLIスクリプトを実行しますか?ローカライゼーション/国際化

スクリプトをpackage.jsonファイルに書き込むのではなく、scripts /ディレクトリ内の別々のファイルにスクリプトをキャプチャしたいと思います。package.jsonファイル内のスクリプトはそれらを指しています。

"scripts": { 

    //other irrelevant scripts 

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

    //other irrelevant scripts 
}, 

、代わりにこのようなものがあります:

例えば、私はpackage.jsonにこのような何かを取るしたいと思います

"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 
}, 

代わりに、これは次のとおりです。

私は、通常のフラグのトンと角度CLIで実行する必要があります/実行コマンドをカプセル化することができます

  • 書き込みスクリプト:
    "scripts": { 
    
        //other irrelevant scripts 
    
        "serveLocale": : "node ./build/scripts/locale/serveLocale.js $someLocaleIPassIn" 
    
        //other irrelevant scripts 
    }, 
    

    は基本的に私は、次の操作を行う必要があります。私。どのようにフラグの束でスクリプトファイルから "ng serve"を実行できますか?

は現在、私はそこに道の一部だこれらのスクリプトにパラメータを渡すことができます。

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

が、私はこのエラーを取得しておく:例えば私の generateXLF.jsファイルに私は現在、ちょうどそうのように、パラメータやフラグなしで、 ng serveを実行しようとしている

だけで正常に動作し ng serve
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 

私はCLIからそれを実行するが、私はスクリプトからそれを実行しようとしないとき。私は何とか私の.angular-cli.jsonファイルと私のpackage.jsonファイルがどこにあるかを知るためにスクリプトファイルを設定し、これらのファイルの情報を使ってng serveをスクリプトファイルから正しく実行させる必要があると思います。しかし、なぜそれが失敗しているのかについて全く間違っているかもしれません。

TLDR:スクリプトファイルからフラグ付きAngular CLIスクリプトを正常に実行するにはどうすればよいですか?どのように私が渡したパラメータを拾うには?

答えて

2

解決しました。ここに私のスクリプトは、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
またはこの:package.json
npm run serveInLocale fr

このような何かをしている:

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

あなたが入力したかどうかによって、buildInLocaleまたはserveInLocaleの場合、スクリプトにはserveまたはbuildが引数として指定され、その後に別の引数としてロケールが適用されます。また、そのロケール用のファイルがある場合はスクリプトが動作します。

サイドノート:これは何の理由もなくこれを理解するための作業を終わらせました。国際化(i18n属性)を行うAngular 2のネイティブツールには、双方向バインディングが含まれている場合に翻訳をサポートする手段がないため、代わりにngx-translateのようなものを使用することになります。私はまだ私のソリューションを投稿したいと思っていましたが、他の誰かが、通常はCLIから実行されるスクリプトを実行するためのスクリプトを書く必要がある場合に備えてください。

+0

恐ろしいですね!これは、私にたくさんの見た目と学習を節約します。 – gye

関連する問題