❤
npm
Sign UpSign In

babel-plugin-transform-class-property-arrow-to-bind

1.1.0 • Public • Published

babel-plugin-transform-class-property-arrow-to-bind

npm version

Babel plugin for transform arrow functions in class to bind in constructor, fork of louisscruz's plugin

Example:

class A {
  method() {
    return 'Hello';
  }
}
 
class A1 extends A {
  method() {
    return super.method() + ' World';
  }
}
 
 
class B {
  test3 = 1337;
  method = () => {
    return 'Hello';
  }
  method2 = async () => {
    const result = await new Promise((res) => {
      setTimeout(() => res('Hello Async'), 1000);
    });
    return result;
  }
}
 
class B1 extends B {
  test = 123;
  test2 = 456;
  method = () => {
    return super.method() + ' World';
  }
  method2 = async () => {
    const result = await super.method2() + ' World';
    console.log(result);
  }
}
 
 
const a = new A1();
const b = new B1();
 
console.log(a.method())
console.log(b.method())

transforming to

class A {
  method() {
    return 'Hello';
  }
 
}
 
class A1 extends A {
  method() {
    return super.method() + ' World';
  }
 
}
 
class B {
  constructor() {
    this.test3 = 1337;
    this.method = this.method.bind(this);
    this.method2 = this.method2.bind(this);
  }
 
  method() {
    return 'Hello';
  }
 
  async method2() {
    const result = await new Promise(res => {
      setTimeout(() => res('Hello Async'), 1000);
    });
    return result;
  }
 
}
 
class B1 extends B {
  constructor(...args) {
    super(...args);
    this.test = 123;
    this.test2 = 456;
    this.method = this.method.bind(this);
    this.method2 = this.method2.bind(this);
  }
 
  method() {
    return super.method() + ' World';
  }
 
  async method2() {
    const result = (await super.method2()) + ' World';
    console.log(result);
  }
 
}
 
const a = new A1();
const b = new B1();
console.log(a.method());
console.log(b.method());

Installation

npm install --save-dev babel-plugin-transform-class-property-arrow-to-bind

yarn add --dev babel-plugin-transform-class-property-arrow-to-bind

Usage

This plugin does not handle the transformation of class properties themselves. For that, you will likely need to use babel-plugin-proposal-class-properties.

Via .babelrc (Recommended)

{
  "plugins": ["transform-class-property-arrow-to-bind"]
}

Via CLI

babel --plugins transform-class-property-arrow-to-bind script.js

Via Node API

require('babel-core').transform('code', {
  plugins: ['transform-class-property-arrow-to-bind']
});

Readme

Keywords

Package Sidebar

Install

npm i babel-plugin-transform-class-property-arrow-to-bind

Repository

github.com/ga2mer/babel-plugin-transform-class-property-arrow-to-bind

Homepage

github.com/ga2mer/babel-plugin-transform-class-property-arrow-to-bind#readme

Weekly Downloads

3

Version

1.1.0

License

ISC

Unpacked Size

7.62 kB

Total Files

5

Last publish

Collaborators

  • ga2mer
Try on RunKit
Report malware