[JavaScript知识库] Yeoman

开发: C++知识库 Java知识库 JavaScript Python PHP知识库人工智能区块链大数据移动开发嵌入式开发工具数据结构与算法开发测试游戏开发网络协议系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑笔记本显卡显示器固态硬盘硬盘耳机手机 iphone vivo oppo 小米华为单反装机图拉丁

-> JavaScript知识库 -> Yeoman -> 正文阅读

[JavaScript知识库]Yeoman

Yeoman

yeoman官网
Yeoman 是一个通用的脚手架系统允许创建任何的 app 。它可以迅速的搭建一个新项目，并且能够简化了现有项目的维护。

使用步骤：
1 明确需求 ( npm i -g Yo)
2 找到合适的Generator
3 全局范围安装Generator (npm i -g generator-node)
4 通过Yo 运行对应的Generator( Yo node)
5 通过命令行交互填写选项、
6 生成项目结构

自定义Generator

Generator实际上就是一个npm模块。
npm init -y初始一个npm模块

/**
 *  此文件作为Generator的核心入口
 *  需要导出一个继承自Yeoman Generator的类型
 *  Yeoman Generator在工作的时候，会自动调用我们在此类型中定义的一些生命周期方法
 *  我们在这些方法中可以通过调用父类提供的一个工具方法实现一些功能，比如文件写入
 */

const Genertaor = require("yeoman-generator");

module.exports = class extends Genertaor {
  writing() {
    // 自动生成文件阶段调用此方法
    this.fs.write(this.destinationPath("temp.txt"), Math.random().toString());
  }
};

继承Genertaor 类，父类提供了很多方法，比如this.fs，他是在node的fs的模块上面更进一层的封装。

根据模板创建文件

模板就是ejs模板，可以写入数据。

  writing() {
    // 自动生成文件阶段调用此方法
    //this.fs.write(this.destinationPath("temp.txt"), Math.random().toString());

    // 模板文件路径
    const tmpl = this.templatePath("foo.txt");
    //输出目标
    const output = this.destinationPath("foo.txt");

    const context = { title: "aa", test: "dd" };

    this.fs.copyTpl(tmpl, output, context);
  }

templatePath会自动去templates目录下找对应名字的模板，然后可以定义传给ejs模板的数据，通过copyTpl生成新的文件。

用户交互

module.exports = class extends Genertaor {
  prompting(){
    /**
     * Yeoman在询问用户环节会自动调用此方法
     * 在此方法中可以调用父类的prompt()方法发出对用户的命令询问
     */
    return this.prompt({
      type: 'input',
      name: "name",
      message: 'Your project name',
      default: this.appname, //项目生成目录名称
    }).then(answers=>{
      this.answers = answers
    })
  }
  writing() {
    // 自动生成文件阶段调用此方法
    //this.fs.write(this.destinationPath("temp.txt"), Math.random().toString());

    // 模板文件路径
    const tmpl = this.templatePath("foo.txt");
    //输出目标
    const output = this.destinationPath("foo.txt");

    const context = this.answers

    this.fs.copyTpl(tmpl, output, context);
  }
};