hermex 0.0.1-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE.md +21 -0
- package/README.md +218 -0
- package/dist/cli.js +2696 -0
- package/dist/cli.js.map +1 -0
- package/package.json +81 -0
package/LICENSE.md
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2025 Gal Levy
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,218 @@
|
|
|
1
|
+
# React Component Usage Analyzer
|
|
2
|
+
|
|
3
|
+
A powerful SWC-based tool for analyzing React component usage patterns across codebases. Understand how UI library components are used, track dependencies with exact versions, and generate comprehensive reports.
|
|
4
|
+
|
|
5
|
+
## ✅ Status: Production Ready
|
|
6
|
+
|
|
7
|
+
- ✅ **TypeScript** - Migrated to TypeScript with src/ structure
|
|
8
|
+
- ✅ Functional programming architecture
|
|
9
|
+
- ✅ Cross-platform support (Windows/Unix)
|
|
10
|
+
- ✅ Lockfile parsing (npm, yarn, pnpm)
|
|
11
|
+
- ✅ Version tracking from lockfiles
|
|
12
|
+
- ✅ GitHub repository analysis
|
|
13
|
+
- ✅ Multiple output formats
|
|
14
|
+
- ✅ Built with **tsup** for optimized distribution
|
|
15
|
+
|
|
16
|
+
## 🚀 Quick Start
|
|
17
|
+
|
|
18
|
+
```bash
|
|
19
|
+
# Install dependencies
|
|
20
|
+
pnpm install
|
|
21
|
+
|
|
22
|
+
# Build the project (TypeScript -> JavaScript)
|
|
23
|
+
pnpm run build
|
|
24
|
+
|
|
25
|
+
# Analyze local files
|
|
26
|
+
node dist/cli.js analyze "src/**/*.tsx" -l @mui/material
|
|
27
|
+
|
|
28
|
+
# Or use the npm scripts
|
|
29
|
+
pnpm run test-cli
|
|
30
|
+
|
|
31
|
+
# Analyze GitHub repository
|
|
32
|
+
node dist/cli.js github owner/repo -l @mui/material
|
|
33
|
+
|
|
34
|
+
# Generate reports with versions
|
|
35
|
+
node dist/cli.js github owner/repo -l @mui/material -f both -o reports-outputs/analysis.json
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
## 🛠️ Development
|
|
39
|
+
|
|
40
|
+
```bash
|
|
41
|
+
# Build in watch mode
|
|
42
|
+
pnpm run dev
|
|
43
|
+
|
|
44
|
+
# Run tests
|
|
45
|
+
pnpm test
|
|
46
|
+
|
|
47
|
+
# Clean build artifacts
|
|
48
|
+
pnpm run clean
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
## 📊 Key Features
|
|
52
|
+
|
|
53
|
+
- **Version Tracking**: Components reported with exact package versions from lockfiles
|
|
54
|
+
- **Multi-Lockfile Support**: Parses package-lock.json, yarn.lock, and pnpm-lock.yaml
|
|
55
|
+
- **Pattern Detection**: Identifies 16+ React usage patterns (imports, lazy loading, HOCs, etc.)
|
|
56
|
+
- **GitHub Analysis**: Clone and analyze multiple repositories
|
|
57
|
+
- **Flexible Output**: Console, JSON, and table formats
|
|
58
|
+
- **Complexity Scoring**: Categorizes usage patterns by complexity
|
|
59
|
+
|
|
60
|
+
## 📋 Available Commands
|
|
61
|
+
|
|
62
|
+
| Command | Description |
|
|
63
|
+
|---------|-------------|
|
|
64
|
+
| `analyze` | Analyze local files with detailed patterns |
|
|
65
|
+
| `summary` | Quick component usage overview |
|
|
66
|
+
| `stats` | Detailed statistics with charts |
|
|
67
|
+
| `patterns` | List all detected usage patterns |
|
|
68
|
+
| `table` | Component and import tables |
|
|
69
|
+
| `compare` | Compare usage across libraries |
|
|
70
|
+
| `github` | Analyze GitHub repositories |
|
|
71
|
+
|
|
72
|
+
## 🎯 Example Output
|
|
73
|
+
|
|
74
|
+
Components are reported with exact versions:
|
|
75
|
+
|
|
76
|
+
```
|
|
77
|
+
🏆 TOP COMPONENTS:
|
|
78
|
+
🥇 1. Button from @mui/material@5.14.0: 45 uses
|
|
79
|
+
🥈 2. TextField from @mui/material@5.14.0: 32 uses
|
|
80
|
+
🥉 3. Grid from @mui/material@5.14.0: 28 uses
|
|
81
|
+
```
|
|
82
|
+
|
|
83
|
+
## 📚 Documentation
|
|
84
|
+
|
|
85
|
+
- [CLI Guide](./docs/CLI_GUIDE.md) - Complete command reference
|
|
86
|
+
- [GitHub Guide](./docs/GITHUB_GUIDE.md) - Repository analysis guide
|
|
87
|
+
- [Usage Patterns](./docs/USAGE_PATTERNS_GUIDE.md) - Pattern detection details
|
|
88
|
+
- [Demo Examples](./docs/DEMO.md) - Live examples and use cases
|
|
89
|
+
- [Test Results](./docs/TEST_RESULTS.md) - Validation and testing
|
|
90
|
+
|
|
91
|
+
## 🏗️ Project Structure
|
|
92
|
+
|
|
93
|
+
```
|
|
94
|
+
swc-parser/
|
|
95
|
+
├── cli.js # Main CLI entry point
|
|
96
|
+
├── parser.js # SWC AST parser
|
|
97
|
+
├── analyze-usage.js # Pattern analysis
|
|
98
|
+
├── github-analysis.js # GitHub repository analysis
|
|
99
|
+
├── utils/
|
|
100
|
+
│ ├── formatters.js # Output formatting
|
|
101
|
+
│ ├── git-utils.js # Git operations
|
|
102
|
+
│ ├── lockfile-parser.js # Version extraction
|
|
103
|
+
│ └── file-utils.js # File operations
|
|
104
|
+
├── code-examples/ # Pattern examples (01-07)
|
|
105
|
+
├── docs/ # Documentation
|
|
106
|
+
└── reports-outputs/ # Generated reports
|
|
107
|
+
```
|
|
108
|
+
|
|
109
|
+
## 🔧 Usage Examples
|
|
110
|
+
|
|
111
|
+
### Local Analysis
|
|
112
|
+
```bash
|
|
113
|
+
# Basic analysis
|
|
114
|
+
node cli.js analyze "src/**/*.tsx" -l @mui/material
|
|
115
|
+
|
|
116
|
+
# With complexity scoring
|
|
117
|
+
node cli.js analyze "src/**/*.tsx" -l @mui/material --complexity
|
|
118
|
+
|
|
119
|
+
# JSON output only
|
|
120
|
+
node cli.js analyze "src/**/*.tsx" -l @mui/material -f json -o report.json
|
|
121
|
+
```
|
|
122
|
+
|
|
123
|
+
### GitHub Analysis
|
|
124
|
+
```bash
|
|
125
|
+
# Single repository
|
|
126
|
+
node cli.js github owner/repo -l @mui/material
|
|
127
|
+
|
|
128
|
+
# Multiple repositories from config
|
|
129
|
+
node cli.js github --config repos.json -l @design-system
|
|
130
|
+
|
|
131
|
+
# Keep cloned repos for inspection
|
|
132
|
+
node cli.js github owner/repo -l @mui/material --keep-repos
|
|
133
|
+
```
|
|
134
|
+
|
|
135
|
+
### Summary Commands
|
|
136
|
+
```bash
|
|
137
|
+
# Quick summary
|
|
138
|
+
node cli.js summary "src/**/*.tsx" -l @mui/material --top 10
|
|
139
|
+
|
|
140
|
+
# Statistics with charts
|
|
141
|
+
node cli.js stats "src/**/*.tsx" -l @mui/material --chart
|
|
142
|
+
|
|
143
|
+
# Component table
|
|
144
|
+
node cli.js table "src/**/*.tsx" -l @mui/material --props --top 20
|
|
145
|
+
```
|
|
146
|
+
|
|
147
|
+
## 🎨 Output Formats
|
|
148
|
+
|
|
149
|
+
### Console Output
|
|
150
|
+
- Color-coded with emojis
|
|
151
|
+
- Ranked component lists
|
|
152
|
+
- Complexity distributions
|
|
153
|
+
- Version information
|
|
154
|
+
|
|
155
|
+
### JSON Output
|
|
156
|
+
- Complete analysis data
|
|
157
|
+
- Version mapping
|
|
158
|
+
- Per-file breakdowns
|
|
159
|
+
- Machine-readable
|
|
160
|
+
|
|
161
|
+
### Table Output
|
|
162
|
+
- Structured data view
|
|
163
|
+
- Sortable columns
|
|
164
|
+
- Props analysis
|
|
165
|
+
- Import tracking
|
|
166
|
+
|
|
167
|
+
## 🔍 Pattern Detection
|
|
168
|
+
|
|
169
|
+
Detects 16+ usage patterns including:
|
|
170
|
+
- Direct imports and JSX usage
|
|
171
|
+
- Named imports with aliases
|
|
172
|
+
- Namespace imports
|
|
173
|
+
- Lazy loading and code splitting
|
|
174
|
+
- HOC patterns
|
|
175
|
+
- Dynamic imports
|
|
176
|
+
- Context usage
|
|
177
|
+
- Portal usage
|
|
178
|
+
|
|
179
|
+
See [Usage Patterns Guide](./docs/USAGE_PATTERNS_GUIDE.md) for details.
|
|
180
|
+
|
|
181
|
+
## 📦 Requirements
|
|
182
|
+
|
|
183
|
+
- Node.js 14+
|
|
184
|
+
- Git (for GitHub analysis)
|
|
185
|
+
|
|
186
|
+
## 🤝 Contributing
|
|
187
|
+
|
|
188
|
+
This is an internal tool. For bugs or feature requests, contact the team.
|
|
189
|
+
|
|
190
|
+
## 📄 License
|
|
191
|
+
|
|
192
|
+
Internal use only.
|
|
193
|
+
|
|
194
|
+
## 🎯 Use Cases
|
|
195
|
+
|
|
196
|
+
1. **Dependency Audits** - Understand library usage before migrations
|
|
197
|
+
2. **Version Tracking** - Know exactly which versions are in use
|
|
198
|
+
3. **Migration Planning** - Identify components that need updating
|
|
199
|
+
4. **Component Analytics** - Track most-used components
|
|
200
|
+
5. **Multi-Repo Analysis** - Analyze microservices/microfrontends
|
|
201
|
+
6. **Code Quality** - Identify complex usage patterns
|
|
202
|
+
|
|
203
|
+
## 🚀 Getting Started
|
|
204
|
+
|
|
205
|
+
```bash
|
|
206
|
+
# Install
|
|
207
|
+
npm install
|
|
208
|
+
|
|
209
|
+
# View help
|
|
210
|
+
node cli.js --help
|
|
211
|
+
node cli.js github --help
|
|
212
|
+
|
|
213
|
+
# Try some examples (see docs/EXAMPLES.md)
|
|
214
|
+
node cli.js analyze "src/**/*.tsx" -l @mui/material
|
|
215
|
+
node cli.js github owner/repo -l @mui/material
|
|
216
|
+
```
|
|
217
|
+
|
|
218
|
+
For detailed documentation, see the [docs](./docs) folder.
|