mk-paas-cli/commands/newPage.js

MK PAAS CLI TOOL

const { prompt } = require("inquirer");
const fs = require("fs-extra");
const path = require("path");
const chalk = require("chalk");
const ora = require("ora");

const suffix = ".tsx";

const question = [
  {
    type: "list",
    name: "createFolder",
    message: "是否要创建文件夹？",
    choices: ["Y", "N"],
    default: "Y",
  },
  {
    type: "input",
    name: "pageName",
    message: "生成页面名称:",
    validate(val) {
      if (val !== "") {
        return true;
      }
      return "页面名称是必填的!";
    },
  },
  {
    type: "input",
    name: "place",
    message: "生成页面地址:",
    default: "./",
  },
];

module.exports = prompt(question).then(({ createFolder, pageName, place }) => {
  const startAt = new Date().getTime();
  const cwd = process.cwd();
  const targetDir = path.join(cwd, place || "./", pageName);
  const spinner = ora();
  let createTsxFile = null;
  let createScssFile = `${targetDir}/index.scss`;
  if (createFolder === "Y") {
    if (!fs.existsSync(path.join(cwd, place || "./"))) {
      console.log(
        chalk.red(
          `😵 不存在${path.join(cwd, place || "./")}路径，将退出生成页面！`
        )
      );
      process.exit(1);
    }
    // 确认目标目录可用
    if (fs.existsSync(targetDir)) {
      console.log(chalk.red(`😵 目录 ${place} 已存在，将退出生成页面！`));
      process.exit(1);
    }
    createTsxFile = `${targetDir}/index${suffix}`;
  } else {
    // 确认目录存在
    if (!fs.existsSync(path.join(cwd, place))) {
      console.log(chalk.red(`😵 目录 ${place} 不存在，将退出生成页面！`));
      process.exit(1);
    }
    createTsxFile = `${targetDir}${suffix}`;
  }
  spinner.start(`${targetDir}/index.tsx页面正在生成中，请稍后...`);
  if (createFolder === "Y") {
    fs.mkdirSync(targetDir);
  }
  fs.writeFileSync(createTsxFile, generateTemplate(pageName));
  fs.writeFileSync(createScssFile, generateScssFile(pageName));
  spinner.stop();
  console.log(chalk.green(`🎉 ${createTsxFile}页面生成成功！`));
  const elapsed = new Date().getTime() - startAt;
  console.log(`✨ 共耗时 ${(elapsed / 1000).toFixed(2)} 秒`);
});

function generateTemplate(filename) {
  return `
  import React from 'react';\n
  import './index.scss'; \n
  const PREFIX_CLS = '${filename}';
  function ${titleCase(filename)}() {
    return <div className={PREFIX_CLS}>测试页面</div>;
  }
  export default ${titleCase(filename)};
  `;
}

function generateScssFile(filename) {
  return `.${filename} {
  width: 100%;
  height: 100%;
}
  `;
}

function titleCase(str) {
  newStr = str.slice(0, 1).toUpperCase() + str.slice(1).toLowerCase();
  return newStr;
}