美文网首页
自定义yeoman generator

自定义yeoman generator

作者: 钱学敏 | 来源:发表于2018-04-25 23:50 被阅读0次

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小时内才允许撤销发布的包。

相关文章

网友评论

      本文标题:自定义yeoman generator

      本文链接:https://www.haomeiwen.com/subject/basulftx.html