JSPM

  • Created
  • Published
  • Downloads 11026081
  • Score
    100M100P100Q243586F
  • License MIT

Compile class and object decorators to ES5

Package Exports

  • @babel/plugin-proposal-decorators

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@babel/plugin-proposal-decorators) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@babel/plugin-proposal-decorators

Compile class and object decorators to ES5

Example

(examples are from proposal)

Simple class decorator

@annotation
class MyClass { }

function annotation(target) {
   target.annotated = true;
}

Class decorator

@isTestable(true)
class MyClass { }

function isTestable(value) {
   return function decorator(target) {
      target.isTestable = value;
   }
}

Class function decorator

class C {
  @enumerable(false)
  method() { }
}

function enumerable(value) {
  return function (target, key, descriptor) {
     descriptor.enumerable = value;
     return descriptor;
  }
}

Installation

npm install --save-dev @babel/plugin-proposal-decorators

Usage

Add the following line to your .babelrc file:

{
  "plugins": ["@babel/proposal-decorators"]
}

NOTE: Order of Plugins Matters!

If you are including your plugins manually and using proposal-class-properties, make sure that proposal-decorators comes before proposal-class-properties.

Currently, proposal-class-properties must be used in loose mode to support the proposal-decorators. To use proposal-class-properties in spec mode with decorators, wait for the next major version of decorators (Stage 2).

Wrong:

{
  "plugins": [
    "@babel/proposal-class-properties",
    "@babel/proposal-decorators"
  ]
}

Right:

{
  "plugins": [
    "@babel/proposal-decorators",
    ["@babel/proposal-class-properties", { "loose" : true }]
  ]
}

Via CLI

babel --plugins @babel/proposal-decorators script.js

Via Node API

require("@babel/core").transform("code", {
  plugins: ["@babel/proposal-decorators"]
});

References