{"id":14155778,"url":"https://github.com/web-infra-dev/swc-plugins","last_synced_at":"2025-05-07T22:20:38.890Z","repository":{"id":61454368,"uuid":"532811470","full_name":"web-infra-dev/swc-plugins","owner":"web-infra-dev","description":"SWC plugins and binding","archived":false,"fork":false,"pushed_at":"2024-09-09T03:50:49.000Z","size":7064,"stargazers_count":61,"open_issues_count":2,"forks_count":5,"subscribers_count":7,"default_branch":"main","last_synced_at":"2025-05-04T21:15:48.670Z","etag":null,"topics":["plugins","swc"],"latest_commit_sha":null,"homepage":null,"language":"Rust","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/web-infra-dev.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"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}},"created_at":"2022-09-05T08:32:34.000Z","updated_at":"2025-04-07T15:21:28.000Z","dependencies_parsed_at":"2023-02-19T05:46:11.908Z","dependency_job_id":"e342afd3-ba92-4119-899f-1bfcc454cee8","html_url":"https://github.com/web-infra-dev/swc-plugins","commit_stats":{"total_commits":219,"total_committers":9,"mean_commits":"24.333333333333332","dds":0.406392694063927,"last_synced_commit":"7afb2ebab1c7cffdecacc4a4b87ca21bb3f9257c"},"previous_names":["modern-js-dev/swc-plugins"],"tags_count":43,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/web-infra-dev%2Fswc-plugins","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/web-infra-dev%2Fswc-plugins/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/web-infra-dev%2Fswc-plugins/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/web-infra-dev%2Fswc-plugins/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/web-infra-dev","download_url":"https://codeload.github.com/web-infra-dev/swc-plugins/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252962626,"owners_count":21832360,"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":["plugins","swc"],"created_at":"2024-08-17T08:04:59.529Z","updated_at":"2025-05-07T22:20:38.868Z","avatar_url":"https://github.com/web-infra-dev.png","language":"Rust","funding_links":[],"categories":["others"],"sub_categories":[],"readme":"# Modern.js SWC Plugins\n\nThis repo provides an executable with some built-in SWC plugins for [Modern.js](https://github.com/web-infra-dev/modern.js) and other Node.js users.\n\n## Quick start\n\n### Install\n\nInstall the plugin by using:\n\n```bash\n# npm\nnpm add @modern-js/swc-plugins\n\n# yarn\nyarn add @modern-js/swc-plugins\n\n# pnpm\npnpm add @modern-js/swc-plugins\n```\n\n## Contributing\n\nPlease read the [Contributing Guide](./CONTRIBUTING.md).\n\n## Usage\n\n### Transform\n\n```ts\nimport { Compiler } from \"@modern-js/swc-plugins\";\n\nconst compiler = new Compiler({\n  extensions: {\n    pluginImport: [\n      {\n        libraryName: \"foo\",\n      },\n    ],\n  },\n});\nconst { code, map } = compiler.transform(\n  \"/projects/my-app/index.js\",\n  'import { Button } from \"foo\"\\nconsole.log(Button)'\n);\n```\n\n### Minify\n\n```ts\nimport { minify } from '@modern-js/swc-plugins';\nimport * as fs from 'fs';\n\nconst filename = '/projects/my-app/index.js';\nconst { code, map } = minify(\n  filename,\n  fs.readFileSync(filename),\n  config: JsMinifyOptions,\n);\n\n```\n\n## Config\n\n- Type: `PluginConfig`\n\n```ts\ntype PluginConfig = {\n  presetReact?: ReactConfig;\n  presetEnv?: EnvConfig;\n  jsMinify?: boolean | JsMinifyOptions;\n  extensions?: Extensions;\n};\n```\n\n### presetReact\n\n- Type: [presetReact](https://swc.rs/docs/configuration/compilation#jsctransformreact) in SWC.\n\nPorted from `@babel/preset-react`. The value you passed will be merged with default option.\n\nDefault option is:\n\n```ts\n{\n  runtime: 'automatic',\n}\n```\n\n### presetEnv\n\n- Type: [presetEnv](https://swc.rs/docs/configuration/supported-browsers#options) in SWC.\n\nPorted from `@babel/preset-env`. The value you passed will be merged with default option.\n\nDefault option is:\n\n```ts\n{\n  targets: '', // automatic get browserslist from your project, so you don't have to set this field\n  mode: 'usage',\n}\n```\n\n### jsMinify\n\n- Type: `boolean` or [compress configuration](https://terser.org/docs/api-reference.html#compress-options).\n\nDefault option is: `{ compress: {}, mangle: true }`.\n\nIf set it to `false`, then SWC minification will be disabled, if set it to `true` then will it applies default option. If you pass an object, then this object will be merged with default option.\n\n### extensions\n\n- Type: `Object`\n\nSome plugins ported from Babel.\n\n#### extensions.pluginImport\n\n- type\n\n```ts\ntype PluginImport = {\n  libraryName: string;\n  libraryDirectory?: string;\n\n  style?: boolean | \"css\" | string | ((name: string) =\u003e string | undefined);\n  styleLibraryDirectory?: string;\n\n  camelToDashComponentName?: boolean; // default to true\n  transformToDefaultImport?: boolean;\n\n  customName?: string | ((name: string) =\u003e string | undefined);\n  customStyleName?: string | ((name: string) =\u003e string | undefined);\n\n  ignoreEsComponent?: string[];\n  ignoreStyleComponent?: string[];\n}[];\n```\n\nPorted from [babel-plugin-import](https://github.com/umijs/babel-plugin-import).\n\n**libraryName**\n\n- Type: `string`\n\nThe package that need to be transformed，eg. in `import { a } from 'foo'`, `**libraryName**` should be `foo`.\n\n**libraryDirectory**\n\n- Type: `string`\n- Default: `lib`\n\nThe path prefix that to import. For example `Button` will be transformed to `some-lib/lib/button`.\n\n**style**\n\n- Type: `'css' | string | boolean | ((input: string) =\u003e string | undefined)`\n- Default: `undefined`\n\nIf this field is not `undefined` or `false`, the plugin will import style for the given component path.\n\nFor example, let's say the original code is `import { Button } from 'foo'`.\nIf `style` is set to:\n`true`, code will be extended by: `import 'foo/lib/button/style'`.\n`'css`, code will be extended by: `import 'foo/lib/button/style/css'`.\n`(path) =\u003e path + 'less'`, code will be extended by: `import 'foo/lib/button.less'`.\n\n**styleLibraryDirectory**\n\n- Type: `string`\n- Default: `undefined`\n\nIf this field is set, `style` will be ignored.\n\nThis field decides the path of style to import, for example, set this to `'styles'`, `import { Button } from 'foo'` will become:\n\n```ts\nimport Button from \"foo/lib/button\";\nimport \"foo/styles/button\";\n```\n\n**camelToDashComponentName**\n\n- Type: `boolean`\n- Default: `true`\n\nWether to transform specifier to kebab case when added to import path. Eg: `myText` to `foo/lib/my-text`.\n\n**transformToDefaultImport**\n\n- Type: `boolean`\n- Default: `true`\n\nWether to transform this import expression to default import. Eg: `import { Button } from 'foo'` will be transformed to `import { Button } from 'foo/lib/button';`.\n\n**customName**\n\n- Type: `string | ((name: string) =\u003e string | undefined)`\n- Default: `undefined`\n\nYou can use this to customize the transformation.\n\nAssume the original code is:\n\n```ts\nimport { Button, Input } from \"foo\";\n```\n\nAnd set `customName` to:\n\n```ts\nconst customName = (name: string) =\u003e {\n  if (name === \"Button\") {\n    return undefined;\n  } else {\n    return `foo/es/components/${name.toLowercase()}`;\n  }\n};\n```\n\nResult:\n\n```ts\nimport { Button } from \"foo\";\nimport Input from \"foo/es/components/input\";\n```\n\n**customStyleName**\n\n- Type: `string | ((name: string) =\u003e string | undefined)`\n- Default: `undefined`\n\nThe same with `customName`, but just for style import expression.\n\n#### extensions.reactUtils\n\n- Type: `Object`\n\n```ts\ntype ReactUtilsOptions = {\n  autoImportReact?: boolean;\n  removeEffect?: boolean;\n  removePropTypes?: {\n    mode?: \"remove\" | \"unwrap\" | \"unsafe-wrap\";\n    removeImport?: boolean;\n    ignoreFilenames?: string[];\n    additionalLibraries?: string[];\n    classNameMatchers?: string[];\n  };\n};\n```\n\nSome little help utils for `React`.\n\n**reactUtils.autoImportReact**\n\n- Type: `boolean`\n\nAutomatically import `React` as global variable, eg: `import React from 'react'`.\nMostly used for generated `React.createElement`.\n\n**reactUtils.removeEffect**\n\n- Type: `boolean`\n\nRemove `useEffect` call.\n\n**reactUtils.removePropTypes**\n\n- Type:\n\n```ts\ntype RemovePropTypesOptions = {\n  mode?: \"remove\" | \"unwrap\" | \"unsafe-wrap\";\n  removeImport?: boolean;\n  ignoreFilenames?: string[];\n  additionalLibraries?: string[];\n  classNameMatchers?: string[];\n};\n```\n\nRemove `React` runtime type checking. This is ported from [@babel/plugin-react-transform-remove-prop-types](https://github.com/oliviertassinari/babel-plugin-transform-react-remove-prop-types), All the configurations remain the same.\n\n#### extensions.lodash\n\n- Type: `{ cwd?: string; ids?: string;}`\n- Default: `{ cwd: process.cwd(), ids: [] }`\n\nPorted from [@babel/plugin-lodash](https://github.com/lodash/babel-plugin-lodash).\n\nNote there is a small difference that `lodash-compat` is currently deprecated so we do not support `lodash-compat` package.\n\n#### extensions.modularizeImports\n\n- Type:\n\n```ts\ntype ModularizeImports = {\n  [packageName: string]: {\n    transform: string;\n    preventFullImport: boolean;\n    skipDefaultConversion: boolean;\n  };\n};\n```\n\nMore detail on Next.js [modularize-imports](https://nextjs.org/docs/advanced-features/compiler#modularize-imports)\n\n#### extensions.lockCorejsVersion\n\n- Type:\n\n```ts\ntype LockCorejsVersion = {\n  corejs?: string;\n  swcHelpers?: string;\n};\n```\n\nUse this to rewrite `core-js` and `@swc/helpers` import path, this is helpful if you are an author of a library, and that library code contains `@swc/helpers` import, but you don't want your user to specify `@swc/helpers` as dependencies, you can achieve that in the following way.\n\n```ts\n{\n  extensions: {\n    swcHelpers: require(\"path\").dirname(\n      require.resolve(\"@swc/helpers/package.json\")\n    );\n  }\n}\n```\n\nBy doing so, the following code:\n\n```ts\nimport { foo } from \"@swc/helpers\";\n```\n\nwill become something like this:\n\n```ts\nimport { foo } from \"/project/node_modules/your-lib/node_modules/@swc/helpers\";\n```\n\n#### extensions.styledComponents\n\n- Type:\n\n```ts\ntype StyledComponents =\n  | boolean\n  | {\n      displayName?: boolean;\n      // Enabled by default.\n      ssr?: boolean;\n      // Enabled by default.\n      fileName?: boolean;\n      // Empty by default.\n      topLevelImportPaths?: string[];\n      // Defaults to [\"index\"].\n      meaninglessFileNames?: string[];\n      // Enabled by default.\n      cssProp?: boolean;\n      // Empty by default.\n      namespace?: string;\n      // Not supported yet.\n      minify?: boolean;\n      // Not supported yet.\n      transpileTemplateLiterals?: boolean;\n      // Not supported yet.\n      pure?: boolean;\n    };\n```\n\nMore detail at https://nextjs.org/docs/advanced-features/compiler#styled-components\n\n#### extensions.emotion\n\n- Type:\n\n```ts\ntype Emotion = boolean | {\n  // default is true. It will be disabled when build type is production.\n  sourceMap?: boolean,\n  // default is 'dev-only'.\n  autoLabel?: 'never' | 'dev-only' | 'always',\n  // default is '[local]'.\n  // Allowed values: `[local]` `[filename]` and `[dirname]`\n  // This option only works when autoLabel is set to 'dev-only' or 'always'.\n  // It allows you to define the format of the resulting label.\n  // The format is defined via string where variable parts are enclosed in square brackets [].\n  // For example labelFormat: \"my-classname--[local]\", where [local] will be replaced with the name of the variable the result is assigned to.\n  labelFormat?: string,\n  // default is undefined.\n  // This option allows you to tell the compiler what imports it should\n  // look at to determine what it should transform so if you re-export\n  // Emotion's exports, you can still use transforms.\n  importMap?: {\n    [packageName: string]: {\n      [exportName: string]: {\n        canonicalImport?: [string, string],\n        styledBaseImport?: [string, string],\n      }\n    }\n  },\n},\n```\n\nMore detail at https://nextjs.org/docs/advanced-features/compiler#emotion\n\n#### extensions.modernjsSsrLoaderId\n\n- Type: `boolean`\n- Default: `undefined`\n\nEnable some transform only needed by Modern.js\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fweb-infra-dev%2Fswc-plugins","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fweb-infra-dev%2Fswc-plugins","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fweb-infra-dev%2Fswc-plugins/lists"}