generateComponent.js 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. // generateComponent.js 文件,放置生成组件的代码
  2. const chalk = require("chalk");
  3. const path = require("path");
  4. const fs = require("fs");
  5. const resolve = (...file) => path.resolve(__dirname, ...file);
  6. // const log = message => console.log(chalk.green(`${message}`));
  7. // const successLog = message => console.log(chalk.blue(`${message}`));
  8. const log = message => console.log(chalk.yellow(`${message}`));
  9. const successLog = message => console.log(chalk.green(`${message}`));
  10. const errorLog = error => console.log(chalk.red(`${error}`));
  11. const { vueTemplate, entryTemplate } = require("./template");
  12. const generateFile = (path, data) => {
  13. if (fs.existsSync(path)) {
  14. errorLog(`${path}文件已存在`);
  15. return;
  16. }
  17. return new Promise((resolve, reject) => {
  18. fs.writeFile(path, data, "utf8", err => {
  19. if (err) {
  20. errorLog(err.message);
  21. reject(err);
  22. } else {
  23. resolve(true);
  24. }
  25. });
  26. });
  27. };
  28. log("请输入要生成的组件名称、如需生成全局组件,请加 global/ 前缀");
  29. let componentName = "";
  30. process.stdin.on("data", async chunk => {
  31. const inputName = String(chunk)
  32. .trim()
  33. .toString();
  34. // 组件目录路径
  35. const componentDirectory = resolve("../src/components", inputName);
  36. // vue组件路径
  37. const componentVueName = resolve(componentDirectory, "main.vue");
  38. // 入口文件路径
  39. const entryComponentName = resolve(componentDirectory, "index.js");
  40. const hasComponentDirectory = fs.existsSync(componentDirectory);
  41. if (hasComponentDirectory) {
  42. errorLog(`${inputName}组件目录已存在,请重新输入`);
  43. return;
  44. } else {
  45. log(`正在生成 component 目录 ${componentDirectory}`);
  46. await dotExistDirectoryCreate(componentDirectory);
  47. // fs.mkdirSync(componentDirectory);
  48. }
  49. try {
  50. if (inputName.includes("/")) {
  51. const inputArr = inputName.split("/");
  52. componentName = inputArr[inputArr.length - 1];
  53. } else {
  54. componentName = inputName;
  55. }
  56. log(`正在生成 vue 文件 ${componentVueName}`);
  57. await generateFile(componentVueName, vueTemplate(componentName));
  58. log(`正在生成 entry 文件 ${entryComponentName}`);
  59. await generateFile(entryComponentName, entryTemplate);
  60. successLog("生成成功");
  61. } catch (e) {
  62. errorLog(e.message);
  63. }
  64. process.stdin.emit("end");
  65. });
  66. process.stdin.on("end", () => {
  67. log("exit");
  68. process.exit();
  69. });
  70. function dotExistDirectoryCreate(directory) {
  71. return new Promise(resolve => {
  72. mkdirs(directory, function() {
  73. resolve(true);
  74. });
  75. });
  76. }
  77. // 递归创建目录
  78. function mkdirs(directory, callback) {
  79. var exists = fs.existsSync(directory);
  80. if (exists) {
  81. callback();
  82. } else {
  83. mkdirs(path.dirname(directory), function() {
  84. fs.mkdirSync(directory);
  85. callback();
  86. });
  87. }
  88. }