Yeoman定制脚手架流程

278 阅读2分钟

Yeoman 是一个通用的脚手架系统,允许创建任何类型的应用程序(Web,Java,Python,C#等)。用 yeoman 写脚手架非常简单, yeoman 提供了 yeoman-generator 让我们快速生成一个脚手架模板,我们的主要工作就是把模板文件写好。

本文目标:基于yeoman搭建自己的脚手架

创建流程

初始化项目

npm init -y

安装yeoman基本生成器

npm install --save yeoman-generator
  • 后序在此基本生成器上扩展

目录组织结构

├───package.json
└───generators/-------------------生成器目录
    ├───app/----------------------默认生成器目录
    │   └───index.js
    └───router/
        └───index.js
  • 有了这个结构之后,就可以编写实际的生成器了。

  • Yeoman提供了一个基本生成器,您可以扩展它来实现自己的行为。这个基本生成器将添加您希望简化任务的大部分功能。

扩展基本生成器

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

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

module.exports = class extends Generator {
	// 重写构造函数
    constructor(args, opts){
        super(args, opts)
    }
};
  • 添加自己的功能

在调用生成器之后,添加到原型中的每个方法都会运行—而且通常是按顺序运行。但是,一些特殊的方法名称将触发特定的运行顺序。

module.exports = class extends Generator {
    // 重写构造函数
    constructor(args, opts){
        super(args, opts)
    }
	writing() {
		// Yeoman 自动在生成文件阶段调用此方法
		// 我们这里尝试往项目目录中写入文件

		this.fs.write(this.destinationPath("txt.txt"), 123);
	}
};

运行生成器

  • 因为是在本地开发生成器,所以它还不能作为一个全局npm模块。可以使用npm创建全局模块并将其符号链接到本地模块。

  • 在命令行中,从生成器项目的根目录(generator-name/文件夹)输入:

npm link
  • 它将安装项目依赖项,并将一个全局模块符号链接到本地文件。在npm完成后,就可以调用你的生成器名字了

  • 在项目根目录下运行生成器

    Yeoman在目录树中搜索.yo-rc.json文件。如果找到,它会将文件的位置视为项目的根。在幕后,Yeoman将把当前目录更改为.yo-rc.json文件位置,并在那里运行请求的生成器。

    Storage模块创建了.yo-rc.json文件。第一次从生成器中调用this.config.save()将创建该文件。

    因此,如果您的生成器没有在当前工作目录中运行,请确保您没有.yo-rc.json。

yo <生成器名字>

发布generator到npm

-参考npm包发布 juejin.cn/post/705594…