zephyr-webpack-plugin 0.0.49 → 0.0.51

package/README.md

@@ -1,44 +1,245 @@
-# zephyr-webpack-plugin
+# Zephyr Webpack Plugin
 
 <div align="center">
 
-[Zephyr Cloud](https://zephyr-cloud.io) | [Zephyr Docs](https://docs.zephyr-cloud.io/recipes/rspack-react) | [Rspack Docs](https://rspack.dev) | [Discord](https://zephyr-cloud.io/discord) | [Twitter](https://x.com/ZephyrCloudIO) | [LinkedIn](https://www.linkedin.com/company/zephyr-cloud/)
+[Zephyr Cloud](https://zephyr-cloud.io) | [Zephyr Docs](https://docs.zephyr-cloud.io/recipes/) | [Discord](https://zephyr-cloud.io/discord) | [Twitter](https://x.com/ZephyrCloudIO) | [LinkedIn](https://www.linkedin.com/company/zephyr-cloud/)
 
 <hr/>
+<img src="https://cdn.prod.website-files.com/669061ee3adb95b628c3acda/66981c766e352fe1f57191e2_Opengraph-zephyr.png" alt="Zephyr Logo" />
 </div>
 
+A Webpack plugin for deploying applications with Zephyr Cloud. This plugin integrates seamlessly with Webpack's ecosystem to enable deployment of your applications with comprehensive Module Federation support.
+
+For more information please refer to our [documentation](https://docs.zephyr-cloud.io/recipes).
+
 ## Installation
 
-```
+```bash
 # npm
 npm install --save-dev zephyr-webpack-plugin
+
 # yarn
 yarn add --dev zephyr-webpack-plugin
+
 # pnpm
 pnpm add --dev zephyr-webpack-plugin
+
 # bun
 bun add --dev zephyr-webpack-plugin
 ```
 
 ## Usage
 
-### With Nx, Webpack or Rspack
+### With Nx and Webpack
+
+For Nx projects using Webpack:
+
+```javascript
+// webpack.config.js
+import { composePlugins, withNx } from '@nx/webpack';
+import { withReact } from '@nx/react';
+import { withModuleFederation } from '@nx/webpack/module-federation';
+import { withZephyr } from 'zephyr-webpack-plugin';
+
+const mfConfig = {
+  name: 'my-app',
+  remotes: {
+    'shared-ui': 'shared_ui@http://localhost:3001/remoteEntry.js',
+  },
+  shared: {
+    react: { singleton: true },
+    'react-dom': { singleton: true },
+  },
+};
 
-```
 export default composePlugins(
   withNx(),
   withReact(),
   withModuleFederation(mfConfig),
-  withZephyr(),
+  withZephyr(), // Add Zephyr plugin
   (config) => {
     return config;
   }
 );
 ```
 
-### With Webpack directly
+### With Webpack Directly
+
+For standalone Webpack projects:
 
+```javascript
+// webpack.config.js
+const { withZephyr } = require('zephyr-webpack-plugin');
+
+const config = {
+  entry: './src/index.js',
+  output: {
+    path: path.resolve(__dirname, 'dist'),
+    filename: '[name].[contenthash].js',
+  },
+  // ... other Webpack configuration
+};
+
+module.exports = withZephyr()(config);
 ```
-module.exports = withZephyr()(your_webpack_config);
 
+### TypeScript Configuration
+
+```typescript
+// webpack.config.ts
+import { Configuration } from 'webpack';
+import { withZephyr } from 'zephyr-webpack-plugin';
+
+const config: Configuration = {
+  entry: './src/index.tsx',
+  output: {
+    path: path.resolve(__dirname, 'dist'),
+    filename: '[name].[contenthash].js',
+  },
+  // ... other configuration
+};
+
+export default withZephyr({
+  // Zephyr options
+  deploy: true,
+  environment: 'production',
+})(config);
+```
+
+### With Module Federation Plugin
+
+```javascript
+// webpack.config.js
+const ModuleFederationPlugin = require('@module-federation/webpack');
+const { withZephyr } = require('zephyr-webpack-plugin');
+
+const config = {
+  entry: './src/index.js',
+  plugins: [
+    new ModuleFederationPlugin({
+      name: 'host',
+      remotes: {
+        mfe1: 'mfe1@http://localhost:3001/remoteEntry.js',
+      },
+      shared: {
+        react: { singleton: true },
+        'react-dom': { singleton: true },
+      },
+    }),
+  ],
+  // ... other configuration
+};
+
+module.exports = withZephyr()(config);
 ```
+
+## Features
+
+- 🏗️ Full Module Federation support with Webpack 5
+- 📦 Automatic asset optimization and caching
+- 🔧 Zero-config setup for simple applications
+- 📊 Build analytics and monitoring
+- 🌐 Global CDN distribution
+- ⚡ Hot module replacement in development
+- 🎯 Nx integration for monorepo support
+- 🔗 Automatic vendor federation for shared dependencies
+
+## Module Federation Support
+
+This plugin provides comprehensive Module Federation support:
+
+- **Host Applications**: Consume remote modules from other applications
+- **Remote Applications**: Expose modules for consumption by host applications
+- **Shared Dependencies**: Efficient sharing of common libraries
+- **Dynamic Imports**: Runtime loading of remote modules
+- **Automatic Vendor Federation**: Smart dependency sharing
+- **Federation Dashboard**: Build-time federation analytics
+
+## Getting Started
+
+1. Install the plugin in your Webpack project
+2. Add it to your Webpack configuration
+3. Configure Module Federation (if needed) for microfrontends
+4. Build your application with `npm run build`
+5. Your app will be automatically deployed to Zephyr Cloud
+
+## Build Scripts
+
+Add these scripts to your `package.json`:
+
+```json
+{
+  "scripts": {
+    "dev": "webpack serve",
+    "build": "webpack",
+    "build:prod": "NODE_ENV=production webpack"
+  }
+}
+```
+
+## Advanced Configuration
+
+### Custom Webpack Configuration
+
+```javascript
+// webpack.config.js
+const { withZephyr } = require('zephyr-webpack-plugin');
+
+const config = {
+  entry: './src/index.js',
+  optimization: {
+    splitChunks: {
+      chunks: 'all',
+    },
+  },
+  resolve: {
+    extensions: ['.js', '.jsx', '.ts', '.tsx'],
+  },
+  module: {
+    rules: [
+      {
+        test: /\.(js|jsx|ts|tsx)$/,
+        exclude: /node_modules/,
+        use: 'babel-loader',
+      },
+    ],
+  },
+};
+
+module.exports = withZephyr({
+  deploy: process.env.NODE_ENV === 'production',
+  environment: process.env.NODE_ENV || 'development',
+})(config);
+```
+
+## Requirements
+
+- Webpack 5.x or higher
+- Node.js 18 or higher
+- Zephyr Cloud account (sign up at [zephyr-cloud.io](https://zephyr-cloud.io))
+
+## Examples
+
+Check out our [examples directory](../../examples/) for complete working examples:
+
+- [sample-webpack-application](../../examples/sample-webpack-application/) - Basic Webpack setup
+- [react-micro-frontends](../../examples/react-micro-frontends/) - Module Federation setup with multiple teams
+
+## Nx Integration
+
+This plugin works seamlessly with Nx workspaces:
+
+```bash
+# Generate a new Webpack app with Module Federation
+nx g @nx/react:app my-app --bundler=webpack --mf=true
+
+# Add Zephyr plugin to the generated configuration
+```
+
+## Contributing
+
+We welcome contributions! Please read our [contributing guidelines](../../CONTRIBUTING.md) for more information.
+
+## License
+
+Licensed under the Apache-2.0 License. See [LICENSE](LICENSE) for more information.

package/dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zephyr-webpack-plugin",
-  "version": "0.0.49",
+  "version": "0.0.51",
   "description": "Webpack plugin for Zephyr",
   "repository": {
     "type": "git",

package/dist/webpack-plugin/with-zephyr.js

@@ -19,7 +19,7 @@ async function _zephyr_configuration(config, _zephyrOptions) {
         const resolved_dependency_pairs = await zephyr_engine.resolve_remote_dependencies(dependencyPairs);
         (0, zephyr_xpack_internal_1.mutWebpackFederatedRemotesConfig)(zephyr_engine, config, resolved_dependency_pairs);
         const mfConfig = (0, zephyr_xpack_internal_1.makeCopyOfModuleFederationOptions)(config);
-        (0, zephyr_agent_1.ze_log)(`with-zephyr.mfConfig: ${JSON.stringify(mfConfig, null, 2)}`);
+        zephyr_agent_1.ze_log.mf(`with-zephyr.mfConfig: ${JSON.stringify(mfConfig, null, 2)}`);
         // inject the ZephyrWebpackPlugin
         config.plugins?.push(new ze_webpack_plugin_1.ZeWebpackPlugin({
             zephyr_engine,

package/dist/webpack-plugin/with-zephyr.js.map

@@ -1 +1 @@
-{"version":3,"file":"with-zephyr.js","sourceRoot":"","sources":["../../src/webpack-plugin/with-zephyr.ts"],"names":[],"mappings":";;AAWA,gCAEC;AAZD,+CAAwE;AACxE,iEAI+B;AAG/B,2DAAsD;AAEtD,SAAgB,UAAU,CAAC,mBAAgD;IACzE,OAAO,CAAC,MAAqB,EAAE,EAAE,CAAC,qBAAqB,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAC;AACvF,CAAC;AAED,KAAK,UAAU,qBAAqB,CAClC,MAA4B,EAC5B,cAA2C;IAE3C,IAAI,CAAC;QACH,2DAA2D;QAC3D,MAAM,aAAa,GAAG,MAAM,2BAAY,CAAC,MAAM,CAAC;YAC9C,OAAO,EAAE,SAAS;YAClB,OAAO,EAAE,MAAM,CAAC,OAAO;SACxB,CAAC,CAAC;QAEH,6CAA6C;QAC7C,MAAM,eAAe,GAAG,IAAA,uDAA+B,EAAC,MAAM,CAAC,CAAC;QAChE,MAAM,yBAAyB,GAC7B,MAAM,aAAa,CAAC,2BAA2B,CAAC,eAAe,CAAC,CAAC;QAEnE,IAAA,wDAAgC,EAAC,aAAa,EAAE,MAAM,EAAE,yBAAyB,CAAC,CAAC;QAEnF,MAAM,QAAQ,GAAG,IAAA,yDAAiC,EAAC,MAAM,CAAC,CAAC;QAE3D,IAAA,qBAAM,EAAC,yBAAyB,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;QAErE,iCAAiC;QACjC,MAAM,CAAC,OAAO,EAAE,IAAI,CAClB,IAAI,mCAAe,CAAC;YAClB,aAAa;YACb,QAAQ,EAAE,QAAQ;YAClB,mBAAmB,EAAE,cAAc,EAAE,mBAAmB;SACzD,CAAC,CACH,CAAC;IACJ,CAAC;IAAC,OAAO,KAAK,EAAE,CAAC;QACf,IAAA,oBAAK,EAAC,OAAO,EAAE,0BAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;IAC5C,CAAC;IAED,OAAO,MAAM,CAAC;AAChB,CAAC"}
+{"version":3,"file":"with-zephyr.js","sourceRoot":"","sources":["../../src/webpack-plugin/with-zephyr.ts"],"names":[],"mappings":";;AAWA,gCAEC;AAZD,+CAAwE;AACxE,iEAI+B;AAG/B,2DAAsD;AAEtD,SAAgB,UAAU,CAAC,mBAAgD;IACzE,OAAO,CAAC,MAAqB,EAAE,EAAE,CAAC,qBAAqB,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAC;AACvF,CAAC;AAED,KAAK,UAAU,qBAAqB,CAClC,MAA4B,EAC5B,cAA2C;IAE3C,IAAI,CAAC;QACH,2DAA2D;QAC3D,MAAM,aAAa,GAAG,MAAM,2BAAY,CAAC,MAAM,CAAC;YAC9C,OAAO,EAAE,SAAS;YAClB,OAAO,EAAE,MAAM,CAAC,OAAO;SACxB,CAAC,CAAC;QAEH,6CAA6C;QAC7C,MAAM,eAAe,GAAG,IAAA,uDAA+B,EAAC,MAAM,CAAC,CAAC;QAChE,MAAM,yBAAyB,GAC7B,MAAM,aAAa,CAAC,2BAA2B,CAAC,eAAe,CAAC,CAAC;QAEnE,IAAA,wDAAgC,EAAC,aAAa,EAAE,MAAM,EAAE,yBAAyB,CAAC,CAAC;QAEnF,MAAM,QAAQ,GAAG,IAAA,yDAAiC,EAAC,MAAM,CAAC,CAAC;QAE3D,qBAAM,CAAC,EAAE,CAAC,yBAAyB,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;QAExE,iCAAiC;QACjC,MAAM,CAAC,OAAO,EAAE,IAAI,CAClB,IAAI,mCAAe,CAAC;YAClB,aAAa;YACb,QAAQ,EAAE,QAAQ;YAClB,mBAAmB,EAAE,cAAc,EAAE,mBAAmB;SACzD,CAAC,CACH,CAAC;IACJ,CAAC;IAAC,OAAO,KAAK,EAAE,CAAC;QACf,IAAA,oBAAK,EAAC,OAAO,EAAE,0BAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;IAC5C,CAAC;IAED,OAAO,MAAM,CAAC;AAChB,CAAC"}

package/dist/webpack-plugin/ze-webpack-plugin.js

@@ -9,6 +9,7 @@ class ZeWebpackPlugin {
     }
     apply(compiler) {
         this._options.zephyr_engine.buildProperties.output = compiler.outputPath;
+        (0, zephyr_xpack_internal_1.detectAndStoreBaseHref)(this._options.zephyr_engine, compiler);
         (0, zephyr_xpack_internal_1.logBuildSteps)(this._options, compiler);
         (0, zephyr_xpack_internal_1.setupZeDeploy)(this._options, compiler);
     }

package/dist/webpack-plugin/ze-webpack-plugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"ze-webpack-plugin.js","sourceRoot":"","sources":["../../src/webpack-plugin/ze-webpack-plugin.ts"],"names":[],"mappings":";;;AAIA,iEAAqE;AAErE,MAAM,UAAU,GAAG,iBAAiB,CAAC;AAarC,MAAa,eAAe;IAG1B,YAAY,OAA+D;QACzE,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC,EAAE,UAAU,EAAE,EAAE,OAAO,CAAC,CAAC;IACzD,CAAC;IAED,KAAK,CAAC,QAAkB;QACtB,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,eAAe,CAAC,MAAM,GAAG,QAAQ,CAAC,UAAU,CAAC;QAEzE,IAAA,qCAAa,EAAC,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;QACvC,IAAA,qCAAa,EAAC,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;IACzC,CAAC;CACF;AAbD,0CAaC"}
+{"version":3,"file":"ze-webpack-plugin.js","sourceRoot":"","sources":["../../src/webpack-plugin/ze-webpack-plugin.ts"],"names":[],"mappings":";;;AAIA,iEAI+B;AAE/B,MAAM,UAAU,GAAG,iBAAiB,CAAC;AAarC,MAAa,eAAe;IAG1B,YAAY,OAA+D;QACzE,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC,EAAE,UAAU,EAAE,EAAE,OAAO,CAAC,CAAC;IACzD,CAAC;IAED,KAAK,CAAC,QAAkB;QACtB,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,eAAe,CAAC,MAAM,GAAG,QAAQ,CAAC,UAAU,CAAC;QACzE,IAAA,8CAAsB,EAAC,IAAI,CAAC,QAAQ,CAAC,aAAa,EAAE,QAAQ,CAAC,CAAC;QAC9D,IAAA,qCAAa,EAAC,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;QACvC,IAAA,qCAAa,EAAC,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;IACzC,CAAC;CACF;AAbD,0CAaC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zephyr-webpack-plugin",
-  "version": "0.0.49",
+  "version": "0.0.51",
   "description": "Webpack plugin for Zephyr",
   "repository": {
     "type": "git",
@@ -20,8 +20,8 @@
     "is-ci": "^4.1.0",
     "tslib": "^2.8.1",
     "webpack": "^5.98.0",
-    "zephyr-agent": "0.0.49",
-    "zephyr-xpack-internal": "0.0.49"
+    "zephyr-xpack-internal": "0.0.51",
+    "zephyr-agent": "0.0.51"
   },
   "devDependencies": {
     "@types/is-ci": "3.0.4",