A TypeScript ESLint ruleset designed for large teams and projects
npm install @sync-labs/eslint-config@sync-labs/eslint-config package was specifically
@sync-labs/eslint-config package has direct dependencies on all the ESLint plugins
@sync-labs/eslint-config rules have been vetted on large production monorepos, across
@sync-labs/eslint-config ruleset is designed to be used together with
sh
$ cd your-project-folder
$ npm install --save-dev eslint
$ npm install --save-dev typescript
$ npm install --save-dev @sync-labs/eslint-config
`
$3
The ruleset currently supports three different "profile" strings, which select lint rules applicable for
your project:
- @sync-labs/eslint-config/profile/node - This profile enables lint rules intended for a general Node.js project,
typically a web service. It enables security rules that assume the service could receive malicious inputs from an
untrusted user.
- @sync-labs/eslint-config/profile/node-trusted-tool - This profile enables lint rules intended for a Node.js project
whose inputs will always come from a developer or other trusted source. Most build system tasks are like this,
since they operate exclusively on files prepared by a developer. This profile disables certain security rules that
would otherwise prohibit APIs that could cause a denial-of-service by consuming too many resources, or which might
interact with the filesystem in unsafe ways. Such activities are safe and commonplace for a trusted tool.
DO NOT use this profile for a library project that might also be loaded by a Node.js service.
- @sync-labs/eslint-config/profile/web-app - This profile enables lint rules intended for a web application, for
example security rules that are relevant to web browser APIs such as DOM.
_Also use this profile if you are creating a library that can be consumed by both Node.js and web applications._
After choosing a profile, create an .eslintrc.js config file that provides the NodeJS __dirname context
for TypeScript. Add your profile string in the extends field, as shown below:
.eslintrc.js
`ts
// This is a workaround for https://github.com/eslint/eslint/issues/3458
require('@sync-labs/eslint-config/patch/modern-module-resolution');
module.exports = {
extends: [ "@sync-labs/eslint-config/profile/node" ], // <---- put your profile string here
parserOptions: { tsconfigRootDir: __dirname }
};
`
The @sync-labs/eslint-config ruleset is intended to be used with the Prettier code formatter. For general
instructions on setting that up, please refer to the Prettier docs.
For Rush-specific settings, see the article
Rush: Enabling Prettier.
$3
Optionally, you can add some "mixins" to your extends array to opt-in to some extra behaviors.
Important: Your .eslintrc.js "extends" field must load mixins after the profile entry.
#### @sync-labs/eslint-config/mixins/react
For projects using the React library, the "@sync-labs/eslint-config/mixins/react" mixin
enables some recommended additional rules. These rules are selected via a mixin because they require you to:
- Add "jsx": "react" to your tsconfig.json
- Configure your settings.react.version as shown below. This determines which React APIs will be considered
to be deprecated. (If you omit this, the React version will be detected automatically by
loading the entire React library
into the linter's process, which is costly.)
Add the mixin to your "extends" field like this:
.eslintrc.js
`ts
// This is a workaround for https://github.com/eslint/eslint/issues/3458
require('@sync-labs/eslint-config/patch/modern-module-resolution');
module.exports = {
extends: [
"@sync-labs/eslint-config/profile/web-app",
"@sync-labs/eslint-config/mixins/react" // <----
],
parserOptions: { tsconfigRootDir: __dirname },
settings: {
react: {
"version": "16.9" // <----
}
}
};
`
#### @sync-labs/eslint-config/mixins/tsdoc
If your project is using API Extractor or another tool that uses
the TSDoc standard for doc comments, it's recommended to use the
"@sync-labs/eslint-config/mixins/tsdoc" mixin. It will enable
eslint-plugin-tsdoc validation for TypeScript doc comments.
Add the mixin to your "extends" field like this:
.eslintrc.js
`ts
// This is a workaround for https://github.com/eslint/eslint/issues/3458
require('@sync-labs/eslint-config/patch/modern-module-resolution');
module.exports = {
extends: [
"@sync-labs/eslint-config/profile/node",
"@sync-labs/eslint-config/profile/mixins/tsdoc" // <----
],
parserOptions: { tsconfigRootDir: __dirname }
};
``