acorn-jsx

library5.3.2jsnpmunverified

acorn-jsx is a plugin for the Acorn JavaScript parser that provides capabilities to parse React.js JSX syntax. It transforms JSX source code into an Abstract Syntax Tree (AST), which is then consumed by various language tools and transpilers like Babel and Buble. The current stable version is 5.3.2. This package maintains a moderate release cadence, often aligning with updates to the Acorn parser itself or changes in the JSX specification. Its key differentiators include its small footprint, speed, and JavaScript-only implementation, making it a widely adopted core component for JSX parsing in the JavaScript ecosystem. It strictly focuses on parsing to AST, rather than performing any transpilation to ES5-compliant JavaScript.

serialization web-framework

npm install acorn-jsx

github ↗package ↗

INSTALL

IMPORT

SIG · ACORN-JSX

acorn-jsx

serializationjavascriptv5.3.2

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

acorn

✓ const acorn = require('acorn');

✗ import * as acorn from 'acorn';

For acorn-jsx@5.x, Acorn is typically consumed via CommonJS `require` in Node.js environments. While newer Acorn versions may support ESM, `acorn-jsx` examples and typical usage patterns still lean heavily on `require`.

jsx

✓ const jsx = require('acorn-jsx');

✗ import jsx from 'acorn-jsx';

The plugin function is exposed as the CommonJS default export. Ensure you use `require` for consistent behavior with `acorn-jsx@5.x`.

Parser.extend

✓ acorn.Parser.extend(jsx());

✗ acorn.extend(jsx());

The `extend` method is a static method on the `acorn.Parser` class, not directly on the `acorn` module itself. Always call the `jsx` plugin function to get the actual extension object.

Demonstrates how to load the `acorn` parser and extend it with the `acorn-jsx` plugin to parse a JSX code snippet into an AST.

Debug

Known issues

breakingAs of `acorn-jsx@5.2.0`, direct unescaped `}` and `>` characters are forbidden in JSX text content, aligning with the JSX specification. Previously, this was loosely allowed but could lead to malformed ASTs.

fix

Ensure that `}` and `>` characters within JSX text are properly escaped (e.g., `{'}'}` or `&gt;`) if they are not intended to be part of JSX expressions or tags. Review existing JSX text for compliance.

affects: >=5.2.0

deprecatedThe syntax allowing a mix of XML namespaces and object-style access in tag names (e.g., `<namespace:Object.Property />`) was deprecated in `acorn-jsx@3.0` due to not being part of the official JSX specification.

fix

Avoid using mixed XML namespaces and object-style access in tag names. If you absolutely require this non-standard behavior, you can explicitly enable it by passing `{ allowNamespacedObjects: true }` to the `jsx()` plugin function.

affects: >=3.0.0

gotchaBy default, `acorn-jsx` enables support for XML namespaces (`allowNamespaces: true`) for spec compliance. However, many React applications do not utilize JSX namespaces, and this default might not be desired.

fix

If your application does not use JSX namespaces and you want to prohibit them (e.g., for stricter parsing or to prevent unexpected syntax), explicitly pass `{ allowNamespaces: false }` to the `jsx()` plugin function when extending the parser.

affects: >=1.0.0

gotcha`acorn-jsx` is a plugin and requires `acorn` as a peer dependency. Ensure that a compatible version of `acorn` (e.g., `^6.0.0 || ^7.0.0 || ^8.0.0` for `acorn-jsx@5.x`) is installed in your project.

fix

Install `acorn` explicitly via `npm install acorn` or `yarn add acorn`, ensuring the installed version matches the peer dependency range specified by `acorn-jsx`.

affects: All versions

Errors

Common errors & fixes

SyntaxError: Unexpected token (\d:\d)

Often occurs when JSX content contains an unescaped `}` or `>` character in text context, which became a parsing error in `acorn-jsx@5.2.0`.

fix

Escape special characters like `}` or `>` in JSX text (e.g., by wrapping them in `{}` as `{'}'}` or using HTML entities like `&gt;`) or ensure they are part of valid JSX expressions/tags.

TypeError: acorn.Parser.extend is not a function

This usually means that the `acorn` module was not correctly loaded or `acorn-jsx` was not properly imported/called before attempting to extend the parser.

fix

Verify that `const acorn = require('acorn');` is correctly executed and that you are calling `jsx()` as `acorn.Parser.extend(jsx()).parse(...)`.

SyntaxError: Identifier expected (\d:\d) (e.g., for <namespace:Object.Property />)

Attempting to parse deprecated XML namespace with object-style access syntax without enabling `allowNamespacedObjects` option.

fix

If this syntax is absolutely necessary (though not spec-compliant), pass `{ allowNamespacedObjects: true }` to the `jsx()` plugin function: `acorn.Parser.extend(jsx({ allowNamespacedObjects: true }))`.

npm WARN acorn-jsx@5.3.2 requires a peer of acorn@^6.0.0 || ^7.0.0 || ^8.0.0 but none is installed.

The required peer dependency `acorn` is either missing or an incompatible version is installed.

fix

Install a compatible version of `acorn` using `npm install acorn@^8` (or `^6`, `^7` depending on preference) to satisfy the peer dependency warning.

Upgrade

Version history

5.3.2latest on npm

Audit

Dependencies

acornrequiredCore JavaScript parser that acorn-jsx extends. Required as a peer dependency.

Agent activity

56 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/acornjs/acorn-jsx ↗

packagehttps://www.npmjs.com/package/acorn-jsx ↗