0.1.4 • Published 10 years ago

jsx-transpiler v0.1.4

Weekly downloads
8
License
-
Repository
github
Last release
10 years ago

jsx-transpiler

This is fork of jsx-recast that uses native and fast AST tools:

  • acorn-jsx for parsing JSX code to JSX AST.
  • estraverse for traversal over AST. * estraverse-fb for enabling traversal over JSX nodes and transforming them to JS nodes.
  • escodegen for generating JS code and source map from AST.

Purpose

Parses and compiles JSX code to JavaScript AST or code.

For example, this:

<X prop={false}><Y /></X>

compiles to this:

X({prop: false}, Y(null));

Benefits

  1. Attaches comments to AST in esprima/escodegen/etc.-compatible way (extra leadingComments + trailingComments properties) when attachComment option is set (feature of esprima@1.2).
  2. When comments are enabled, uses them for parsing and applying /** @jsx CustomDOM */ annotation.
  3. Stores original locations in transformed nodes so source maps work for JSX elements, attributes etc.

Installation

$ npm install jsx-transpiler

Usage

As JSX -> JS AST transformer

jsx.parse('...jsx code...', {
	// ... any Acorn options ...,
	attachComment: true // additional option for comments
});
$ node
> var jsxAst = jsx.parse('<a href="#">Back to top</a>')
(JSX AST)
> jsx.transform(jsxAst)
(JS AST)

As JSX -> JS code with source map transformer

$ node
> var jsx = require('jsx-transpiler')
> jsx.compile(jsxCode)
{ "code": ..., "map": ... }

As browserify plugin

$ browserify -t jsx-transpiler $file