# jsx-to-js

> Transpile JSX to JS

Latest version **1.0.1** (published 2015-11-06) · MIT license · 0 weekly downloads

## Install

```sh
npm install jsx-to-js
pnpm add jsx-to-js
yarn add jsx-to-js
bun add jsx-to-js
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2015-11-06 |
| First published | 2015-09-05 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 3 |
| Author | Jake Rosoman |
| Maintainers | jkroso |
| Keywords | JSX |

## Links

- npm: https://www.npmjs.com/package/jsx-to-js
- Repository: https://github.com/jkroso/JSX-to-JS
- Homepage: https://github.com/jkroso/JSX-to-JS#readme
- Issues: https://github.com/jkroso/JSX-to-JS/issues
- npm.io page: https://npm.io/package/jsx-to-js

## Dependencies (1)

- [map-ast](https://npm.io/package/map-ast.md) 0

## Recent versions

- 1.0.1 (latest) — 2015-11-06
- 1.0.0 — 2015-11-06
- 0.3.0 — 2015-10-13
- 0.2.0 — 2015-10-12
- 0.1.0 — 2015-09-21
- 0.0.4 — 2015-09-06
- 0.0.3 — 2015-09-05
- 0.0.2 — 2015-09-05
- 0.0.1 — 2015-09-05
- 0.0.0 — 2015-09-05

## README

# JSX-to-JS

Transpiles JSX to JS but tries to be a more JavaScripty than the standard JSX transpiler from Facebook. Not that I am a big fan of JS, but JSX is only supposed to be syntax sugar for defining tree structures in JS. And in this case making it more JavaScripty actually made it sweeter.

## Differences from the standard JSX syntax

1. __Ignores capitalization of tag names__

  Instead it tracks variables and uses them to determine output. So with:

  ```js
  const component = () => <div/>
  <component/>
  ```

  This module produces

  ```js
  JSX(component)
  ```

  While a Standard JSX transpiler would produce

  ```js
  JSX('component')
  ```

2. __Provides ES6 style parameter shorthand__

  If you don't provide a value to a parameter it will default it to a variable with the same name

  ```js
  <component onMousedown isfocused/>
  ```

  This module produces:

  ```js
  JSX(component, {onMousedown: onMousedown, isfocused: isfocused})
  ```

  While a Standard JSX transpiler would produce:

  ```js
  JSX('component', {onMousedown: true, isfocused: true})
  ```

## Installation

`npm install jsx-to-js`

then in your app:

```js
const JSX = require('jsx-to-js')
```

## API

It takes a JSX AST node and returns a JS AST node. Simple as

```js
JSX(parse('<div/>')) // => parse('JSX("div")')
```

## Related projects

- [eslint-plugin-jsx](//github.com/jkroso/eslint-plugin-jsx)

---
_Source: https://npm.io/package/jsx-to-js · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._