将约曼提示拆分为多个单独的组

Question

如何将yeoman提示拆分为多个部分？我有一个相当长的提示，我想把它分成几个部分，每个部分都有一个标题。

CSS
- prompt1
HTML
-prompt 2

类似这样的东西：

prompt1: function(){
  var done = this.async();
  condole.log('title 1');
  var prompts = [{
      name: 'prompt1',
      message: 'Prompt 1:',
    }]
},

prompt2: function(){
  var done = this.async();
  condole.log('title 2');
  var prompts = [{
      name: 'prompt2',
      message: 'Prompt 2:',
    }]
},

谢谢！

Answer 1

更新，因为@Demyts在注释中指出，原始代码停止工作。这是由于API在Inquirer.JS中的更改造成的。

• API的基本接口现在是inquirer.prompt(questions).then()。没有更多的回调函数
• 任何异步问题函数都将promise作为返回值，而不需要this.async()

简言之，不使用旧的var done = this.async() API并使用done()解决回调中的提示，而只是从prompting函数返回一个promise（请参阅文档）。

prompt1: function() {
  this.log("HTML")
  return this.prompt([
      // configure prompts as before
    ]).then(function (answers) {
      // callback body as before, but no more calling done()
  }.bind(this));
},

有关更多详细信息，请参阅下面的@Demyts答案

---

Yeoman使用了一个具有特定预定义优先级的运行循环，您可以使用它来执行操作。如☞文档中，您可以将多个方法按一个优先级分组。这里有一个片段来说明一个生成器，它的提示分为两组HTML和CSS:

'use strict';
var generators = require('yeoman-generator');
module.exports = generators.Base.extend({
  constructor: function () {
    generators.Base.apply(this, arguments);
  },
  prompting: {
    prompt1: function() {
      this.log("HTML")
      var done = this.async();
      this.prompt([{
          type    : 'input',
          name    : 'foo',
          message : 'Foo',
        }, {
          type    : 'input',
          name    : 'bar',
          message : 'Bar'
        }], function (answers) {
          this.foo = answers.foo;
          this.bar = answers.bar;
          done();
        }.bind(this));
    },
    prompt2: function() {
      this.log("CSS")
      var done = this.async();
      this.prompt([{
          type    : 'input',
          name    : 'bam',
          message : 'Bam',
        }], function (answers) {
          this.bam = answers.bam;
          done();
        }.bind(this));
    }
  },
  configuring: function () {
    console.log(this.foo, this.bar, this.bam);
  }
});

使用Yeoman的这一功能，您可以进一步模块化代码，例如，将不同的提示放在单独的代码文件中，并将require/import放在生成器文件中。但基本上，上面的片段就可以了。

如果有帮助，请告诉我。

Answer 2

直到我对示例代码进行了几次修改，以前的答案才对我有效。

我不能100%确定，但我相信差异可能是由于yeoman-generator模块的不同版本造成的。所以，我把这个记录在这里，以防其他人遇到同样的问题。

作为参考，我使用yeoman-generator v0.23.4、yo v1.8.4、node v6.2.2和&npm v3.9.5。

修改：

1. 删除var done = this.async();和done()的所有实例。

   async()函数导致生成器在prompt1之后退出，并且从未运行prompt2或configuring函数。

2. 在调用this.prompt()之前添加return；

   删除async()会导致生成器在不等待答案的情况下快速完成提示。添加return可以修复此问题。

3. 将this.prompt()内部的回调函数替换为.then()。

   在进行此更改之前，生成器将正确运行提示，但不会保存答案，并且configuring只会记录undefined undefined undefined。

   原件：this.prompt(prompts, callback(answers).bind(this))

   修订：this.prompt(prompts).then(callback(answers).bind(this));

完整示例：

'use strict';
var generators = require('yeoman-generator');
module.exports = generators.Base.extend({
  constructor: function () {
    generators.Base.apply(this, arguments);
  },
  prompting: {
    prompt1: function() {
      this.log("HTML")
      return this.prompt([{
        type    : 'input',
        name    : 'foo',
        message : 'Foo',
      }, {
        type    : 'input',
        name    : 'bar',
        message : 'Bar'
      }]).then(function (answers) {
        this.foo = answers.foo;
        this.bar = answers.bar;
      }.bind(this));
    },
    prompt2: function() {
      this.log("CSS")
      return this.prompt([{
        type    : 'input',
        name    : 'bam',
        message : 'Bam',
      }])
      .then(function(answers) {
        this.bam = answers.bam;
      }.bind(this));
    }
  },
  configuring: function () {
    console.log(this.foo, this.bar, this.bam);  
    console.log('Config: ', this.config);
  },
});