jsx-ast-utils 3.3.5

The jsx-ast-utils package is an Abstract Syntax Tree (AST) utility module, offering the ability to perform static analysis of JSX syntax. Developed mainly as a significant tool in the creation of linting rules for JSX code, it can be beneficial in writing and implementing novel rules to perform static analysis of JSX.

To utilize jsx-ast-utils in your project, you'll first need to install it. This can be easily accomplished by running the npm install command npm i jsx-ast-utils --save in your terminal. Following successful installation, you can start using it for various purposes. For instance, when creating a linting rule for JSX, you can use the hasProp function to check whether a specific prop exists as an attribute on a JSX element node. Here's an ESLint rule example:

import { hasProp } from 'jsx-ast-utils';

module.exports = context => ({
  JSXOpeningElement: node => {
    const onChange = hasProp(node.attributes, 'onChange');

    if (onChange) {
      context.report({
        node,
        message: `No onChange!`
      });
    }
  }
});

In this example, the JSXOpeningElement is being expected to have an 'onChange' prop. If such a prop isn't found, an error message is triggered.

The jsx-ast-utils documentations and references can be found on the package's repository on GitHub. They provide a detailed explanation of the functions and how each can be used. Information about the JSX spec is available at JSX spec and for the JS spec at JS spec.

They provide in-depth details and examples for core API functions, including but not limited to hasProp, hasAnyProp, hasEveryProp and getProp. They also detail the return types and parameters required by each function. This can be a valuable resource for developers looking to take advantage of this utility module's features.