react-component-analyzer/dist/cli.js

Analyze the component tree of react and displays it as a diagram in the browser. You can refer to the corresponding code from the diagram.

#!/usr/bin/env node
"use strict";var ee=Object.create;var L=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var ie=Object.getOwnPropertyNames;var oe=Object.getPrototypeOf,re=Object.prototype.hasOwnProperty;var se=(t,e,o,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of ie(e))!re.call(t,r)&&r!==o&&L(t,r,{get:()=>e[r],enumerable:!(s=te(e,r))||s.enumerable});return t};var y=(t,e,o)=>(o=t!=null?ee(oe(t)):{},se(e||!t||!t.__esModule?L(o,"default",{value:t,enumerable:!0}):o,t));var C=require("commander"),w=y(require("path")),K=y(require("picocolors"));var $=[".js",".jsx",".ts",".tsx"];var b="rca.config.js";var W=require("@typescript-eslint/typescript-estree"),S=y(require("path")),B=y(require("picocolors"));var i=require("@typescript-eslint/typescript-estree"),v=y(require("fs")),X=y(require("path")),V=y(require("picocolors"));var q=y(require("fs")),g=y(require("path")),z=t=>{let e={vscode:!0,alias:[],outputPath:""};return t&&(e.vscode=t.vscode===void 0?!0:t.vscode,e.alias=t.alias||[],e.outputPath=t.outputPath||""),e},M=(t,e,o)=>{for(let{find:s,replacement:r}of t)if(o.source.value.startsWith(s)){let n=o.source.value.replace(s,r);return g.default.isAbsolute(n)?o.source.value.replace(s,r):g.default.resolve(e,n)}return g.default.resolve(e,o.source.value)},k=async()=>{try{let t=q.default.readFileSync((g.default.resolve(),"vite.config.ts")),e=require.resolve.paths?.("vite")||[],o=require.resolve("vite",{paths:[...e]}),r=await require(o).resolveConfig(t,"serve");return r.resolve.alias?r.resolve.alias.filter(n=>typeof n.find=="string"):r.resolve.alias}catch{return}};var I={line:1,column:1},O=new Map,_=(t,e,o,s,r)=>{try{let{fileName:n}=s,a;if(O.has(n))a=O.get(n);else{let c=v.default.readFileSync(n).toString(),x=(0,i.parse)(c,{loc:!0,jsx:!0});O.set(n,{code:c,ast:x}),a={code:c,ast:x}}if(!a)return;let{code:p,ast:f}=a;s.code=p;let m=pe(f.body);m&&s.astType===i.AST_NODE_TYPES.ImportDefaultSpecifier&&(s.exportName=m);for(let c of f.body)c.type.startsWith("TS")||ne(t,e,s,r,c,p);for(let c of s.children)o!==c.fileName&&c.exists&&s.fileName!==c.fileName&&_(!1,e,n,c,X.default.dirname(c.fileName))}catch(n){n instanceof Error&&console.log(V.default.red(n.message)),s.exists=!1}},ne=(t,e,o,s,r,n)=>{if(r.type===i.AST_NODE_TYPES.ImportDeclaration)le(e,o,s,r);else if(r.type===i.AST_NODE_TYPES.FunctionDeclaration)(o.astType!==i.AST_NODE_TYPES.ImportDefaultSpecifier||o.astType===i.AST_NODE_TYPES.ImportDefaultSpecifier&&r.id&&r.id.name===o.id)&&E(o,r.body);else if(r.type===i.AST_NODE_TYPES.ExpressionStatement){if(r.expression.type===i.AST_NODE_TYPES.CallExpression||r.expression.type===i.AST_NODE_TYPES.NewExpression)for(let a of r.expression.arguments)l(o,a)}else if(r.type===i.AST_NODE_TYPES.VariableDeclaration){for(let a of r.declarations)if(a.id.type===i.AST_NODE_TYPES.Identifier){let{name:p}=a.id;a.init&&(a.init.type===i.AST_NODE_TYPES.ArrowFunctionExpression||a.init.type===i.AST_NODE_TYPES.FunctionExpression)&&(a.init.body.type===i.AST_NODE_TYPES.JSXElement?o.children.push({id:p,code:n,title:p,astType:i.AST_NODE_TYPES.VariableDeclarator,fileName:o.fileName,exportName:p,coordinates:[0,0],children:[],exists:!1,loc:a.id.loc}):a.id.name===o.exportName?(o.loc=a.id.loc,l(o,a.init)):t&&l(o,a.init))}}else r.type===i.AST_NODE_TYPES.ExportNamedDeclaration&&r.declaration&&r.declaration.type===i.AST_NODE_TYPES.VariableDeclaration&&ae(o,r.declaration)},ae=(t,e)=>{if(e.type===i.AST_NODE_TYPES.VariableDeclaration)for(let o of e.declarations)o.id.type===i.AST_NODE_TYPES.Identifier&&(o.id.name===t.exportName||t.exportName==="")&&(t.loc=o.id.loc,o.init&&l(t,o.init))},le=(t,e,o,s)=>{if(s.importKind==="type")return;let r=M(t,o,s),n=X.default.basename(r),{filePath:a,existsFile:p}=fe(r),f=null;if(!!p)for(let m of s.specifiers){let{type:c,local:u}=m;f=null,c===i.AST_NODE_TYPES.ImportDefaultSpecifier&&u.type===i.AST_NODE_TYPES.Identifier?f=n:(c===i.AST_NODE_TYPES.ImportSpecifier&&m.importKind==="value"||c===i.AST_NODE_TYPES.ImportNamespaceSpecifier&&u.type===i.AST_NODE_TYPES.Identifier)&&(f=u.name),f&&e.children.push({id:f,code:"",title:f,astType:c,fileName:a,exportName:u.name,coordinates:[0,0],children:[],exists:!1,loc:{start:{...I},end:{...I}}})}},l=(t,e)=>{if(!!e){if(e.type===i.AST_NODE_TYPES.JSXElement)A(t,e),ce(t,e.openingElement,t.children),A(t,e);else if(e.type===i.AST_NODE_TYPES.JSXFragment)A(t,e);else if(e.type===i.AST_NODE_TYPES.SpreadElement)l(t,e.argument);else if(e.type===i.AST_NODE_TYPES.ArrayExpression)for(let o of e.elements)l(t,o);else if(e.type===i.AST_NODE_TYPES.AssignmentExpression||e.type===i.AST_NODE_TYPES.LogicalExpression)l(t,e.right);else if(e.type===i.AST_NODE_TYPES.AwaitExpression)l(t,e.argument);else if(e.type===i.AST_NODE_TYPES.CallExpression)for(let o of e.arguments)l(t,o);else if(e.type===i.AST_NODE_TYPES.ChainExpression)l(t,e.expression);else if(e.type!==i.AST_NODE_TYPES.ClassExpression)if(e.type===i.AST_NODE_TYPES.ImportExpression)e.attributes&&l(t,e.attributes);else if(e.type===i.AST_NODE_TYPES.MemberExpression)l(t,e.object);else if(e.type===i.AST_NODE_TYPES.NewExpression){for(let o of e.arguments)l(t,o);l(t,e.callee)}else if(e.type===i.AST_NODE_TYPES.ObjectExpression){for(let o of e.properties)if(o.type===i.AST_NODE_TYPES.MethodDefinition){if(o.decorators)for(let s of o.decorators)l(t,s.expression);o.value.type===i.AST_NODE_TYPES.FunctionExpression&&l(t,o.value)}}else if(e.type===i.AST_NODE_TYPES.SequenceExpression)for(let o of e.expressions)l(t,o);else if(e.type===i.AST_NODE_TYPES.TaggedTemplateExpression)for(let o of e.quasi.expressions)l(t,o);else if(e.type===i.AST_NODE_TYPES.TemplateLiteral)for(let o of e.expressions)l(t,o);else e.type===i.AST_NODE_TYPES.YieldExpression?e.argument&&l(t,e.argument):e.type===i.AST_NODE_TYPES.ConditionalExpression?(l(t,e.alternate),l(t,e.consequent)):e.type===i.AST_NODE_TYPES.ArrowFunctionExpression||e.type===i.AST_NODE_TYPES.FunctionExpression?e.body.type===i.AST_NODE_TYPES.BlockStatement?E(t,e.body):l(t,e.body):e.type===i.AST_NODE_TYPES.ArrayPattern||e.type===i.AST_NODE_TYPES.ObjectPattern||e.type===i.AST_NODE_TYPES.BinaryExpression||e.type===i.AST_NODE_TYPES.Identifier||e.type===i.AST_NODE_TYPES.JSXEmptyExpression||e.type===i.AST_NODE_TYPES.MetaProperty||e.type===i.AST_NODE_TYPES.Super||e.type===i.AST_NODE_TYPES.ThisExpression||e.type===i.AST_NODE_TYPES.TSAsExpression||e.type===i.AST_NODE_TYPES.TSNonNullExpression||e.type===i.AST_NODE_TYPES.TSTypeAssertion||e.type===i.AST_NODE_TYPES.UnaryExpression||(e.type,i.AST_NODE_TYPES.UpdateExpression)}},E=(t,e)=>{if(!!e)for(let o of e.body)d(t,o)},d=(t,e)=>{if(!!e){if(e.type===i.AST_NODE_TYPES.BlockStatement)E(t,e);else if(e.type!==i.AST_NODE_TYPES.ClassDeclaration)if(e.type===i.AST_NODE_TYPES.DoWhileStatement)d(t,e.body);else if(e.type===i.AST_NODE_TYPES.ExpressionStatement)l(t,e.expression);else if(e.type===i.AST_NODE_TYPES.ForInStatement)d(t,e.body);else if(e.type===i.AST_NODE_TYPES.ForOfStatement)d(t,e.body);else if(e.type===i.AST_NODE_TYPES.ForStatement)d(t,e.body);else if(e.type===i.AST_NODE_TYPES.FunctionDeclaration)E(t,e.body);else if(e.type===i.AST_NODE_TYPES.IfStatement)e.alternate&&d(t,e.alternate),d(t,e.consequent);else if(e.type===i.AST_NODE_TYPES.ReturnStatement)e.argument&&l(t,e.argument);else if(e.type===i.AST_NODE_TYPES.SwitchStatement)for(let o of e.cases)for(let s of o.consequent)d(t,s);else if(e.type===i.AST_NODE_TYPES.TryStatement)E(t,e.block),e.finalizer&&E(t,e.finalizer);else if(e.type===i.AST_NODE_TYPES.VariableDeclaration)for(let o of e.declarations)o.init&&l(t,o.init);else e.type===i.AST_NODE_TYPES.WhileStatement||e.type===i.AST_NODE_TYPES.WithStatement?d(t,e.body):e.type===i.AST_NODE_TYPES.DebuggerStatement||e.type===i.AST_NODE_TYPES.ContinueStatement||e.type===i.AST_NODE_TYPES.ExportAllDeclaration||e.type===i.AST_NODE_TYPES.ExportDefaultDeclaration||e.type===i.AST_NODE_TYPES.ExportNamedDeclaration||e.type===i.AST_NODE_TYPES.LabeledStatement||e.type===i.AST_NODE_TYPES.BreakStatement||e.type===i.AST_NODE_TYPES.ThrowStatement||e.type===i.AST_NODE_TYPES.TSDeclareFunction||e.type===i.AST_NODE_TYPES.TSEnumDeclaration||e.type===i.AST_NODE_TYPES.TSExportAssignment||e.type===i.AST_NODE_TYPES.TSImportEqualsDeclaration||e.type===i.AST_NODE_TYPES.TSInterfaceDeclaration||e.type===i.AST_NODE_TYPES.TSModuleDeclaration||(e.type,i.AST_NODE_TYPES.TSNamespaceExportDeclaration)}},A=(t,e)=>{for(let o of e.children)o.type===i.AST_NODE_TYPES.JSXElement||o.type===i.AST_NODE_TYPES.JSXFragment?l(t,o):o.type===i.AST_NODE_TYPES.JSXExpressionContainer||o.type===i.AST_NODE_TYPES.JSXSpreadChild?l(t,o.expression):o.type===i.AST_NODE_TYPES.JSXEmptyExpression||o.type==i.AST_NODE_TYPES.JSXText},ce=(t,e,o)=>{if(e.name.type===i.AST_NODE_TYPES.JSXIdentifier){let s=e.name.name,r=o.find(n=>n.exportName===s);if(!r)return;r.exists=!0,t.exists=!0}else if(e.name.type===i.AST_NODE_TYPES.JSXNamespacedName){if(e.name.name.type===i.AST_NODE_TYPES.JSXIdentifier){let s=e.name.name.name,r=o.find(n=>n.exportName===s);if(!r)return;r.exists=!0,t.exists=!0}}else if(e.name.type===i.AST_NODE_TYPES.JSXMemberExpression&&e.name.object.type===i.AST_NODE_TYPES.JSXIdentifier){let s=e.name.object.name,r=o.findIndex(a=>a.exportName===s);if(r===-1)return;let n=o[r];if(e.name.property.type===i.AST_NODE_TYPES.JSXIdentifier){n.exists=!1;let{name:a}=e.name.property,p={id:a,code:"",astType:i.AST_NODE_TYPES.ImportSpecifier,title:a,fileName:n.fileName,exportName:a,coordinates:[0,0],children:[],exists:!0,loc:{start:{...I},end:{...I}}};o.splice(r,0,p),t.exists=!0}}},fe=t=>{for(let e of $){if(v.default.existsSync(`${t}${e}`))return{filePath:`${t}${e}`,existsFile:!0};if(v.default.existsSync(`${t}/index${e}`))return{filePath:`${t}/index${e}`,existsFile:!0}}return{filePath:"",existsFile:!1}},pe=t=>{let e=t.find(({type:o})=>o===i.AST_NODE_TYPES.ExportDefaultDeclaration);if(!!e&&e.type===i.AST_NODE_TYPES.ExportDefaultDeclaration){let{type:o}=e.declaration;if(o===i.AST_NODE_TYPES.Identifier){let{name:s}=e.declaration;return s}}};var D=require("fs"),h=y(require("path")),j=y(require("picocolors")),H=(t,e)=>{let o=e.outputPath?e.outputPath:h.default.resolve(h.default.resolve(),"./stats.html"),s=(0,D.readFileSync)(h.default.resolve(__dirname,"./viewer.js")).toString(),r=(0,D.readFileSync)(h.default.resolve(__dirname,"./viewer.css")).toString();(0,D.writeFileSync)(o,ue(t,s,r)),console.log(j.default.green(`Success. ${o}`))},ye=t=>`const diagram =${JSON.stringify(t)}`,ue=(t,e,o)=>`<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <title>react component analyzer</title>
    <style>${o}</style>
    <script>
    ${ye(t)}
    <\/script>
  </head>
  <body>
    <div id="root" />
    <script>${e}<\/script>
  </body>
</html>`;var P=0,N=0,T={line:1,column:1},Y=async(t,e)=>{try{S.default.isAbsolute(t)||(t=S.default.resolve(S.default.resolve(),t));let o=await k();o&&(e.alias||(e.alias=o));let s=z(e),r=S.default.basename(t).replace(/\.[^/.]+$/,""),n={id:r,code:"",title:r,astType:W.AST_NODE_TYPES.ImportSpecifier,fileName:t,disableDrag:!1,exportName:"",coordinates:[0,0],children:[],exists:!0,loc:{start:{...T},end:{...T}}};_(!0,s.alias,t,n,S.default.dirname(t));let a=20,p=20,{id:f,content:m,code:c}=n,u=[{id:f,content:m,coordinates:[a,p],data:{code:c,title:f,fileName:s.vscode?t:"",loc:{start:{...T},end:{...T}}}}],x=[];U(s,n,u,x,a,p+100);let F={vscode:s.vscode?s.vscode:!1,width:P+100,height:N+100,schema:{nodes:u,links:x}};H(F,s)}catch(o){o instanceof Error&&console.log(B.default.red(o.message))}finally{process.exit()}},U=(t,e,o,s,r,n)=>{let{children:a}=e;for(let p of a){let{id:f,code:m,content:c,disableDrag:u,exists:x,loc:F,fileName:Q}=p;x&&(o.find(Z=>Z.id===f)||(r+=100,P<r&&(P=r),N<n&&(N=n),o.push({id:f,content:c,disableDrag:u,coordinates:[r,n],data:{code:m,title:f,fileName:t.vscode?Q:"",loc:F}}),r=U(t,p,o,s,r,n+100)),s.push({input:`${e.id}-output`,output:`${f}-input`}))}return r};C.program.parse(process.argv);if(C.program.args[0]){let t=null;try{t=require(w.default.resolve(w.default.resolve(),b))}catch{console.log(K.default.yellow(`The options can be specified by preparing '${b}'.`))}Y(C.program.args[0],t||{})}