https://github.com/flying-sheep/babel-plugin-transform-react-createelement-to-jsx

:leftwards_arrow_with_hook: Transforms React.createElement calls to JSX syntax
https://github.com/flying-sheep/babel-plugin-transform-react-createelement-to-jsx

Last synced: about 1 month ago
JSON representation

:leftwards_arrow_with_hook: Transforms React.createElement calls to JSX syntax

• Host: GitHub
• URL: https://github.com/flying-sheep/babel-plugin-transform-react-createelement-to-jsx
• Owner: flying-sheep
• License: gpl-3.0
• Created: 2016-01-22T15:18:46.000Z (almost 9 years ago)
• Default Branch: master
• Last Pushed: 2021-01-30T12:05:27.000Z (almost 4 years ago)
• Last Synced: 2024-11-10T13:20:29.589Z (about 2 months ago)
• Language: JavaScript
• Homepage:
• Size: 28.3 KB
• Stars: 54
• Watchers: 4
• Forks: 12
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# babel-plugin-transform-react-createelement-to-jsx [![build status]][travis] [![npm version]][npm]

[build status]: https://travis-ci.com/flying-sheep/babel-plugin-transform-react-createelement-to-jsx.svg?branch=master

[travis]: https://travis-ci.com/flying-sheep/babel-plugin-transform-react-createelement-to-jsx

[npm version]: https://img.shields.io/npm/v/babel-plugin-transform-react-createelement-to-jsx.svg

[npm]: https://www.npmjs.com/package/babel-plugin-transform-react-createelement-to-jsx

Turn `React.createElement` calls back into JSX syntax.

This is useful for

1. Converting projects that started out in the opinion that “we need no stinking compilers”

2. Converting already-compiled JS into something maintainable (E.g. [CJSX] syntax → [coffee-react-transform] → [decaffeinate] → **react-createelement-to-jsx** → [JSX] syntax)

[CJSX]: https://github.com/jsdf/coffee-react#readme

[coffee-react-transform]: https://github.com/jsdf/coffee-react-transform

[decaffeinate]: https://github.com/eventualbuddha/decaffeinate

[JSX]: https://facebook.github.io/react/docs/jsx-in-depth.html

## Installation

```sh

$ npm install babel-plugin-transform-react-createelement-to-jsx

```

## Usage

### Via `.babelrc` (Recommended)

**.babelrc**

```json

{

  "plugins": [ "transform-react-createelement-to-jsx" ]

}

```

### Via CLI

```sh

$ babel --no-babelrc --plugins transform-react-createelement-to-jsx script.js

```

### Via Node API

```js

import babel from '@babel/core'

babel.transform('code', {

  plugins: ['transform-react-createelement-to-jsx'],

})

```

## Development

If you want to help with corner cases, here are helpful resources:

* [Babylon AST spec](https://github.com/babel/babel/blob/master/doc/ast/spec.md) needed to understand the AST we traverse

* [JSX AST spec](https://github.com/facebook/jsx/blob/master/AST.md) extension of the above, needed to understand what we emit

* [babel-types API](https://github.com/babel/babel/tree/master/packages/babel-types) helpful tests and factories for AST nodes