Yeoman使用

2020-02-29  本文已影响0人  老奶瓶

https://yeoman.io/

制作脚手架工具

安装
npm install -g yo
版本
yo --version

创建构建器

https://github.com/yeoman/generator-generator

安装
npm install -g generator-generator

新建项目目录,把你想构建的文件拷贝进来

构建
yo generator

初始化参数
? Your generator name generator-zztest-gulp
Your generator must be inside a folder named generator-zztest-gulp
I'll automatically create this folder.
? Description this is a gulp simple project
? Project homepage url 
? Author's Name oldninepinng
? Author's Email 2508031513@qq.com
? Author's Homepage 
? Package keywords (comma to split) gulp browsersync sass uglify
? Send coverage reports to coveralls Yes
? Enter Node versions (comma separated) 10.16
? GitHub username or organization zhangzhuangsimida
? Which license do you want to use? MIT

https://yeoman.io/authoring/running-context.html

将你要构建的文件(就是要重复构建的)下载到generator-项目名-gulp/generators/app/templates

修改generator-项目名-gulp/generators/app/templates/index.js文件

...
writing() {
  this.fs.copy(
    this.templatePath('**'),//复制template下的所有文件
    this.destinationPath('./')//输出在当前目录下
  );
}
...

使用脚手架

cd generator-zztest-gulp
npm link //将脚手架link到全局
mkdir demo-dest
yo zztest-gulp //脚手架名称,这里不需要加generator做开头了

这里bower会报错,官方已经不推荐了,所以还要在generator-项目名-gulp/generators/app/templates/index.js中增加参数让项目默认使用npm构建

...
install() {
    this.installDependencies({
      bower: false
    });
  }
...

生命周期

  1. initializing - Your initialization methods (checking current project state, getting configs, etc)
  2. prompting - Where you prompt users for options (where you’d call this.prompt())
  3. configuring - Saving configurations and configure the project (creating .editorconfig files and other metadata files)
  4. default - If the method name doesn’t match a priority, it will be pushed to this group.
  5. writing - Where you write the generator specific files (routes, controllers, etc)
  6. conflicts - Where conflicts are handled (used internally)
  7. install - Where installations are run (npm, bower)
  8. end - Called last, cleanup, say good bye, etc

NPM发布

注册https://www.npmjs.com/signup
邮箱验证

nrm切换官方源

nrm use npm
npm login 登陆npm

cd 项目根目录(generator-zztest-gulp)  
这里的package.json version字段一定要大于1.0.0

npm publish //推送到npm

发布成功

https://www.npmjs.com/package/generator-zztest-gulp

上一篇下一篇

猜你喜欢

热点阅读