@hubspot/eslint-config-ui-extensions
v0.8.0
Published
eslint plugins for HubSpot React-based UI Extensions
Downloads
39
Maintainers
Readme
@hubspot/eslint-config-ui-extensions
eslint shareable configs for building UI Extensions on HubSpot with React.
Installation
You'll first need to install ESLint and alongside this package:
npm i --save-dev eslint @hubspot/eslint-config-ui-extensions
Usage
Create an .eslintrc.js file in the root of your project:
module.exports = {
extends: "@hubspot/ui-extensions",
ignorePatterns: ["node_modules", "dist"],
};
For those using TypeScript, we'll likely expand this package to include a base setup in the near future, but in the meantime you can start here and follow these steps to get TS support:
npm i --save-dev @typescript-eslint/parser @typescript-eslint/eslint-plugin
- Adapt your lint script in package.json (if applicable) to make sure you're targeting your source files, perhaps something like
"lint": "npx eslint . --ext .ts,.tsx"
- Update your eslintrc config:
-extends: ['@hubspot/ui-extensions'],
+extends: ['@hubspot/ui-extensions', 'plugin:@typescript-eslint/recommended'],
+plugins: ['@typescript-eslint'],
Running npm run lint
, you should now see TypeScript-aware linting in your terminal output and it will likely automatically work inside your editor of choice as well (though some editors may require additional config steps).
Rules
This config extends the following configs, meaning you can customize the rules
entry in your project-level config to include any rules from these packages: