@rayburst/cli 0.1.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/README.md ADDED
@@ -0,0 +1,273 @@
1
+ # Rayburst CLI
2
+
3
+ A Module Federation host application that loads the Rayburst frontend application dynamically from different environments.
4
+
5
+ ## Overview
6
+
7
+ The Rayburst CLI is an npm-installable package that serves as a Module Federation host. It dynamically loads the Rayburst application from:
8
+
9
+ - **Development**: `http://localhost:3000` (local development)
10
+ - **Staging**: `https://dev.rayburst.app` (staging environment)
11
+ - **Production**: `https://www.rayburst.app` (production environment)
12
+
13
+ The CLI runs on **port 3105** by default.
14
+
15
+ ## Installation
16
+
17
+ ### Local Development Setup
18
+
19
+ 1. Install dependencies:
20
+ ```bash
21
+ cd cli
22
+ npm install
23
+ ```
24
+
25
+ 2. Build the CLI:
26
+ ```bash
27
+ npm run build
28
+ ```
29
+
30
+ 3. Link the CLI globally for testing:
31
+ ```bash
32
+ npm link
33
+ ```
34
+
35
+ ### Publishing to npm (Future)
36
+
37
+ Once ready for production:
38
+ ```bash
39
+ npm publish
40
+ ```
41
+
42
+ Then users can install globally:
43
+ ```bash
44
+ npm install -g rayburst-cli
45
+ ```
46
+
47
+ ## Usage
48
+
49
+ ### Starting the CLI
50
+
51
+ ```bash
52
+ rayburst start
53
+ ```
54
+
55
+ This will start the CLI server on port 3105 in development mode, loading the app from `localhost:3000`.
56
+
57
+ ### Command Options
58
+
59
+ ```bash
60
+ rayburst start [options]
61
+
62
+ Options:
63
+ -p, --port <port> Port to run the server on (default: 3105)
64
+ -e, --env <environment> Environment: development|staging|production (default: development)
65
+ -h, --help Display help for command
66
+ ```
67
+
68
+ ### Examples
69
+
70
+ Start on custom port:
71
+ ```bash
72
+ rayburst start --port 4000
73
+ ```
74
+
75
+ Start in staging mode:
76
+ ```bash
77
+ rayburst start --env staging
78
+ ```
79
+
80
+ Start in production mode:
81
+ ```bash
82
+ rayburst start --env production --port 8080
83
+ ```
84
+
85
+ ## Development Workflow
86
+
87
+ ### 1. Build the Main App (Remote)
88
+
89
+ The main Rayburst app must be built first to generate the `remoteEntry.js`:
90
+
91
+ ```bash
92
+ # From the root of the rayburst project
93
+ npm run build
94
+ ```
95
+
96
+ This creates:
97
+ - `dist/assets/remoteEntry.js` - Module federation remote entry
98
+ - All other bundled assets
99
+
100
+ ### 2. Start the Main App
101
+
102
+ Start the main app on port 3000:
103
+
104
+ ```bash
105
+ npm run start
106
+ ```
107
+
108
+ The app will be available at `http://localhost:3000` and expose its remote entry at `http://localhost:3000/assets/remoteEntry.js`.
109
+
110
+ ### 3. Build the CLI
111
+
112
+ ```bash
113
+ cd cli
114
+ npm run build
115
+ ```
116
+
117
+ ### 4. Start the CLI
118
+
119
+ ```bash
120
+ rayburst start
121
+ ```
122
+
123
+ or directly:
124
+
125
+ ```bash
126
+ cd cli
127
+ npm run dev
128
+ ```
129
+
130
+ The CLI will now be running at `http://localhost:3105` and loading the app from `http://localhost:3000`.
131
+
132
+ ## Architecture
133
+
134
+ ### Module Federation Setup
135
+
136
+ **Main App (Remote)**
137
+ - Name: `rayburstApp`
138
+ - Port: 3000
139
+ - Exposes: `./App` → `./src/main.tsx`
140
+ - Shared: `react`, `react-dom`
141
+
142
+ **CLI (Host)**
143
+ - Name: `rayburstCli`
144
+ - Port: 3105
145
+ - Remotes: `rayburstApp` from environment-specific URL
146
+ - Shared: `react`, `react-dom`
147
+
148
+ ### File Structure
149
+
150
+ ```
151
+ cli/
152
+ ā”œā”€ā”€ bin/
153
+ │ └── rayburst.js # CLI entry point
154
+ ā”œā”€ā”€ src/
155
+ │ └── main.tsx # React shell that loads remote
156
+ ā”œā”€ā”€ dist/ # Built files (generated)
157
+ ā”œā”€ā”€ index.html # HTML shell with loading state
158
+ ā”œā”€ā”€ server.js # Express server
159
+ ā”œā”€ā”€ vite.config.ts # Vite + Module Federation config
160
+ ā”œā”€ā”€ package.json
161
+ └── README.md
162
+ ```
163
+
164
+ ## Environment Configuration
165
+
166
+ The CLI automatically determines which remote URL to use based on the environment:
167
+
168
+ | Environment | Remote URL | Use Case |
169
+ |------------|-----------|----------|
170
+ | development | http://localhost:3000 | Local development |
171
+ | staging | https://dev.rayburst.app | Staging/testing |
172
+ | production | https://www.rayburst.app | Production |
173
+
174
+ ## Troubleshooting
175
+
176
+ ### Port 3000 Already in Use
177
+
178
+ If port 3000 is already in use, find and kill the process:
179
+
180
+ ```bash
181
+ lsof -i :3000
182
+ kill <PID>
183
+ ```
184
+
185
+ ### Port 3105 Already in Use
186
+
187
+ Similarly for port 3105:
188
+
189
+ ```bash
190
+ lsof -i :3105
191
+ kill <PID>
192
+ ```
193
+
194
+ ### Remote Entry Not Found
195
+
196
+ Make sure the main app is **built** and running the **preview server** (not dev server):
197
+
198
+ ```bash
199
+ # 1. Build the app first
200
+ npm run build
201
+
202
+ # 2. Start the preview server (serves built files)
203
+ npm run start
204
+
205
+ # 3. Verify remoteEntry.js is accessible
206
+ curl -I http://localhost:3000/assets/remoteEntry.js
207
+ ```
208
+
209
+ Should return `200 OK` with `Content-Type: text/javascript`.
210
+
211
+ **Important**: The dev server (`npm run dev`) does NOT generate the `remoteEntry.js` file. You must:
212
+ 1. Build the app with `npm run build`
213
+ 2. Serve built files with `npm run start` (vite preview)
214
+
215
+ If you see `Content-Type: text/html` instead of `text/javascript`, you're running the dev server instead of the preview server.
216
+
217
+ ### Module Federation Loading Errors
218
+
219
+ 1. Ensure both apps share the same major versions of React and React DOM
220
+ 2. Check browser console for detailed error messages
221
+ 3. Verify the remote URL is accessible from the host
222
+ 4. Check CORS headers if loading from different domains
223
+
224
+ ## Testing Different Environments
225
+
226
+ ### Local Testing
227
+ ```bash
228
+ # Terminal 1: Start main app
229
+ npm run start
230
+
231
+ # Terminal 2: Start CLI
232
+ rayburst start
233
+ ```
234
+
235
+ Visit: `http://localhost:3105`
236
+
237
+ ### Staging Testing
238
+ ```bash
239
+ rayburst start --env staging
240
+ ```
241
+
242
+ Visit: `http://localhost:3105` (loads from dev.rayburst.app)
243
+
244
+ ### Production Testing
245
+ ```bash
246
+ rayburst start --env production
247
+ ```
248
+
249
+ Visit: `http://localhost:3105` (loads from www.rayburst.app)
250
+
251
+ ## Scripts
252
+
253
+ - `npm run dev` - Start CLI in development mode
254
+ - `npm run build` - Build the CLI for production
255
+ - `npm run start` - Start the CLI server (requires build first)
256
+
257
+ ## Tech Stack
258
+
259
+ - **Vite** - Build tool and dev server
260
+ - **React 19** - UI library
261
+ - **Module Federation** - Dynamic remote loading
262
+ - **Express** - Production server
263
+ - **Commander** - CLI framework
264
+ - **Chalk** - Terminal styling
265
+
266
+ ## Future Enhancements
267
+
268
+ - [ ] Auto-detect if remote is available and fallback
269
+ - [ ] Support for custom remote URLs via config file
270
+ - [ ] Health check endpoint
271
+ - [ ] Hot reload support for development
272
+ - [ ] Docker support
273
+ - [ ] CI/CD integration examples
@@ -0,0 +1,61 @@
1
+ #!/usr/bin/env node
2
+
3
+ import { Command } from 'commander';
4
+ import chalk from 'chalk';
5
+ import { spawn } from 'child_process';
6
+ import { fileURLToPath } from 'url';
7
+ import { dirname, join } from 'path';
8
+
9
+ const __filename = fileURLToPath(import.meta.url);
10
+ const __dirname = dirname(__filename);
11
+
12
+ const program = new Command();
13
+
14
+ program
15
+ .name('rayburst')
16
+ .description('Rayburst CLI - Module Federation Host')
17
+ .version('0.1.0');
18
+
19
+ program
20
+ .command('start')
21
+ .description('Start the Rayburst application')
22
+ .option('-p, --port <port>', 'Port to run the server on', '3105')
23
+ .option('-e, --env <environment>', 'Environment (development|staging|production)', 'development')
24
+ .action((options) => {
25
+ console.log(chalk.blue('šŸš€ Starting Rayburst CLI...'));
26
+ console.log(chalk.gray(` Port: ${options.port}`));
27
+ console.log(chalk.gray(` Environment: ${options.env}`));
28
+
29
+ const serverPath = join(__dirname, '..', 'server.js');
30
+
31
+ const env = {
32
+ ...process.env,
33
+ PORT: options.port,
34
+ NODE_ENV: options.env,
35
+ };
36
+
37
+ const server = spawn('node', [serverPath], {
38
+ env,
39
+ stdio: 'inherit',
40
+ });
41
+
42
+ server.on('error', (err) => {
43
+ console.error(chalk.red('Failed to start server:'), err);
44
+ process.exit(1);
45
+ });
46
+
47
+ server.on('exit', (code) => {
48
+ if (code !== 0) {
49
+ console.error(chalk.red(`Server exited with code ${code}`));
50
+ process.exit(code);
51
+ }
52
+ });
53
+
54
+ process.on('SIGINT', () => {
55
+ console.log(chalk.yellow('\nšŸ‘‹ Shutting down Rayburst CLI...'));
56
+ server.kill('SIGINT');
57
+ process.exit(0);
58
+ });
59
+ });
60
+
61
+ program.parse();
@@ -0,0 +1,5 @@
1
+ function getDefaultExportFromCjs (x) {
2
+ return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
3
+ }
4
+
5
+ export { getDefaultExportFromCjs as g };
@@ -0,0 +1,9 @@
1
+ import { _ as __vitePreload } from './preload-helper-Dea3Szod.js';
2
+
3
+ const remoteEntryPromise = __vitePreload(() => import('./remoteEntry-BkHjZ4dx.js'),true ?[]:void 0);
4
+ // __tla only serves as a hack for vite-plugin-top-level-await.
5
+ Promise.resolve(remoteEntryPromise)
6
+ .then(remoteEntry => {
7
+ return Promise.resolve(remoteEntry.__tla)
8
+ .then(remoteEntry.init).catch(remoteEntry.init)
9
+ });