Projekt

Obecné

Profil

Stáhnout (1.79 KB) Statistiky
| Větev: | Revize:
1
# babel-plugin-transform-react-jsx
2

    
3
> Turn JSX into React function calls
4

    
5
## Example
6

    
7
### React
8

    
9
**In**
10

    
11
```javascript
12
var profile = <div>
13
  <img src="avatar.png" className="profile" />
14
  <h3>{[user.firstName, user.lastName].join(' ')}</h3>
15
</div>;
16
```
17

    
18
**Out**
19

    
20
```javascript
21
var profile = React.createElement("div", null,
22
  React.createElement("img", { src: "avatar.png", className: "profile" }),
23
  React.createElement("h3", null, [user.firstName, user.lastName].join(" "))
24
);
25
```
26

    
27
### Custom
28

    
29
**In**
30

    
31
```javascript
32
/** @jsx dom */
33

    
34
var { dom } = require("deku");
35

    
36
var profile = <div>
37
  <img src="avatar.png" className="profile" />
38
  <h3>{[user.firstName, user.lastName].join(' ')}</h3>
39
</div>;
40
```
41

    
42
**Out**
43

    
44
```javascript
45
/** @jsx dom */
46

    
47
var dom = require("deku").dom;
48

    
49
var profile = dom( "div", null,
50
  dom("img", { src: "avatar.png", className: "profile" }),
51
  dom("h3", null, [user.firstName, user.lastName].join(" "))
52
);
53
```
54

    
55
## Installation
56

    
57
```sh
58
npm install --save-dev babel-plugin-transform-react-jsx
59
```
60

    
61
## Usage
62

    
63
### Via `.babelrc` (Recommended)
64

    
65
**.babelrc**
66

    
67
Without options:
68

    
69
```json
70
{
71
  "plugins": ["transform-react-jsx"]
72
}
73
```
74

    
75
With options:
76

    
77
```json
78
{
79
  "plugins": [
80
    ["transform-react-jsx", {
81
      "pragma": "dom" // default pragma is React.createElement
82
    }]
83
  ]
84
}
85
```
86

    
87
### Via CLI
88

    
89
```sh
90
babel --plugins transform-react-jsx script.js
91
```
92

    
93
### Via Node API
94

    
95
```javascript
96
require("babel-core").transform("code", {
97
  plugins: ["transform-react-jsx"]
98
});
99
```
100

    
101
## Options
102

    
103
### `pragma`
104

    
105
`string`, defaults to `React.createElement`.
106

    
107
Replace the function used when compiling JSX expressions.
108

    
109
Note that the `@jsx React.DOM` pragma has been deprecated as of React v0.12
110

    
111
### `useBuiltIns`
112

    
113
`boolean`, defaults to `false`.
114

    
115
When spreading props, use `Object.assign` directly instead of Babel's extend helper.
(2-2/3)