{"id":13671310,"url":"https://github.com/prateekbh/babel-esm-plugin","last_synced_at":"2025-04-05T00:06:58.883Z","repository":{"id":39759854,"uuid":"134175245","full_name":"prateekbh/babel-esm-plugin","owner":"prateekbh","description":"Add this plugin to generate mirrored esm modules for your existing bundles","archived":false,"fork":false,"pushed_at":"2023-01-06T01:53:21.000Z","size":869,"stargazers_count":192,"open_issues_count":19,"forks_count":16,"subscribers_count":6,"default_branch":"master","last_synced_at":"2024-10-30T06:58:17.380Z","etag":null,"topics":["babel","es6","javascript","webpack4"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","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/prateekbh.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-05-20T18:18:14.000Z","updated_at":"2024-02-08T19:41:33.000Z","dependencies_parsed_at":"2023-02-05T02:01:04.986Z","dependency_job_id":null,"html_url":"https://github.com/prateekbh/babel-esm-plugin","commit_stats":null,"previous_names":[],"tags_count":13,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prateekbh%2Fbabel-esm-plugin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prateekbh%2Fbabel-esm-plugin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prateekbh%2Fbabel-esm-plugin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prateekbh%2Fbabel-esm-plugin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/prateekbh","download_url":"https://codeload.github.com/prateekbh/babel-esm-plugin/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247266563,"owners_count":20910836,"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":["babel","es6","javascript","webpack4"],"created_at":"2024-08-02T09:01:05.761Z","updated_at":"2025-04-05T00:06:58.860Z","avatar_url":"https://github.com/prateekbh.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# babel-esm-plugin\n![Build Status](https://travis-ci.org/prateekbh/babel-esm-plugin.svg?branch=master)\n\nAdd this plugin to generate mirrored esm modules for your existing bundles. You may use these bundles in `module/nomodule` in your web-app and ship less transpiled code to your users.\nWorks with Webpack4 and Babel7\n\n```\nnpm i -D babel-esm-plugin\n```\n\n### Note\nThis plugin only works when you're already using `babel-preset-env`.\n\nAlso, there is an expectation that your `babel-preset-env` is configured in the shape:\n```\n{\n  use: {\n    loader: 'babel-loader',\n    options: {\n      \"presets\": [[\"@babel/preset-env\", {\n        \"targets\": {\n          \"browsers\": [\"last 2 versions\", \"safari \u003e= 7\"]\n        }\n        ....\n      }]]\n    },\n  },\n}\n```\n\n## Options\n```js\nnew BabelEsmPlugin({\n  filename: '[name].es6.js',\n  chunkFilename: '[id].es6.js',\n  excludedPlugins: [...],\n  additionalPlugins: [...],\n  beforeStartExecution: function(plugins, babelConfig) {}\n});\n```\n1. `filename`: Output name of es6 bundles. (default: '[name].es6.js')\n2. `chunkFilename`: Output name of es6 chunks. (default: '[id].es6.js')\n3. `excludedPlugins`: List of plugins you want to exclude from generating es6 bundles.\n4. `additionalPlugins`: List of plugins you want to add while generating es6 bundles.\n5. `beforeStartExecution`: A callback function which passes all plugins and the new babel config, to a function where the user can modify them before starting the `ESM` build.\n\n## Without this plugin\nA usual output from webpack output looks like this:\n![ES5 output](https://raw.githubusercontent.com/prateekbh/babel-esm-plugin/master/images/es5-screenshot.png)\n\n## With this plugin\nWith this plugin added, you will be generating es6 outputs:\n![ES5 output](https://raw.githubusercontent.com/prateekbh/babel-esm-plugin/master/images/es6-screenshot.png)\n\n## How to use\n```js\n  const BabelEsmPlugin = require('babel-esm-plugin');\n\n  module.exports = {\n    entry: {\n      index: './index.js',\n      home: './index2.js'\n    },\n    output: {\n      filename: \"[name].js\"\n    },\n    module: {\n      rules: [\n        {\n          test: /\\.js$/,\n          exclude: /(node_modules|bower_components)/,\n          use: {\n            loader: 'babel-loader',\n            options: {\n              \"presets\": [[\"@babel/preset-env\", {\n                \"targets\": {\n                  \"browsers\": [\"last 2 versions\", \"safari \u003e= 7\"]\n                }\n              }]]\n            },\n          },\n        }\n      ]\n    },\n    plugins: [\n      new BabelEsmPlugin()\n    ]\n  }\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fprateekbh%2Fbabel-esm-plugin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fprateekbh%2Fbabel-esm-plugin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fprateekbh%2Fbabel-esm-plugin/lists"}