yeoman通用脚手架
说明
-
使用官方生成器生成项目模板;
-
使用官方工具开发自定义项目模板;
-
流程:将生成器放到全局npm,yo [name] 执行;
全局安装 yeoman
npm i yo -g
1、安装模板生成器(按需)
# webapp模板
npm i generator-webapp -g
# node 项目模板
npm i generator-node -g
# 生成
yo webapp
yo node
2、开发自定义模板生成器
初始化开发项目
# 项目根目录:generator-mycli
|generator-mycli
|- generators/ ............................................ 生成器目录
| |_ app / ............................................ 默认生成器目录
| | index.js .......................................... 默认生成器实现
| | templates ......................................... 默认模板文件夹
|_ package.json ........................................... 模块吧配置文件
安装 yeoman开发自定义模板生成器的工具
npm i yeoman-generator
编写index.js和创建模板
# 编写完成后
# 将本地自定义生成器链接到本地npm全局仓库
cd generator-mycli
npm link
npm unlink
# 或者将生成器发布到外网npm仓库,使用npm全局下载,同官方模板一样
npm config set registry https://registry.npmjs.org/
npm login
npm publish
# 声明开放
npm publish --access=public
# 运行
yo mycli
// 实例
const Generator = require('yeoman-generator')
module.exports = class extends Generator {
prompting() {
return this.prompt([
{
type: 'input',
name: 'title',
message: 'Project name:',
default: this.appname,
},
]).then((answers) => {
this.answers = answers
})
}
writing() {
this.fs.copyTpl(
this.templatePath('index.html'),
this.destinationPath('index.html'),
this.answers
)
}
}