gravel-cli/src/init.js

A generator to start a Vue-based project quickly.

/*
 * @Author: your name
 * @Date: 2021-06-03 10:39:16
 * @LastEditTime: 2021-06-07 11:20:10
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: /gravel-cli/src/init.js
 */
'use strict'
const exec = require('child_process').exec
const co = require('co')
const prompt = require('co-prompt')
const config = require('../template')
const chalk = require('chalk')
const ora = require('ora');
const boxen = require('boxen');
const inquirer = require('inquirer');
const pkg = require('../package.json');

const rm = require('rimraf').sync;
const BOXEN_OPTS = {
  padding: 1,
  margin: 1,
  align: 'center',
  borderColor: 'yellow',
  borderStyle: 'round'
};

module.exports = () => {
  function _initializing() {
    const version = `(v${pkg.version})`;
    const messages = [];
    messages.push(
      `💁 Welcome to use gravel-cli ${chalk.grey(version)}   `
    );
    messages.push(
      chalk.yellow('You can create a Vue-based frontend environment.')
    );
    messages.push(
      chalk.grey('https://demo.jsxhyj.cn:7300/xingxw/gravel-cli.git')
    );
    messages.push(
      chalk.grey('https://www.npmjs.com/package/gravel-cli')
    )
    console.log(
      boxen(messages.join('\n\n'), {
        ...BOXEN_OPTS,
        ...{
          borderColor: 'green',
          borderStyle: 'doubleSingle'
        }
      })
    );
    _printEnvInfo();
  }

  function _printEnvInfo() {
    console.log(chalk.grey('Environment Info:'))
    console.log(chalk.grey(`当前Node环境\t${process.version}`));
    console.log(chalk.grey(`当前目录\t${process.cwd()}`));
  }

  function _askForTemplate() {
    const promptList = [
      // 具体交互内容
      {
        type: 'list',
        message: 'Please choose the template for your project:',
        name: 'template',
        choices: Object.keys(config.tpl),
        filter: function (val) {
          return val;
        }
      }
    ];

    return inquirer.prompt(promptList).then(answers => {
      // 返回的结果
      return answers.template;
    })
  }

  function _downloadTemplate(tplName, projectName) {
    let gitUrl, branch;
    if (!config.tpl[tplName] || !config.tpl[tplName].url) {
      console.log(chalk.red('\n × Template does not exit!'))
      process.exit()
    }
    gitUrl = config.tpl[tplName].url
    branch = config.tpl[tplName].branch

    // git命令，远程拉取项目并自定义项目名
    let cmdStr = `git clone ${gitUrl} ${projectName} && cd ${projectName} && git checkout ${branch}`

    console.log(chalk.white('\n Start generating...'))

    // const spinner = ora(`Download the template from ${gitUrl}...`).start();
    const spinner = ora(`Download the template...`).start();

    exec(cmdStr, (error, stdout, stderr) => {
      if (error) {
        console.error(chalk.bgRed('\n ERROR'), chalk.red(stderr));
        process.exit()
      }
      spinner.stopAndPersist({
        symbol: chalk.green(' √'),
        text: `Finish downloading the template`
        // text: `Finish downloading the template from ${gitUrl}`
      });

      spinner.start('Clean tmp files and folders...');
      rm(projectName + '/.git');
      spinner.stopAndPersist({
        symbol: chalk.green(' √'),
        text: `Finish cleaning tmp files and folders`
      });


      console.log(chalk.green('\n √ Generation completed!'))
      console.log(`\n cd ${projectName} && npm install \n`)
      _end(projectName);
      process.exit()
    })
  }

  function _end(dirName) {
    const dir = chalk.green(dirName);
    const messages = [];
    messages.push(
      `🎊 Create project successfully!`
    );
    messages.push(
      `Now you can enter ${dir} and run command:`
    );
    messages.push(
      chalk.green(`npm install`)
    );

    console.log(
      boxen(messages.join('\n\n'), {
        ...BOXEN_OPTS,
        ...{
          borderColor: 'white'
        }
      })
    );
    console.log();
    console.log("📦 You guys ready? Let's get to work", chalk.green('✔'));
    console.log();
  }

  co(function* () {
    _initializing();

    // 用户选择模板
    let tplName = yield _askForTemplate();

    // 用户输入项目名
    let projectName = yield prompt('Project name: ')
    _downloadTemplate(tplName, projectName);
  })
}