eslint-config-bases
/
1.2.25
eslint-config-bases 1.2.25
Install from the command line:
Learn more about npm packages
$ npm install @trifork/eslint-config-bases@1.2.25
Install via package.json:
"@trifork/eslint-config-bases": "1.2.25"
About this version
This is a composable eslint config base for all react apps by Trifork.
- Composable: Compose your workspace eslint config from pre-defined bases.
- Performance: Plugins are enabled on file conventions patterns to increase performance.
- Monorepo friendly: plugins does not need to be installed per workspace. Just install it in the root.
Before installing you need to add the following lines to your .npmrc
file:
@trifork:registry=https://npm.pkg.github.com
//npm.pkg.github.com/:_authToken=${NPM_PKG_GITHUB_TOKEN}
And you need to generate a github token with at least the following permissions: read:packages
.
Save the token in a convenient place and make sure to name it NPM_PKG_GITHUB_TOKEN
echo export NPM_PKG_GITHUB_TOKEN=<your-token> >> ~/.zshrc
Then you can install it using your favorite package manager:
# Using npm
npm install -D eslint @trifork/eslint-config-bases
# Using yarn
yarn add -D eslint @trifork/eslint-config-bases
Create an .eslintrc.js
or .eslintrc.cjs
file that extends any of the existing base configs. E.g.:
// Next line only required if you're in a monorepo
require("@trifork/eslint-config-bases/patch/modern-module-resolution");
module.exports = {
root: true,
parserOptions: {
tsconfigRootDir: __dirname,
project: "tsconfig.json",
},
ignorePatterns: ["**/node_modules", "build", ".next", ".eslintrc.*"],
extends: [
"@trifork/eslint-config-bases/typescript",
"@trifork/eslint-config-bases/sonar",
"@trifork/eslint-config-bases/regexp",
"@trifork/eslint-config-bases/react",
"@trifork/eslint-config-bases/react-query",
"@trifork/eslint-config-bases/jest",
"@trifork/eslint-config-bases/rtl",
// "@trifork/eslint-config-bases/mdx",
// "@trifork/eslint-config-bases/storybook",
// "@trifork/eslint-config-bases/playwright",
// Add specific rules for your framework if needed.
// ie:
// - nextjs: 'next/core-web-vitals',
// - remix: '@remix-run/eslint-config',
// ...
// Post configure the prettier base and run prettier
// without conflicts thx to eslint-plugin-prettier
"@trifork/eslint-config-bases/prettier-plugin",
// Alternatively to the above if you're already running prettier
// we can get a speed up by using on eslint-prettier-config
// "@trifork/eslint-config-bases/prettier-config",
],
rules: {
// Specific global rules for your app or package
// Might help if next eslint plugin does not locate pages
// https://nextjs.org/docs/messages/no-html-link-for-pages#pagesdir
// '@next/next/no-html-link-for-pages': ['error', `${__dirname}/src/pages`],
},
overrides: [
// Specific file rules for your app or package
],
};
There are two ways to work with prettier
-
@trifork/eslint-config-bases/prettier-plugin
- eslint will run prettier under the hood -
@trifork/eslint-config-bases/prettier-config
- eslint will just disable some conflicting rules (so you'll need to run prettier after)
Tune the behaviour by creating a config in .prettierrc.js
// @ts-check
const { getPrettierConfig } = require("@trifork/eslint-config-bases/helpers");
/**
* @type {import('prettier').Config}
*/
module.exports = {
...getPrettierConfig(),
overrides: [
// whatever you need
],
};