1 | # babel-plugin-transform-es2015-computed-properties
|
2 |
|
3 | > Compile ES2015 computed properties to ES5
|
4 |
|
5 | ## Example
|
6 |
|
7 | **In**
|
8 |
|
9 | ```js
|
10 | var obj = {
|
11 | ["x" + foo]: "heh",
|
12 | ["y" + bar]: "noo",
|
13 | foo: "foo",
|
14 | bar: "bar"
|
15 | };
|
16 | ```
|
17 |
|
18 | **Out**
|
19 |
|
20 | ```js
|
21 | var _obj;
|
22 |
|
23 | function _defineProperty(obj, key, value) {
|
24 | if (key in obj) {
|
25 | Object.defineProperty(obj, key, {
|
26 | value: value,
|
27 | enumerable: true,
|
28 | configurable: true,
|
29 | writable: true
|
30 | });
|
31 | } else {
|
32 | obj[key] = value;
|
33 | }
|
34 |
|
35 | return obj;
|
36 | }
|
37 |
|
38 | var obj = (
|
39 | _obj = {},
|
40 | _defineProperty(_obj, "x" + foo, "heh"),
|
41 | _defineProperty(_obj, "y" + bar, "noo"),
|
42 | _defineProperty(_obj, "foo", "foo"),
|
43 | _defineProperty(_obj, "bar", "bar"),
|
44 | _obj
|
45 | );
|
46 | ```
|
47 |
|
48 | ## Installation
|
49 |
|
50 | ```sh
|
51 | npm install --save-dev babel-plugin-transform-es2015-computed-properties
|
52 | ```
|
53 |
|
54 | ## Usage
|
55 |
|
56 | ### Via `.babelrc` (Recommended)
|
57 |
|
58 | **.babelrc**
|
59 |
|
60 | Without options:
|
61 |
|
62 | ```json
|
63 | {
|
64 | "plugins": ["transform-es2015-computed-properties"]
|
65 | }
|
66 | ```
|
67 |
|
68 | With options:
|
69 |
|
70 | ```json
|
71 | {
|
72 | "plugins": [
|
73 | ["transform-es2015-computed-properties", {
|
74 | "loose": true
|
75 | }]
|
76 | ]
|
77 | }
|
78 | ```
|
79 |
|
80 | ### Via CLI
|
81 |
|
82 | ```sh
|
83 | babel --plugins transform-es2015-computed-properties script.js
|
84 | ```
|
85 |
|
86 | ### Via Node API
|
87 |
|
88 | ```javascript
|
89 | require("babel-core").transform("code", {
|
90 | plugins: ["transform-es2015-computed-properties"]
|
91 | });
|
92 | ```
|
93 |
|
94 | ## Options
|
95 |
|
96 | ### `loose`
|
97 |
|
98 | `boolean`, defaults to `false`
|
99 |
|
100 | Just like method assignment in classes, in loose mode, computed property names
|
101 | use simple assignments instead of being defined. This is unlikely to be an issue
|
102 | in production code.
|
103 |
|
104 | #### Example
|
105 |
|
106 | ***In***
|
107 |
|
108 | ```js
|
109 | var obj = {
|
110 | ["x" + foo]: "heh",
|
111 | ["y" + bar]: "noo",
|
112 | foo: "foo",
|
113 | bar: "bar"
|
114 | };
|
115 | ```
|
116 |
|
117 | ***Out***
|
118 |
|
119 | ```js
|
120 | var _obj;
|
121 |
|
122 | var obj = (
|
123 | _obj = {},
|
124 | _obj["x" + foo] = "heh",
|
125 | _obj["y" + bar] = "noo",
|
126 | _obj.foo = "foo",
|
127 | _obj.bar = "bar",
|
128 | _obj
|
129 | );
|
130 | ```
|