with-zephyr 0.0.0-canary.2

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,336 @@
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 **11+ 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
+ - **Modern.js** ([`zephyr-modernjs-plugin`](https://www.npmjs.com/package/zephyr-modernjs-plugin))
45
+ - **RSPress** ([`zephyr-rspress-plugin`](https://www.npmjs.com/package/zephyr-rspress-plugin))
46
+ - **Parcel** ([`parcel-reporter-zephyr`](https://www.npmjs.com/package/parcel-reporter-zephyr))
47
+ - **RSBuild** ([`zephyr-rsbuild-plugin`](https://www.npmjs.com/package/zephyr-rsbuild-plugin))
48
+ - **RSLib** ([`zephyr-rsbuild-plugin`](https://www.npmjs.com/package/zephyr-rsbuild-plugin))
49
+ - **Re.Pack** (React Native) ([`zephyr-repack-plugin`](https://www.npmjs.com/package/zephyr-repack-plugin))
50
+
51
+ ## Installation
52
+
53
+ **No installation required!** Use directly with one command:
54
+
55
+ ```bash
56
+ # Recommended: Use the hosted version
57
+ curl -fsSL https://with.zephyr-cloud.io | node
58
+
59
+ # Alternative: Use with your package manager
60
+ npx with-zephyr # npm
61
+ pnpm dlx with-zephyr # pnpm
62
+ yarn dlx with-zephyr # yarn
63
+ bunx with-zephyr # bun
64
+ ```
65
+
66
+ > **💡 Tip:** Using `npx`/`dlx`/`bunx` ensures you always get the latest version without cluttering your global packages.
67
+
68
+ ## Usage
69
+
70
+ ### Basic Usage
71
+
72
+ Run the codemod in your project directory:
73
+
74
+ ```bash
75
+ # Recommended: Use the hosted version
76
+ curl -fsSL https://with.zephyr-cloud.io | node
77
+
78
+ # Alternative: Use with package managers
79
+ npx with-zephyr
80
+ ```
81
+
82
+ This will:
83
+
84
+ 1. Search for bundler configuration files in the current directory and subdirectories
85
+ 2. Detect which bundler each config file is for
86
+ 3. Add the appropriate `withZephyr` plugin configuration
87
+ 4. Add the necessary import/require statements
88
+
89
+ ### Command Line Options
90
+
91
+ ```bash
92
+ # Show what would be changed without modifying files
93
+ npx with-zephyr --dry-run
94
+
95
+ # Automatically install missing plugin packages
96
+ npx with-zephyr --install
97
+
98
+ # Specify a different directory
99
+ npx with-zephyr ./my-project
100
+
101
+ # Only process specific bundlers
102
+ npx with-zephyr --bundlers webpack vite
103
+
104
+ # Combine options
105
+ npx with-zephyr ./src --dry-run --bundlers rollup --install
106
+
107
+ # Use with other package managers
108
+ pnpm dlx with-zephyr --install
109
+ yarn dlx with-zephyr --dry-run
110
+ bunx with-zephyr --bundlers vite rollup
111
+ ```
112
+
113
+ ### Options
114
+
115
+ - `[directory]` - Directory to search for config files (default: current directory)
116
+ - `-d, --dry-run` - Show what would be changed without modifying files
117
+ - `-b, --bundlers <bundlers...>` - Only process specific bundlers
118
+ - `-i, --install` - Automatically install missing plugin packages
119
+
120
+ ## Examples
121
+
122
+ ### Before and After
123
+
124
+ #### Webpack Configuration
125
+
126
+ **Before:**
127
+
128
+ ```javascript
129
+ const { composePlugins, withNx, withReact } = require('@nx/webpack');
130
+
131
+ module.exports = composePlugins(withNx(), withReact(), (config) => {
132
+ return config;
133
+ });
134
+ ```
135
+
136
+ **After:**
137
+
138
+ ```javascript
139
+ const { withZephyr } = require('zephyr-webpack-plugin');
140
+ const { composePlugins, withNx, withReact } = require('@nx/webpack');
141
+
142
+ module.exports = composePlugins(withNx(), withReact(), withZephyr(), (config) => {
143
+ return config;
144
+ });
145
+ ```
146
+
147
+ #### Vite Configuration
148
+
149
+ **Before:**
150
+
151
+ ```typescript
152
+ import { defineConfig } from 'vite';
153
+ import react from '@vitejs/plugin-react';
154
+
155
+ export default defineConfig({
156
+ plugins: [react()],
157
+ });
158
+ ```
159
+
160
+ **After:**
161
+
162
+ ```typescript
163
+ import { withZephyr } from 'vite-plugin-zephyr';
164
+ import { defineConfig } from 'vite';
165
+ import react from '@vitejs/plugin-react';
166
+
167
+ export default defineConfig({
168
+ plugins: [react(), withZephyr()],
169
+ });
170
+ ```
171
+
172
+ #### Rollup Configuration
173
+
174
+ **Before:**
175
+
176
+ ```javascript
177
+ module.exports = (config) => {
178
+ return config;
179
+ };
180
+ ```
181
+
182
+ **After:**
183
+
184
+ ```javascript
185
+ const { withZephyr } = require('rollup-plugin-zephyr');
186
+
187
+ module.exports = (config) => {
188
+ config.plugins.push(withZephyr());
189
+ return config;
190
+ };
191
+ ```
192
+
193
+ ## Package Management
194
+
195
+ The codemod can automatically install missing Zephyr plugin packages using the `--install` flag.
196
+
197
+ ### Package Manager Detection
198
+
199
+ The tool automatically detects your package manager by checking for:
200
+
201
+ 1. **Lock files** (in order of priority):
202
+
203
+ - `pnpm-lock.yaml` → pnpm
204
+ - `yarn.lock` → yarn
205
+ - `package-lock.json` → npm
206
+ - `bun.lockb` → bun
207
+
208
+ 2. **package.json `packageManager` field**
209
+ 3. **Monorepo indicators** (`pnpm-workspace.yaml`, `lerna.json`)
210
+ 4. **Environment variables** (`npm_config_user_agent`)
211
+
212
+ ### Supported Package Managers
213
+
214
+ - **npm**: `npm install --save-dev <package>`
215
+ - **yarn**: `yarn add --dev <package>`
216
+ - **pnpm**: `pnpm add --save-dev <package>`
217
+ - **bun**: `bun add --dev <package>`
218
+
219
+ ### Usage with Package Installation
220
+
221
+ ```bash
222
+ # Install packages and update configs in one command
223
+ npx with-zephyr --install
224
+
225
+ # Preview what packages would be installed
226
+ npx with-zephyr --dry-run --install
227
+
228
+ # The tool will show you which packages need to be installed if you don't use --install
229
+ npx with-zephyr
230
+ # Output: 💡 Tip: Use --install to automatically install missing packages:
231
+ # vite-plugin-zephyr
232
+ # zephyr-webpack-plugin
233
+ ```
234
+
235
+ ## Configuration File Detection
236
+
237
+ The codemod automatically detects and processes these configuration files:
238
+
239
+ - `webpack.config.js/ts/mjs`
240
+ - `rspack.config.js/ts/mjs`
241
+ - `vite.config.js/ts/mjs`
242
+ - `rollup.config.js/ts/mjs`
243
+ - `rolldown.config.js/ts/mjs`
244
+ - `modern.config.js/ts/mjs`
245
+ - `rspress.config.js/ts/mjs`
246
+ - `rsbuild.config.js/ts/mjs`
247
+ - `rslib.config.js/ts/mjs`
248
+ - `.parcelrc/.parcelrc.json`
249
+
250
+ ## Integration Patterns
251
+
252
+ The codemod recognizes and handles various configuration patterns:
253
+
254
+ ### Webpack/Rspack
255
+
256
+ - `composePlugins()` calls (Nx style)
257
+ - `plugins: []` arrays
258
+ - Direct `module.exports` assignments
259
+
260
+ ### Vite/Rolldown
261
+
262
+ - `defineConfig()` calls
263
+ - `plugins: []` arrays
264
+
265
+ ### Rollup
266
+
267
+ - Function-based configs with `config.plugins.push()`
268
+ - `plugins: []` arrays
269
+
270
+ ### Modern.js/RSPress
271
+
272
+ - `defineConfig()` calls with `plugins: []` arrays
273
+
274
+ ### Parcel
275
+
276
+ - JSON configuration with `reporters` array
277
+
278
+ ## Safety Features
279
+
280
+ - **Dry run mode**: Preview changes before applying them
281
+ - **Duplicate detection**: Skips files that already have `withZephyr` configured
282
+ - **Error handling**: Continues processing other files if one fails
283
+ - **Backup recommendation**: Always commit your changes before running codemods
284
+
285
+ ## Troubleshooting
286
+
287
+ ### Common Issues
288
+
289
+ 1. **"Could not parse file"** - The configuration file has syntax errors or uses unsupported patterns
290
+ 2. **"No suitable pattern found"** - The codemod doesn't recognize the configuration structure
291
+ 3. **"Already has withZephyr"** - The plugin is already configured (this is expected behavior)
292
+
293
+ ### Manual Configuration
294
+
295
+ If the codemod doesn't work for your specific configuration, you can manually add the withZephyr plugin:
296
+
297
+ 1. Install the appropriate plugin package
298
+ 2. Import/require the `withZephyr` function
299
+ 3. Add it to your bundler's plugin configuration
300
+
301
+ Refer to the individual plugin documentation for specific setup instructions.
302
+
303
+ ## Development
304
+
305
+ ### Building
306
+
307
+ The codemod is written in TypeScript and bundled with tsup:
308
+
309
+ ```bash
310
+ # Install dependencies
311
+ pnpm install
312
+
313
+ # Build the project
314
+ pnpm run build
315
+
316
+ # Development mode with watch
317
+ pnpm run dev
318
+
319
+ # Type checking
320
+ pnpm run typecheck
321
+ ```
322
+
323
+ ### Project Structure
324
+
325
+ ```
326
+ src/
327
+ ├── index.ts # Main CLI entry point
328
+ ├── types.ts # TypeScript type definitions
329
+ ├── bundler-configs.ts # Bundler configuration definitions
330
+ ├── transformers.ts # AST transformation functions
331
+ └── package-manager.ts # Package management utilities
332
+ ```
333
+
334
+ ## Contributing
335
+
336
+ Found a configuration pattern that isn't supported? Please open an issue or submit a pull request!