项目中的权限按钮

React项目中需要统计记录权限按钮

• 前端小菜B,个人记录，各位大佬随便看看，不喜勿喷
• 使用node.js去遍历文件记录项目中各个权限按钮
• 存在问题：写入是异步操作，写入顺序并不是按照遍历文件的顺序
• 临时使用的并没有对代码进行优化，勿喷

权限按钮

// 组件使用
<AuthButton buttonId="id" ...params >
    这是一个权限按钮
</AuthButton>

// 组件内部{authArray.includes()}
 return (
     {authArray.includes(props.buttonId) && (
         <Button ...props>
             {props.children}
         </Button>
     )}
 )

该文件放在项目开发目录下通过node执行就可以读取项目中的权限按钮以及ID

const fs = require("fs");
// 读取当前目录
let fileArr = fs.readdirSync("./");

/**
 * @desc 递归遍历文件目录
 * @param {*} arr 数组
 * @param {*} dir 路径
 */
function searchFile(arr, dir = ".") {
  // 遍历
  arr.forEach(item => {
    fs.stat(`${dir}/${item}`, (err, stats) => {
      if (stats.isDirectory()) {
        fs.readdir(item, (err, arr2) => {
          // console.log("dir-item", dir, item);
          if (err) throw err;
          searchFile(arr2, `${dir}/${item}`);
        });
      } else {
        writeToMd(`${dir}/${item}`);
      }
    });
  });
}

/**
 * @desc 读取文件并匹配文件中的AuthButton写入./buttonInfo.md文件
 * 写入格式： ./src/demo/index.page - demoId - 这是demo按钮
 */
function writeToMd(fileUrl) {
  fs.readFile(fileUrl, "utf-8", (err, content) => {
    const temp = content.replace(/\n|\r/g, "");
    const btnCode = temp.match(/(?<=\<AuthButton).*?(?=(\/AuthButton|$))/g);

    if (Array.isArray(btnCode)) {
      btnCode.forEach(item => {
        let btnId = item.match(/(?<=buttonId=').*?(?=('|$))/);
        if (btnId) btnId = btnId[0];

        console.log("btnId", btnId);
        const noSpace = item.replace(/\s|\n|\r/, "");
        let btnInnerHtml = noSpace.match(/(?<=\>).*?(?=(<))/);
        if (btnInnerHtml) btnInnerHtml = btnInnerHtml[0].replace(/</, "");

        const text = `${fileUrl} -  ${btnId} - ${btnInnerHtml} \n`;
        fs.appendFile("./buttonInfo.md", text, err => {
          // console.log(err);
        });
      });
    }
    //
  });
}
searchFile(fileArr);

代码并不完整，只是记录下当时解决问题的思路！勿喷 (时隔几个月的回顾，大致思路是这样，如有错误欢迎指正)