Javascript 使用 grunt 自动安装 npm 和 bower

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/14166591/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 15:53:08  来源:igfitidea点击:

Automate npm and bower install with grunt

javascriptnode.jsnpmbowergruntjs

提问by Nick Heiner

I have a node / angular project that uses npm for backend dependency management and bower for frontend dependency management. I'd like to use a grunt task to do both install commands. I haven't been able to figure out how to do it.

我有一个 node/angular 项目,它使用 npm 进行后端依赖管理,使用 bower 进行前端依赖管理。我想使用 grunt 任务来执行这两个安装命令。我一直无法弄清楚该怎么做。

I made an attempt using exec, but it doesn't actually install anything.

我尝试使用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);
    });

};

When I cdinto frontend, open up node, and run this code from the console, this works fine. What am I doing wrong in the grunt task?

当我cd进入前端时,打开node并从控制台运行此代码,这工作正常。我在 grunt 任务中做错了什么?

(I also tried to use the bower and npm APIs, but couldn't make that work either.)

(我也尝试使用 bower 和 npm API,但也无法使其工作。)

采纳答案by Sindre Sorhus

You need to tell grunt that you're using an async method (.exec) by calling the this.async()method, getting a callback, and calling that when exec is done.

您需要.exec通过调用this.async()方法、获取回调并在 exec 完成时调用该方法来告诉 grunt 您正在使用异步方法 ( ) 。

This should work:

这应该有效:

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();
        });
    });
};

See Why doesn't my asynchronous task complete?

请参阅为什么我的异步任务没有完成?

回答by jsan

To install client side components during npm installat the same time than server side libs, you can add in your package.json

npm install在与服务器端库同时安装客户端组件,您可以添加package.json

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

I prefer to make the difference between install and test/build

我更喜欢区分安装和测试/构建

回答by xavier.seignard

FYI, here is where i am for now.

仅供参考,这是我现在的位置。

You could also have taken the problem another way, i.e. let npm handle the execution of bower, and ultimately let grunt handle npm. See Use bower with heroku.

你也可以用另一种方式来解决这个问题,即让 npm 处理 bower 的执行,最终让 grunt 处理 npm。请参阅将凉亭与 heroku 结合使用

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();
    });
});

回答by nostopbutton

Grunt task that does just this job (as per Sindre's solution above):

完成这项工作的 Grunt 任务(根据上面 Sindre 的解决方案):

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

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

回答by Itsik Avidan

Grunt task that does the bower install command : https://github.com/yatskevich/grunt-bower-task

执行 bower 安装命令的 Grunt 任务:https: //github.com/yatskevich/grunt-bower-task

also , you can use https://github.com/stephenplusplus/grunt-bower-install

另外,您可以使用 https://github.com/stephenplusplus/grunt-bower-install

to auto inject your dependencies into the index.html file

将您的依赖项自动注入 index.html 文件