with-zephyr 0.0.0-canary.10

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 ADDED
@@ -0,0 +1,39 @@
1
+ Apache License
2
+ Version 2.0, January 2004
3
+ http://www.apache.org/licenses/
4
+
5
+ TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
6
+
7
+ 1. Definitions.
8
+
9
+ "License" shall mean the terms and conditions for use, reproduction,
10
+ and distribution as defined by Sections 1 through 9 of this document.
11
+
12
+ ...
13
+
14
+ END OF TERMS AND CONDITIONS
15
+
16
+ APPENDIX: How to apply the Apache License to your work.
17
+
18
+ To apply the Apache License to your work, attach the following
19
+ boilerplate notice, with the fields enclosed by brackets "[]"
20
+ replaced with your own identifying information. (Don't include
21
+ the brackets!) The text should be enclosed in the appropriate
22
+ comment syntax for the file format. We also recommend that a
23
+ file or class name and description of purpose be included on the
24
+ same line as the copyright notice for each file. The "copyright"
25
+ word should be left as is (without quotes).
26
+
27
+ Copyright [2023] [Zephyr Cloud]
28
+
29
+ Licensed under the Apache License, Version 2.0 (the "License");
30
+ you may not use this file except in compliance with the License.
31
+ You may obtain a copy of the License at
32
+
33
+ http://www.apache.org/licenses/LICENSE-2.0
34
+
35
+ Unless required by applicable law or agreed to in writing, software
36
+ distributed under the License is distributed on an "AS IS" BASIS,
37
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
38
+ See the License for the specific language governing permissions and
39
+ limitations under the License.
package/README.md ADDED
@@ -0,0 +1,338 @@
1
+ # with-zephyr
2
+
3
+ A codemod tool that automatically adds the `withZephyr` plugin to bundler configurations in your project.
4
+
5
+ ## What is Zephyr?
6
+
7
+ [**Zephyr**](https://zephyr-cloud.io) is a developer-first SaaS platform focused on **Module Federation** for building, deploying, and managing micro-frontend applications. It provides:
8
+
9
+ - 🚀 **Edge-deployed micro-frontends** with global CDN distribution
10
+ - 🔧 **Universal bundler support** - works with Webpack, Vite, Rollup, and more
11
+ - 📊 **Real-time analytics** and deployment insights
12
+ - 🛡️ **Version management** with rollback capabilities
13
+ - 🌐 **Custom domains** and environment management
14
+
15
+ Learn more at [**zephyr-cloud.io**](https://zephyr-cloud.io) | [**Documentation**](https://docs.zephyr-cloud.io) | [**GitHub**](https://github.com/zephyr-cloud)
16
+
17
+ ## Quick Start
18
+
19
+ Get your project Zephyr-ready in seconds:
20
+
21
+ ```bash
22
+ # 1. Run the codemod to add Zephyr plugins to your bundler configs
23
+ curl -fsSL https://with.zephyr-cloud.io | node
24
+
25
+ # Alternative methods:
26
+ npx with-zephyr
27
+ pnpm dlx with-zephyr
28
+ yarn dlx with-zephyr
29
+ bunx with-zephyr
30
+
31
+ # 2. That's it! Your bundler is now configured for Zephyr deployments
32
+ # Visit https://app.zephyr-cloud.io to deploy your micro-frontends
33
+ ```
34
+
35
+ ## Supported Bundlers
36
+
37
+ This codemod supports **12+ bundlers** with their respective Zephyr plugins:
38
+
39
+ - **Webpack** ([`zephyr-webpack-plugin`](https://www.npmjs.com/package/zephyr-webpack-plugin))
40
+ - **Rspack** ([`zephyr-rspack-plugin`](https://www.npmjs.com/package/zephyr-rspack-plugin))
41
+ - **Vite** ([`vite-plugin-zephyr`](https://www.npmjs.com/package/vite-plugin-zephyr))
42
+ - **Rollup** ([`rollup-plugin-zephyr`](https://www.npmjs.com/package/rollup-plugin-zephyr))
43
+ - **Rolldown** ([`zephyr-rolldown-plugin`](https://www.npmjs.com/package/zephyr-rolldown-plugin))
44
+ - **Astro** ([`zephyr-astro-integration`](https://www.npmjs.com/package/zephyr-astro-integration))
45
+ - **Modern.js** ([`zephyr-modernjs-plugin`](https://www.npmjs.com/package/zephyr-modernjs-plugin))
46
+ - **RSPress** ([`zephyr-rspress-plugin`](https://www.npmjs.com/package/zephyr-rspress-plugin))
47
+ - **Parcel** ([`parcel-reporter-zephyr`](https://www.npmjs.com/package/parcel-reporter-zephyr))
48
+ - **RSBuild** ([`zephyr-rsbuild-plugin`](https://www.npmjs.com/package/zephyr-rsbuild-plugin))
49
+ - **RSLib** ([`zephyr-rsbuild-plugin`](https://www.npmjs.com/package/zephyr-rsbuild-plugin))
50
+ - **Re.Pack** (React Native) ([`zephyr-repack-plugin`](https://www.npmjs.com/package/zephyr-repack-plugin))
51
+
52
+ ## Installation
53
+
54
+ **No installation required!** Use directly with one command:
55
+
56
+ ```bash
57
+ # Recommended: Use the hosted version
58
+ curl -fsSL https://with.zephyr-cloud.io | node
59
+
60
+ # Alternative: Use with your package manager
61
+ npx with-zephyr # npm
62
+ pnpm dlx with-zephyr # pnpm
63
+ yarn dlx with-zephyr # yarn
64
+ bunx with-zephyr # bun
65
+ ```
66
+
67
+ > **💡 Tip:** Using `npx`/`dlx`/`bunx` ensures you always get the latest version without cluttering your global packages.
68
+
69
+ ## Usage
70
+
71
+ ### Basic Usage
72
+
73
+ Run the codemod in your project directory:
74
+
75
+ ```bash
76
+ # Recommended: Use the hosted version
77
+ curl -fsSL https://with.zephyr-cloud.io | node
78
+
79
+ # Alternative: Use with package managers
80
+ npx with-zephyr
81
+ ```
82
+
83
+ This will:
84
+
85
+ 1. Search for bundler configuration files in the current directory and subdirectories
86
+ 2. Detect which bundler each config file is for
87
+ 3. Add the appropriate `withZephyr` plugin configuration
88
+ 4. Add the necessary import/require statements
89
+
90
+ ### Command Line Options
91
+
92
+ ```bash
93
+ # Show what would be changed without modifying files
94
+ npx with-zephyr --dry-run
95
+
96
+ # Automatically install missing plugin packages
97
+ npx with-zephyr --install
98
+
99
+ # Specify a different directory
100
+ npx with-zephyr ./my-project
101
+
102
+ # Only process specific bundlers
103
+ npx with-zephyr --bundlers webpack vite
104
+
105
+ # Combine options
106
+ npx with-zephyr ./src --dry-run --bundlers rollup --install
107
+
108
+ # Use with other package managers
109
+ pnpm dlx with-zephyr --install
110
+ yarn dlx with-zephyr --dry-run
111
+ bunx with-zephyr --bundlers vite rollup
112
+ ```
113
+
114
+ ### Options
115
+
116
+ - `[directory]` - Directory to search for config files (default: current directory)
117
+ - `-d, --dry-run` - Show what would be changed without modifying files
118
+ - `-b, --bundlers <bundlers...>` - Only process specific bundlers
119
+ - `-i, --install` - Automatically install missing plugin packages
120
+
121
+ ## Examples
122
+
123
+ ### Before and After
124
+
125
+ #### Webpack Configuration
126
+
127
+ **Before:**
128
+
129
+ ```javascript
130
+ const { composePlugins, withNx, withReact } = require('@nx/webpack');
131
+
132
+ module.exports = composePlugins(withNx(), withReact(), (config) => {
133
+ return config;
134
+ });
135
+ ```
136
+
137
+ **After:**
138
+
139
+ ```javascript
140
+ const { withZephyr } = require('zephyr-webpack-plugin');
141
+ const { composePlugins, withNx, withReact } = require('@nx/webpack');
142
+
143
+ module.exports = composePlugins(withNx(), withReact(), withZephyr(), (config) => {
144
+ return config;
145
+ });
146
+ ```
147
+
148
+ #### Vite Configuration
149
+
150
+ **Before:**
151
+
152
+ ```typescript
153
+ import { defineConfig } from 'vite';
154
+ import react from '@vitejs/plugin-react';
155
+
156
+ export default defineConfig({
157
+ plugins: [react()],
158
+ });
159
+ ```
160
+
161
+ **After:**
162
+
163
+ ```typescript
164
+ import { withZephyr } from 'vite-plugin-zephyr';
165
+ import { defineConfig } from 'vite';
166
+ import react from '@vitejs/plugin-react';
167
+
168
+ export default defineConfig({
169
+ plugins: [react(), withZephyr()],
170
+ });
171
+ ```
172
+
173
+ #### Rollup Configuration
174
+
175
+ **Before:**
176
+
177
+ ```javascript
178
+ module.exports = (config) => {
179
+ return config;
180
+ };
181
+ ```
182
+
183
+ **After:**
184
+
185
+ ```javascript
186
+ const { withZephyr } = require('rollup-plugin-zephyr');
187
+
188
+ module.exports = (config) => {
189
+ config.plugins.push(withZephyr());
190
+ return config;
191
+ };
192
+ ```
193
+
194
+ ## Package Management
195
+
196
+ The codemod can automatically install missing Zephyr plugin packages using the `--install` flag.
197
+
198
+ ### Package Manager Detection
199
+
200
+ The tool automatically detects your package manager by checking for:
201
+
202
+ 1. **Lock files** (in order of priority):
203
+
204
+ - `pnpm-lock.yaml` → pnpm
205
+ - `yarn.lock` → yarn
206
+ - `package-lock.json` → npm
207
+ - `bun.lockb` → bun
208
+
209
+ 2. **package.json `packageManager` field**
210
+ 3. **Monorepo indicators** (`pnpm-workspace.yaml`, `lerna.json`)
211
+ 4. **Environment variables** (`npm_config_user_agent`)
212
+
213
+ ### Supported Package Managers
214
+
215
+ - **npm**: `npm install --save-dev <package>`
216
+ - **yarn**: `yarn add --dev <package>`
217
+ - **pnpm**: `pnpm add --save-dev <package>`
218
+ - **bun**: `bun add --dev <package>`
219
+
220
+ ### Usage with Package Installation
221
+
222
+ ```bash
223
+ # Install packages and update configs in one command
224
+ npx with-zephyr --install
225
+
226
+ # Preview what packages would be installed
227
+ npx with-zephyr --dry-run --install
228
+
229
+ # The tool will show you which packages need to be installed if you don't use --install
230
+ npx with-zephyr
231
+ # Output: 💡 Tip: Use --install to automatically install missing packages:
232
+ # vite-plugin-zephyr
233
+ # zephyr-webpack-plugin
234
+ ```
235
+
236
+ ## Configuration File Detection
237
+
238
+ The codemod automatically detects and processes these configuration files:
239
+
240
+ - `webpack.config.js/ts/mjs`
241
+ - `rspack.config.js/ts/mjs`
242
+ - `vite.config.js/ts/mjs`
243
+ - `rollup.config.js/ts/mjs`
244
+ - `rolldown.config.js/ts/mjs`
245
+ - `astro.config.js/ts/mjs/mts`
246
+ - `modern.config.js/ts/mjs`
247
+ - `rspress.config.js/ts/mjs`
248
+ - `rsbuild.config.js/ts/mjs`
249
+ - `rslib.config.js/ts/mjs`
250
+ - `.parcelrc/.parcelrc.json`
251
+
252
+ ## Integration Patterns
253
+
254
+ The codemod recognizes and handles various configuration patterns:
255
+
256
+ ### Webpack/Rspack
257
+
258
+ - `composePlugins()` calls (Nx style)
259
+ - `plugins: []` arrays
260
+ - Direct `module.exports` assignments
261
+
262
+ ### Vite/Rolldown
263
+
264
+ - `defineConfig()` calls
265
+ - `plugins: []` arrays
266
+
267
+ ### Rollup
268
+
269
+ - Function-based configs with `config.plugins.push()`
270
+ - `plugins: []` arrays
271
+
272
+ ### Modern.js/RSPress
273
+
274
+ - `defineConfig()` calls with `plugins: []` arrays
275
+
276
+ ### Parcel
277
+
278
+ - JSON configuration with `reporters` array
279
+
280
+ ## Safety Features
281
+
282
+ - **Dry run mode**: Preview changes before applying them
283
+ - **Duplicate detection**: Skips files that already have `withZephyr` configured
284
+ - **Error handling**: Continues processing other files if one fails
285
+ - **Backup recommendation**: Always commit your changes before running codemods
286
+
287
+ ## Troubleshooting
288
+
289
+ ### Common Issues
290
+
291
+ 1. **"Could not parse file"** - The configuration file has syntax errors or uses unsupported patterns
292
+ 2. **"No suitable pattern found"** - The codemod doesn't recognize the configuration structure
293
+ 3. **"Already has withZephyr"** - The plugin is already configured (this is expected behavior)
294
+
295
+ ### Manual Configuration
296
+
297
+ If the codemod doesn't work for your specific configuration, you can manually add the withZephyr plugin:
298
+
299
+ 1. Install the appropriate plugin package
300
+ 2. Import/require the `withZephyr` function
301
+ 3. Add it to your bundler's plugin configuration
302
+
303
+ Refer to the individual plugin documentation for specific setup instructions.
304
+
305
+ ## Development
306
+
307
+ ### Building
308
+
309
+ The codemod is written in TypeScript and bundled with tsup:
310
+
311
+ ```bash
312
+ # Install dependencies
313
+ pnpm install
314
+
315
+ # Build the project
316
+ pnpm run build
317
+
318
+ # Development mode with watch
319
+ pnpm run dev
320
+
321
+ # Type checking
322
+ pnpm run typecheck
323
+ ```
324
+
325
+ ### Project Structure
326
+
327
+ ```
328
+ src/
329
+ ├── index.ts # Main CLI entry point
330
+ ├── types.ts # TypeScript type definitions
331
+ ├── bundler-configs.ts # Bundler configuration definitions
332
+ ├── transformers.ts # AST transformation functions
333
+ └── package-manager.ts # Package management utilities
334
+ ```
335
+
336
+ ## Contributing
337
+
338
+ Found a configuration pattern that isn't supported? Please open an issue or submit a pull request!