web-dev-qa-db-ja.com

npmとbowerのインストールをgruntで自動化する

私はノードを持っています/ angularバックエンドの依存関係管理にnpmを使用し、フロントエンドの依存関係管理にbowerを使用します。方法を理解することができます。

execを使用してみましたが、実際には何もインストールされません。

module.exports = function(grunt) {

    grunt.registerTask('install', 'install the backend and frontend dependencies', function() {
        // adapted from http://www.dzone.com/snippets/execute-unix-command-nodejs
        var exec = require('child_process').exec,
            sys  = require('sys');

        function puts(error, stdout, stderr) { console.log(stdout); sys.puts(stdout) }

        // assuming this command is run from the root of the repo
        exec('bower install', {cwd: './frontend'}, puts);
    });

};

フロントエンドにcdを開いてnodeを開き、コンソールからこのコードを実行すると、正常に機能します。単調な仕事で何が間違っていますか?

(また、bowerおよびnpm APIを使用しようとしましたが、どちらも機能しませんでした。)

63
Nick Heiner

this.async()メソッドを呼び出し、コールバックを取得し、execの完了時にそれを呼び出すことにより、非同期メソッド(.exec)を使用していることをgruntに伝える必要があります。

これは動作するはずです:

module.exports = function(grunt) {
    grunt.registerTask('install', 'install the backend and frontend dependencies', function() {
        var exec = require('child_process').exec;
        var cb = this.async();
        exec('bower install', {cwd: './frontend'}, function(err, stdout, stderr) {
            console.log(stdout);
            cb();
        });
    });
};

非同期タスクが完了しない理由 を参照してください

35
Sindre Sorhus

npm installの間にサーバー側のライブラリよりも同時にクライアント側のコンポーネントをインストールするには、package.jsonを追加できます

"dependencies": {
    ...
    "bower" : ""
},
"scripts": {
    ...
    "postinstall" : "bower install"
}

私はインストールとテスト/ビルドの違いを作ることを好みます

134
jsan

ちなみに、ここは今のところです。

別の方法で問題を解決することもできます。つまり、npmにbowerの実行を処理させ、最終的にgruntにnpmを処理させます。 herokuでbowerを使用 を参照してください。

grunt.registerTask('install', 'install the backend and frontend dependencies', function() {
    var async = require('async');
    var exec = require('child_process').exec;
    var done = this.async();

    var runCmd = function(item, callback) {
        process.stdout.write('running "' + item + '"...\n');
        var cmd = exec(item);
        cmd.stdout.on('data', function (data) {
            grunt.log.writeln(data);
        });
        cmd.stderr.on('data', function (data) {
            grunt.log.errorlns(data);
        });
        cmd.on('exit', function (code) {
            if (code !== 0) throw new Error(item + ' failed');
            grunt.log.writeln('done\n');
            callback();
        });
    };

    async.series({
        npm: function(callback){
            runCmd('npm install', callback);
        },
        bower: function(callback){
            runCmd('bower install', callback);  
        }
    },
    function(err, results) {
        if (err) done(false);
        done();
    });
});
7
xavier.seignard

この仕事だけを行うGruntタスク(上記のSindreのソリューションによる):

https://github.com/ahutchings/grunt-install-dependencies

2
nostopbutton

Bower installコマンドを実行するGruntタスク: https://github.com/yatskevich/grunt-bower-task

また、 https://github.com/stephenplusplus/grunt-bower-install を使用できます

依存関係をindex.htmlファイルに自動注入するには

2
Itsik Avidan