yeoman
by Krist Wongsuphasawat
克里斯特·旺苏帕萨瓦(Krist Wongsuphasawat)
使用yeoman轻松创建Yeoman生成器 (Creating Yeoman generators easily with yeoman-easily)
I’ve used Yeoman to start many of my projects. It’s an amazing web scaffolding tool.
我已经用Yeoman开始了许多项目。 这是一个了不起的Web脚手架工具。
But after creating my own generators several times, I saw the repetitive tasks, somewhat lengthy code, and part of the generator code that confused me every time.
但是,在几次创建自己的生成器之后,我看到了重复的任务,有些冗长的代码以及部分生成器代码,这些代码每次都使我感到困惑。
At one point, I ended up hacking a small utility that I kept copying over and over from project to project. I spent a weekend organizing it and adding several more features to take care of repetitive tasks.
有一次,我最终入侵了一个小实用程序,并不断在项目之间进行复制。 我花了一个周末组织它,并添加了更多功能来处理重复的任务。
约曼很容易诞生。 (And yeoman-easily was born.)
yeoman-easily helps with the following tasks when creating a generator with Yeoman:
使用Yeoman创建生成器时,yeoman- 轻松地帮助完成以下任务:
优势1:确认 (Advantage 1: Confirmation)
Often you would like to ask for user confirmation before proceeding. The first code block below shows how to write this with plain Yeoman. The second code block shows how to write it with the help of yeoman-easily.
通常,您需要在继续操作之前要求用户确认。 下面的第一个代码块显示了如何使用普通Yeoman编写此代码。 第二个代码块显示了如何在yeoman的帮助下轻松编写它。
With yeoman-easily, you can ask for confirmation before proceeding in one line. easily.confirmBeforeStart(message)
then easily.checkForConfirmation()
returns the result.
使用yeoman,您可以轻松地在一行之前进行确认。 easily.confirmBeforeStart(message)
然后easily.checkForConfirmation()
返回结果。
优势2:提示 (Advantage #2: Prompting)
Handling results from the prompt, then choosing which prompt to display used to be complicated.
处理来自提示的结果,然后选择要显示的提示曾经很复杂。
this.prompt()
returns a promise which needs to be handled to obtain the answers and store them. The answers are commonly stored intothis.props
. This block of code has to be written again and again.this.prompt()
返回一个promise,需要对其进行处理才能获得答案并存储它们。 答案通常存储在this.props
。 此代码块必须一次又一次地编写。A parent generator often passes the parameters to the child generator via options. From what I have seen, many generators will hide the prompts for fields that are present in the options. (Yes, you have to write code to check that.) Then combine answers from prompts and options into
this.props
.父生成器通常通过选项将参数传递给子生成器。 据我所知,许多生成器将隐藏选项中存在的字段提示。 (是的,您必须编写代码进行检查。)然后将提示和选项的答案合并到
this.props
。
For convenience, yeoman-easily:
为了方便起见,您可以轻松地:
Handles storing user’s answers from the prompts into
this.props
. Just calleasily.prompt(prompts)
instead ofthis.prompt(prompts)
处理将来自提示的用户答案存储到
this.props
。 只需easily.prompt(prompts)
调用easily.prompt(prompts)
而不是this.prompt(prompts)
Can automatically skip a prompt if an option with the same name is present. It will also copy the value of existing
this.options[field]
intothis.props[field]
.如果存在具有相同名称的选项,则可以自动跳过提示。 它还会将现有
this.options[field]
的值复制到this.props[field]
。Can register common prompts via
easily.learnPrompts(prompts)
and allow looking up prompts by name while callingeasily.prompt()
. This can save a lot of time if you create multiple generators that ask similar questions.可以通过以下方式注册常见提示
easily.learnPrompts(prompts)
并允许在调用easily.prompt()
按名称查找提示。 如果创建多个生成器来询问类似的问题,则可以节省大量时间。
优势3:撰写 (Advantage #3: Composing)
Yeoman generator can call (composeWith
) another generator from another package or local subgenerator, but the current syntax for doing so is somewhat long. I am still not sure what the local field means.
Yeoman生成器可以从另一个包或本地子生成器调用( composeWith
)另一个生成器,但是当前的语法有些长。 我仍然不确定本地领域的含义。
yeoman-easily simplifies the syntax to easily.composeWithLocal(name, namespace, options)
and easily.composeWithExternal(package, namespace, options)
.
easily.composeWithLocal(name, namespace, options)
轻松地将语法简化为easily.composeWithLocal(name, namespace, options)
和easily.composeWithExternal(package, namespace, options)
。
优势4:文件处理 (Advantage #4: File handling)
Yeoman provides flexible APIs for file handling to cover many scenarios. But it takes a few lines to perform common task such as copying a file from the template directory to the destination directory. A function for bulk copying also exists, but it’s discouraged.
Yeoman提供了灵活的API用于文件处理,以涵盖许多情况。 但是执行常见任务需要花费几行,例如将文件从模板目录复制到目标目录。 还存在用于批量复制的功能,但不建议使用。
To address the above issues, yeoman-easily:
为了解决上述问题,可以轻松地:
Provides I/O functions that wraps
this.fs.xxx
and also resolves template and destination directory for common cases (from template to destination). These functions includeread
,write
,writeJSON
,extendJSON
,exists
,copy
, andcopyTemplate
. I have a full list in my API documentation.提供包装
this.fs.xxx
I / O函数,并为常见情况(从模板到目标)解析模板和目标目录。 这些功能包括read
,write
,writeJSON
,extendJSON
,exists
,copy
和copyTemplate
。 我的API文档中有完整列表。Provides functions for mass copying both static and dynamic files based on glob pattern. See
easily.copyFiles(…)
in the example below.提供用于基于全局模式批量复制静态和动态文件的功能。 请参见以下示例中的
easily.copyFiles(…)
。
优势5:方法链接 (Advantage 5: Method chaining)
yeoman-easily was created with chaining in mind and support method chaining for fluent coding.
yeoman-easily创建时考虑了链接,并为流畅的编码提供了支持方法链接。
全部放在一起 (Putting it all together)
Here’s an example that demonstrates all of these advantages together into one generator:
下面的示例将所有这些优点一起展示到一个生成器中:
The yeoman-easily package is now available on npm. Visit the github repo for more details, API documentation and examples. I welcome your pull requests and bug reports.
yeoman轻松软件包现在在npm上可用。 请访问github repo获取更多详细信息, API文档和示例。 我欢迎您的请求请求和错误报告。
翻译自: https://www.freecodecamp.org/news/creating-yeoman-generators-easily-with-yeoman-easily-cf552aef0d2f/
yeoman