# @lwc/babel-plugin-component

> Babel plugin to transform a LWC module

Latest version **9.4.3** (published 2026-09-02) · MIT license · 0 weekly downloads

## Install

```sh
npm install @lwc/babel-plugin-component
pnpm add @lwc/babel-plugin-component
yarn add @lwc/babel-plugin-component
bun add @lwc/babel-plugin-component
```

## Health

**Score 70/100 (B)** — status: active.

Positive: has types; esm support; no vulnerabilities; has provenance; recently updated; high maintenance score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 9.4.3 |
| Published | 2026-09-02 |
| First published | 2018-12-12 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Node | >=16.6.0 |
| Dependencies | 4 |
| Unpacked size | 148.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 1791 |
| Maintainers | lwc-admin, caridy, jye-sf, ravi.jayaramappa, jodarove, abdulsattar, rax-it1, lpomerleau |
| Keywords | lwc |

## Links

- npm: https://www.npmjs.com/package/@lwc/babel-plugin-component
- Repository: https://github.com/salesforce/lwc
- Homepage: https://lwc.dev
- Issues: https://github.com/salesforce/lwc/issues
- npm.io page: https://npm.io/package/@lwc/babel-plugin-component

## Dependencies (4)

- [@lwc/errors](https://npm.io/package/@lwc/errors.md) 9.4.3
- [@lwc/shared](https://npm.io/package/@lwc/shared.md) 9.4.3
- [line-column](https://npm.io/package/line-column.md) ~1.0.2
- [@babel/helper-module-imports](https://npm.io/package/@babel/helper-module-imports.md) 7.29.7

## Recent versions

- 9.4.3 (latest) — 2026-09-02
- 9.4.6-alpha.1 (canary) — 2026-09-22
- 9.3.10 (winter27) — 2026-09-21
- 9.1.5 (summer26) — 2026-04-28
- 8.25.1 (spring26) — 2025-11-19
- 8.20.6 (winter26) — 2025-10-20
- 8.16.5 (summer25) — 2025-05-05
- 8.10.3 (spring25) — 2025-01-09
- 7.1.5 (winter25) — 2024-10-10
- 7.0.1-alpha.0 (next) — 2024-06-21
- 6.4.5 (summer24) — 2024-06-05
- 5.0.10 (spring24) — 2024-03-20
- 3.0.4 (winter24) — 2023-10-02
- 2.40.2-lbc (lbc-avante-garde) — 2023-03-21
- 2.31.8 (spring23) — 2023-03-20
- … 877 more at https://npm.io/package/@lwc/babel-plugin-component/versions

## README

# @lwc/babel-plugin-component

## Summary

This babel plugin does the following transform:

- Global decorator transform:
    - Transform `@api` decorator to `publicProperties` and `publicMethods` static properties.
    - Transform `@wire` decorator to `wire` static property.
    - Transform `@track` decorator to `track` static property.
- LWC component class sugar syntax:
    - Check for misspelled lifecycle hooks.
    - Import and inject `render` from a collocated template if a component class doesn't already implement a `render` method.
- Optimization:
    - If the compiler inject the default template a component, it will also wire the template style to the component.

## Installation

    npm install babel @lwc/babel-plugin-component

## Usage

```js
import babel from '@babel/core';
import lwcPlugin from '@lwc/babel-plugin-component';

const source = `
import { LightningElement } from 'lwc';
export default class extends LightningElement {}`;

const { code } = babel.transformSync(source, {
    plugins: [[lwcPlugin, {/* options */}]],
});
```

## Options

- `name` (type: `string`, optional) - name of the component, e.g. `foo` in `x/foo`.
- `namespace` (type: `string`, optional) - namepace of the component, e.g. `x` in `x/foo`.
- `isExplicitImport` (type: `boolean`, optional) - true if this is an explicit import.
- `dynamicImports` (type: `object`, optional) - see below:
    - `loader` (type: `string`, optional) - loader to use at runtime.
    - `strictSpecifier` (type: `boolean`, optional) - true if a strict specifier should be used.
- `instrumentation` (type: `InstrumentationObject`, optional) - instrumentation object to gather metrics and non-error logs for internal use. See the `@lwc/errors` package for details on the interface.
- `apiVersion` (type: `number`, optional) - API version to associate with the compiled component.

---
_Source: https://npm.io/package/@lwc/babel-plugin-component · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
