Detects Position Of JSX Tag In JavaScript File.

Usage no npm install needed!

<script type="module">
  import aLaDetectJsx from 'https://cdn.skypack.dev/@a-la/detect-jsx';



npm version

@a-la/detect-jsx Detects Position Of JSX Tag In JavaScript File.

yarn add -E @a-la/detect-jsx

Table Of Contents


The package is available by importing its default function:

import detectJsx from '@a-la/detect-jsx'

  string: string,
): number

Returns the position of the first JSX tag by evaluating the code using Node's vm package: since JSX reference will throw an error, this error can be caught and used to find out the index of the opening < symbol in JSX.

For example, given the following JSX component:

const Component = ({ example }) => (
  <div class="Test" id={example}></div>

It is possible to detect where JSX starts:

/* yarn example/ */
import read from '@wrote/read'
import detectJSX from '@a-la/detect-jsx'

(async () => {
  const code = await read('example/Component.jsx')
  const res = detectJSX(code)


(c) À La Mode 2019