User interactions

Prompts

Prompts是主要和用户交互的方式。prompt方法是异步的,并返回一个promise。你需要从task中返回promise,以便在运行下一个任务之前等待任务完成

module.exports = class extends Generator {
  async prompting() {
    const answers = await this.prompt([
      {
        type: "input",
        name: "name",
        message: "Your project name",
        default: this.appname // Default to current folder name
      },
      {
        type: "confirm",
        name: "cool",
        message: "Would you like to enable the Cool feature?"
      }
    ]);

    this.log("app name", answers.name);
    this.log("cool feature", answers.cool);
  }
};

在下一个阶段使用用户的输入

module.exports = class extends Generator {
  async prompting() {
    this.answers = await this.prompt([
      {
        type: "confirm",
        name: "cool",
        message: "Would you like to enable the Cool feature?"
      }
    ]);
  }

  writing() {
    this.log("cool feature", this.answers.cool); // user answer `cool` used
  }
};

记住用户的偏好

用户在一些选项可能会每次都选择相同的,对于这种情况我们比较好的做法是记住用户的输入,并且在下一次作为默认的选项。

this.prompt({
  type: "input",
  name: "username",
  message: "What's your GitHub username",
  store: true //确定是否存储用户的输入
});

Arguments

Arguments 可以通过命令行传输

yo webapp my-project

//my-project 是第一个参数

告知系统我们需要参数可以用 this.argument()方法,接受name(string)和一个对象为参数

获取这个name的方式可以用:this.options[name].

可选传入对象参数:

  • desc 参数的描述
  • required Boolean类型,是否必传
  • type String,Number,Array(也可以是接收原始字符串值并对其进行解析的自定义函数)
  • default 参数的默认值

this.argument必须在constructor中调用。否则,当用户使用help选项调用生成器时,Yeoman将无法输出相关的帮助信息:例如yowebapp--help。

module.exports = class extends Generator {
  // note: arguments and options should be defined in the constructor.
  constructor(args, opts) {
    super(args, opts);

    // This makes `appname` a required argument.
    this.argument("appname", { type: String, required: true });

    // And you can then access it later; e.g.
    this.log(this.options.appname);
  }
};

Options

Options和arguments看着很像,但它们是作为命令行标志编写的。

yo webapp --coffee

this.option()这个方法可以告诉系统我们需要options,传参方式和arguments一样

可选传入对象参数:

  • desc option的描述
  • alias option的别名
  • type Boolean、String或Number(也可以是接收原始字符串值并对其进行解析的自定义函数)
  • default 默认值
  • hide Boolean 是不是在help的时候展示
module.exports = class extends Generator {
  // note: arguments and options should be defined in the constructor.
  constructor(args, opts) {
    super(args, opts);

    // This method adds support for a `--coffee` flag
    this.option("coffee");

    // And you can then access it later; e.g.
    this.scriptSuffix = this.options.coffee ? ".coffee" : ".js";
  }
};

输出信息

输出信息是由this.log 处理的信息,可以在终端打印输出信息

module.exports = class extends Generator {
  myAction() {
    this.log("Something has gone wrong!");
  }
};

Yeoman-脚手架搭建工具《一》
Yeoman-脚手架搭建工具《二》


xieyanmei
49 声望4 粉丝