https://segmentfault.com/a/1190000010665132
https://www.jianshu.com/p/9f3e6bcdb274
初始化
安装nodejs
npm install -g yo
npm install -g generator-generator
yo generator //初始化项目模版
项目名称自己设置,必须是以generator-开头,协议选择MIT
初始化项目
配置
配置generators/app/templates/
是默认存放文件的目录,把所有模版文件放在这个目录下
/generators/app/index.js
是Yeoman的配置文件,定义如何生成我们的脚手架
///generators/app/index.js
'use strict';
const Generator = require('yeoman-generator');
const chalk = require('chalk');
const yosay = require('yosay');
const path = require('path');
const mkdirp = require('mkdirp');
module.exports = class extends Generator {
//初始化方法,用于获取项目状态、配置等
initializing() {
this.props = {};
}
// 信息采集 获取用户输入
prompting() {
this.log(
yosay(`Welcome to the remarkable ${chalk.red('generator-qxm-mobile')} generator!`)
);
const prompts = [{
type: 'input',
name: 'projectName',
message: '项目名称',
default: 'my-project'
}];
return this.prompt(prompts).then(props => {
// To access props later use this.props.someAnswer;
this.props = props;
});
}
defaults() {
if (path.basename(this.destinationPath()) !== this.props.projectName) {
this.log(
'Your generator must be inside a folder named ' + this.props.projectName + '\n' +
'I\'ll automatically create this folder.'
);
// 引用mkdirp模块创建文件夹 ,this.destinationRoot 设置要创建的工程的根目录。
mkdirp(this.props.projectName);
this.destinationRoot(this.destinationPath(this.props.projectName));
}
}
//执行文件写操作,即项目文件写入文件系统中
writing() {
this.fs.copy(
this.templatePath('src'),
this.destinationPath('src')
);
}
//安装依赖
install() {
// this.installDependencies();
}
// 最后执行,可清楚临时文件等
end() {
this.log(
chalk.green('项目构建成功, 请 `npm install` 安装依赖, 然后执行 `gulp` 运行')
);
}
};
测试
由于我们在本地开发,并不知道用起来怎么样,所以可以使用 npm link
命令,相当于在全局安装了此脚手架,然后在新文件夹中执行yo,选择脚手架,便可以测试
yo qxm-mobile
测试
发布
generator-qxm-mobile/package.json
中的name
要在https://www.npmjs.com/没被创建过,才可以发布。
发布需要一个npm
的账号,如果没有使用npm adduser
创建;
如果已有账号,运行npm login
登陆。
在项目根目录下,运行npm publish
就可以发布了。如果更新后重新发布,注意修改根目录下的package.json
文件中的版本号。
使用npm unpublish 包名
命令可以撤销发布,只有在发包的24小时内才允许撤销发布的包。
网友评论