{"id":17956779,"url":"https://github.com/steverep/transform-async-modules-webpack-plugin","last_synced_at":"2025-03-25T02:31:27.706Z","repository":{"id":212685070,"uuid":"729651938","full_name":"steverep/transform-async-modules-webpack-plugin","owner":"steverep","description":"A Webpack plugin to transpile async module output using Babel. Allows transpiling top level await to ES5.","archived":false,"fork":false,"pushed_at":"2025-03-16T22:32:26.000Z","size":1057,"stargazers_count":4,"open_issues_count":2,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-19T07:04:56.728Z","etag":null,"topics":["async-modules","babel-preset-env","es5","top-level-await","webpack-plugin"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/steverep.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":["steverep"]}},"created_at":"2023-12-09T22:45:22.000Z","updated_at":"2025-03-16T22:32:28.000Z","dependencies_parsed_at":"2023-12-23T02:37:55.559Z","dependency_job_id":"d48e26a3-0df2-47ea-bbdd-e0d2118c00c1","html_url":"https://github.com/steverep/transform-async-modules-webpack-plugin","commit_stats":null,"previous_names":["steverep/transform-async-modules-webpack-plugin"],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steverep%2Ftransform-async-modules-webpack-plugin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steverep%2Ftransform-async-modules-webpack-plugin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steverep%2Ftransform-async-modules-webpack-plugin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steverep%2Ftransform-async-modules-webpack-plugin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/steverep","download_url":"https://codeload.github.com/steverep/transform-async-modules-webpack-plugin/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245385470,"owners_count":20606654,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["async-modules","babel-preset-env","es5","top-level-await","webpack-plugin"],"created_at":"2024-10-29T10:39:46.644Z","updated_at":"2025-03-25T02:31:27.425Z","avatar_url":"https://github.com/steverep.png","language":"TypeScript","funding_links":["https://github.com/sponsors/steverep"],"categories":[],"sub_categories":[],"readme":"# Transform Async Modules Webpack Plugin\n\n[![NPM Version](https://img.shields.io/npm/v/transform-async-modules-webpack-plugin)](https://www.npmjs.com/package/transform-async-modules-webpack-plugin)\n\n## What it solves\n\n[Webpack](https://webpack.js.org) converts uses of top level `await` expressions into modules that are wrapped in an `async function`. Since transpilation usually happens when modules are loaded, the resulting chunks still contain these wrappers. Thus they are not compatible with legacy browsers or other environments that do not support ES2017 or later.\n\n## How it works\n\nThe plugin works by transforming async modules using [Babel](https://babeljs.io) right before they are ready to be written to a chunk. It is expected that modules are already transpiled (e.g. by using [`babel-loader`](https://www.npmjs.com/package/babel-loader)), so the primary transformations occurring are simply to the `async function`:\n\n1. [`@babel/plugin-transform-async-to-generator`](https://babeljs.io/docs/babel-plugin-transform-async-to-generator) to convert to a generator function, and\n2. [`@babel/plugin-transform-regenerator`](https://babeljs.io/docs/babel-plugin-transform-regenerator) to convert the ES2015 generator\n\nWhether or not each transformation happens will depend on the target browsers passed to the plugin.\n\nAny `devTool` (source maps) option used in Webpack is supported. This includes \"eval\" options as the transform occurs right before the modules are wrapped in `eval()`.\n\n## Usage\n\nInstall the package from NPM and require or import it for your Webpack configuration:\n\n```js\nconst {\n  TransformAsyncModulesPlugin,\n} = require(\"transform-async-modules-webpack-plugin\");\n```\n\nor\n\n```js\nimport { TransformAsyncModulesPlugin } from \"transform-async-modules-webpack-plugin\";\n```\n\nThen add an instance to the plugins array:\n\n```js\nexport default {\n  // ... other Webpack config\n  plugins: [\n    // ... other plugins\n    new TransformAsyncModulesPlugin(options),\n  ],\n};\n```\n\n## Options\n\nThe plugin takes the following options, all of which are optional:\n\n```ts\ninterface TransformAsyncModulesPluginOptions {\n  targets?: Targets;\n  browserslistConfigFile?: boolean;\n  browserslistEnv?: string;\n  runtime?: boolean | RuntimeOptions;\n}\n```\n\n### targets, browserslistConfigFile, and browserslistEnv\n\nControls how the async modules will be transpiled. These properties are a subset of [Babel options to specify targets](https://babeljs.io/docs/options#output-targets), and are passed directly to Babel.\n\n### runtime\n\nAllows importing helpers and regenerator from `@babel/runtime` instead of repeating them for each async module. If it is falsey, the runtime will not be used. This option takes a subset of relevant [options for `@babel/plugin-transform-runtime`](https://babeljs.io/docs/babel-plugin-transform-runtime#options):\n\n```ts\ninterface RuntimeOptions {\n  absoluteRuntime?: boolean | string;\n  version?: string;\n}\n```\n\nThe default for `version` is the minimum required version for the plugin, so it is recommended this property be specified as the version installed when using the runtime.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsteverep%2Ftransform-async-modules-webpack-plugin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsteverep%2Ftransform-async-modules-webpack-plugin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsteverep%2Ftransform-async-modules-webpack-plugin/lists"}