# babel-plugin-transform-decorators-legacy > A plugin for Babel 6 that (mostly) replicates the old decorator behavior from Babel 5. Latest version **1.3.5** (published 2018-05-30) · MIT license · 0 weekly downloads ## Install ```sh npm install babel-plugin-transform-decorators-legacy pnpm add babel-plugin-transform-decorators-legacy yarn add babel-plugin-transform-decorators-legacy bun add babel-plugin-transform-decorators-legacy ``` ## Health **Score 15/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 1.3.5 | | Published | 2018-05-30 | | First published | 2015-12-02 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 3 | | Unpacked size | 19.9 KB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 810 | | Author | Logan Smyth | | Maintainers | ide, loganfsmyth | | Keywords | babel, babel-plugin, es7, decorators | ## Links - npm: https://www.npmjs.com/package/babel-plugin-transform-decorators-legacy - Repository: https://github.com/loganfsmyth/babel-plugin-transform-decorators-legacy - Homepage: https://github.com/loganfsmyth/babel-plugin-transform-decorators-legacy#readme - Issues: https://github.com/loganfsmyth/babel-plugin-transform-decorators-legacy/issues - npm.io page: https://npm.io/package/babel-plugin-transform-decorators-legacy ## Dependencies (3) - [babel-runtime](https://npm.io/package/babel-runtime.md) ^6.2.0 - [babel-template](https://npm.io/package/babel-template.md) ^6.3.0 - [babel-plugin-syntax-decorators](https://npm.io/package/babel-plugin-syntax-decorators.md) ^6.1.18 ## Alternatives - [@openai/codex-sdk](https://npm.io/package/@openai/codex-sdk.md) — 731.4K weekly downloads - [babel-plugin-transform-react-jsx](https://npm.io/package/babel-plugin-transform-react-jsx.md) — 565.0K weekly downloads - [babel-helper-remove-or-void](https://npm.io/package/babel-helper-remove-or-void.md) — 508.5K weekly downloads - [@pnpm/store-controller-types](https://npm.io/package/@pnpm/store-controller-types.md) — 186.9K weekly downloads - [react-native-signature-canvas](https://npm.io/package/react-native-signature-canvas.md) — 155.6K weekly downloads ## Recent versions - 1.3.5 (latest) — 2018-05-30 - 1.3.4 — 2015-12-20 - 1.3.3 — 2015-12-17 - 1.3.2 — 2015-12-17 - 1.3.1 — 2015-12-14 - 1.3.0 — 2015-12-13 - 1.2.0 — 2015-12-08 - 1.1.0 — 2015-12-03 - 1.0.0 — 2015-12-03 - 0.0.0 — 2015-12-02 ## README # Babel Legacy Decorator plugin This is a plugin for Babel 6 that is meant to replicate the old decorator behavior from Babel 5 in order to allow people to more easily transition to Babel 6 without needing to be blocked on updates to the decorator proposal or for Babel to re-implement it. ## Babel >= 7.x This plugin is specifically for Babel 6.x. If you're using Babel 7, this plugin is not for you. Babel 7's `@babel/plugin-proposal-decorators` officially supports the same logic that this plugin has, but integrates better with Babel 7's other plugins. You can enable this with ```json { "plugins": [ ["@babel/plugin-proposal-decorators", { "legacy": true }], ] } ``` in your Babel configuration. Note that `legacy: true` is specifically needed if you want to get the same behavior as `transform-decorators-legacy` because there are newer versions of the decorator specification coming out, and they do not behave the same way as this plugin does. ## Installation & Usage $ npm install --save-dev babel-plugin-transform-decorators-legacy Add the following line to your .babelrc file: { "plugins": ["transform-decorators-legacy"] } #### NOTE: Order of Plugins Matters! If you are including your plugins manually and using `transform-class-properties`, make sure that `transform-decorators-legacy` comes *before* `transform-class-properties`. ```js /// WRONG "plugins": [ "transform-class-properties", "transform-decorators-legacy" ] // RIGHT "plugins": [ "transform-decorators-legacy", "transform-class-properties" ] ``` ## Why "legacy"? Decorators are still only a relatively new proposal, and they are (at least currently) still in flux. Many people have started to use them in their original form, where each decorator is essentially a function of the form function(target, property, descriptor){} This form is very likely to change moving forward, and Babel 6 did not wish to support the older form when it was known that it would change in the future. As such, I created this plugin to help people transition to Babel 6 without requiring them to drop their decorators or requiring them to wait for the new proposal update and then update all their code. ## Best Effort This plugin is a best effort to be compatible with Babel 5's transpiler output, but there are a few things that were difficult to reproduce, and a few things that were simply incorrect in Babel 5 with respect to the decorators proposal. Two main things to mention as differences, though not things you are likely to encounter: 1. Decorators expressions are evaluated top to bottom, and executed bottom to top. e.g. ``` function dec(id){ console.log('evaluated', id); return (target, property, descriptor) => console.log('executed', id); } class Example { @dec(1) @dec(2) method(){} } ``` In Babel 5, this would output: ``` evaluated 2 evaluated 1 executed 2 executed 1 ``` With this plugin, it will result in: ``` evaluated 1 evaluated 2 executed 2 executed 1 ``` which is what the spec dictates as the correct behavior and was incorrect in Babel 5. 2. Static class property initializers are evaluated once up front. If you decorate a static class property, you will get a descriptor with an `initializer` property. However whereas with Babel 5 this could be re-executed multiple times with potentially differing results, `decorators-legacy` will precompute the value and return an initializer that will return that value. e.g. ``` function dec(target, prop, descriptor){ let {initializer} = descriptor; delete descriptor.initializer; delete descriptor.writable; descriptor.get = function(){ return initializer.call(this); }; } var i = 0; class Example { @dec static prop = i++; } ``` In Babel 5, every access to `prop` would increment `i`. In Babel 6, the very first value of `i` will be cached for future `initializer` calls. The spec is a little vague around how initializers work for repeat calls, and I'd consider calling an `initializer` multiple times to be a mistake in general, so hopefully this will not cause anyone trouble. ## License MIT (c) 2015 --- _Source: https://npm.io/package/babel-plugin-transform-decorators-legacy · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._