added examples for transforms. [skip ci] (#5393)
This commit is contained in:
@@ -2,6 +2,32 @@
|
||||
|
||||
> Babel plugin to ensure function declarations at the block level are block scoped.
|
||||
|
||||
## Examples
|
||||
|
||||
**In**
|
||||
|
||||
```javascript
|
||||
{
|
||||
function name (n) {
|
||||
return n;
|
||||
}
|
||||
}
|
||||
|
||||
name("Steve");
|
||||
```
|
||||
|
||||
**Out**
|
||||
|
||||
```javascript
|
||||
{
|
||||
var _name = function _name(n) {
|
||||
return n;
|
||||
};
|
||||
}
|
||||
|
||||
name("Steve");
|
||||
```
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
|
||||
@@ -2,6 +2,28 @@
|
||||
|
||||
> Compile ES2015 block scoping (const and let) to ES5
|
||||
|
||||
## Examples
|
||||
|
||||
**In**
|
||||
|
||||
```javascript
|
||||
{
|
||||
let a = 3
|
||||
}
|
||||
|
||||
let a = 3
|
||||
```
|
||||
|
||||
**Out**
|
||||
|
||||
```javascript
|
||||
{
|
||||
var _a = 3;
|
||||
}
|
||||
|
||||
var a = 3;
|
||||
```
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
|
||||
@@ -8,6 +8,42 @@ Built-in classes such as `Date`, `Array`, `DOM` etc cannot be properly subclasse
|
||||
due to limitations in ES5 (for the [es2015-classes](http://babeljs.io/docs/plugins/transform-es2015-classes) plugin).
|
||||
You can try to use [babel-plugin-transform-builtin-extend](https://github.com/loganfsmyth/babel-plugin-transform-builtin-extend) based on `Object.setPrototypeOf` and `Reflect.construct`, but it also has some limitations.
|
||||
|
||||
## Examples
|
||||
|
||||
**In**
|
||||
|
||||
```javascript
|
||||
class Test {
|
||||
constructor(name) {
|
||||
this.name = name;
|
||||
}
|
||||
|
||||
logger () {
|
||||
console.log("Hello", this.name);
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
**Out**
|
||||
|
||||
```javascript
|
||||
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
||||
|
||||
var Test = function () {
|
||||
function Test(name) {
|
||||
_classCallCheck(this, Test);
|
||||
|
||||
this.name = name;
|
||||
}
|
||||
|
||||
Test.prototype.logger = function logger() {
|
||||
console.log("Hello", this.name);
|
||||
};
|
||||
|
||||
return Test;
|
||||
}();
|
||||
```
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
|
||||
@@ -2,6 +2,24 @@
|
||||
|
||||
> Compile ES2015 destructuring to ES5
|
||||
|
||||
## Examples
|
||||
|
||||
**In**
|
||||
|
||||
```javascript
|
||||
let arr = [1,2,3];
|
||||
let {x, y, z} = arr;
|
||||
```
|
||||
|
||||
**Out**
|
||||
|
||||
```javascript
|
||||
var arr = [1, 2, 3];
|
||||
var x = arr.x,
|
||||
y = arr.y,
|
||||
z = arr.z;
|
||||
```
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
|
||||
@@ -2,6 +2,22 @@
|
||||
|
||||
> Apply ES2015 function.name semantics to all functions
|
||||
|
||||
## Examples
|
||||
|
||||
**In**
|
||||
|
||||
```javascript
|
||||
let number = (x) => x
|
||||
```
|
||||
|
||||
**Out**
|
||||
|
||||
```javascript
|
||||
var number = function number(x) {
|
||||
return x;
|
||||
};
|
||||
```
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
|
||||
@@ -2,6 +2,44 @@
|
||||
|
||||
> Compile ES2015 object super to ES5
|
||||
|
||||
## Examples
|
||||
|
||||
**In**
|
||||
|
||||
```javascript
|
||||
let obj = {
|
||||
say () {
|
||||
return "Hello"
|
||||
}
|
||||
}
|
||||
|
||||
let obj2 = {
|
||||
say () {
|
||||
return super.say() + "World!"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
**Out**
|
||||
|
||||
```javascript
|
||||
var _obj;
|
||||
|
||||
var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
|
||||
|
||||
var obj = {
|
||||
say: function say() {
|
||||
return "Hello";
|
||||
}
|
||||
};
|
||||
|
||||
var obj2 = _obj = {
|
||||
say: function say() {
|
||||
return _get(_obj.__proto__ || Object.getPrototypeOf(_obj), "say", this).call(this) + "World!";
|
||||
}
|
||||
};
|
||||
```
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
|
||||
@@ -8,6 +8,33 @@ This plugin transforms ES2015 parameters to ES5, this includes:
|
||||
- Default parameters
|
||||
- Rest parameters
|
||||
|
||||
## Examples
|
||||
|
||||
**In**
|
||||
|
||||
```javascript
|
||||
function test(x = "hello", { a, b }, ...args) {
|
||||
console.log(x, a, b, args);
|
||||
}
|
||||
```
|
||||
|
||||
**Out**
|
||||
|
||||
```javascript
|
||||
function test() {
|
||||
var x = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "hello";
|
||||
var _ref = arguments[1];
|
||||
var a = _ref.a,
|
||||
b = _ref.b;
|
||||
|
||||
for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
|
||||
args[_key - 2] = arguments[_key];
|
||||
}
|
||||
|
||||
console.log(x, a, b, args);
|
||||
}
|
||||
```
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
|
||||
@@ -2,6 +2,20 @@
|
||||
|
||||
> Compile ES2015 sticky regex to an ES5 RegExp constructor
|
||||
|
||||
## Examples
|
||||
|
||||
**In**
|
||||
|
||||
```javascript
|
||||
const a = /o+/y;
|
||||
```
|
||||
|
||||
**Out**
|
||||
|
||||
```javascript
|
||||
var a = new RegExp("o+", "y");
|
||||
```
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
|
||||
Reference in New Issue
Block a user