Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/feature-sliced/eslint-config
🍰 Lint feature-sliced concepts by existing eslint plugins
https://github.com/feature-sliced/eslint-config
absolute-imports co-location decoupling domain-driven domain-first eslint-config feature-based feature-sliced feature-slices
Last synced: 23 days ago
JSON representation
🍰 Lint feature-sliced concepts by existing eslint plugins
- Host: GitHub
- URL: https://github.com/feature-sliced/eslint-config
- Owner: feature-sliced
- License: mit
- Created: 2021-01-07T19:56:18.000Z (almost 4 years ago)
- Default Branch: master
- Last Pushed: 2024-04-30T22:19:49.000Z (6 months ago)
- Last Synced: 2024-10-06T23:35:22.701Z (28 days ago)
- Topics: absolute-imports, co-location, decoupling, domain-driven, domain-first, eslint-config, feature-based, feature-sliced, feature-slices
- Language: JavaScript
- Homepage: https://npmjs.com/@feature-sliced/eslint-config
- Size: 372 KB
- Stars: 119
- Watchers: 10
- Forks: 4
- Open Issues: 22
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
- awesome - @feature-sliced/eslint-config
README
# [@feature-sliced/eslint-config](https://www.npmjs.com/package/@feature-sliced/eslint-config)
> `WIP:` At the moment at beta-testing - [use carefully](https://github.com/feature-sliced/eslint-config/discussions/75)
[npm]: https://www.npmjs.com/package/@feature-sliced/eslint-config
[![npm](https://img.shields.io/npm/v/@feature-sliced/eslint-config?style=flat-square)][npm]
[![npm](https://img.shields.io/npm/dw/@feature-sliced/eslint-config?style=flat-square)][npm]
[![npm bundle size](https://img.shields.io/bundlephobia/min/@feature-sliced/eslint-config?style=flat-square)][npm]
[![GitHub Workflow Status](https://img.shields.io/github/workflow/status/feature-sliced/eslint-config/Test%20current%20build?label=tests&style=flat-square)](https://github.com/feature-sliced/eslint-config/actions)Linting of [FeatureSliced](https://github.com/feature-sliced/documentation) concepts *by existing eslint-plugins*
- Control [**Isolation**](https://feature-sliced.design/docs/concepts/low-coupling) & [**Decomposition**](https://feature-sliced.design/docs/concepts/app-splitting)
- Control [**Public API**](https://feature-sliced.design/docs/concepts/public-api)
- Control [**Layers & Scopes**](https://feature-sliced.design/docs/reference/layers)
- Control [**Naming**](https://feature-sliced.design/docs/concepts/naming-adaptability)## Rules
Each rule has its own test cases and customization aspects
- [`import-order`](./rules/import-order)
- [`public-api`](./rules/public-api)
- [`layers-slices`](./rules/layers-slices)## Get Started
1. You'll first need to install [ESLint](http://eslint.org):
```sh
$ npm install -D eslint
# or by yarn
$ yarn add -D eslint
```2. Next, install `@feature-sliced/eslint-config` and dependencies:
```sh
$ npm install -D @feature-sliced/eslint-config eslint-plugin-import eslint-plugin-boundaries
# or by yarn
$ yarn add -D @feature-sliced/eslint-config eslint-plugin-import eslint-plugin-boundaries
```3. Add config to the `extends` section of your `.eslintrc` configuration file (for **recommended** rules). You can omit the `eslint-config` postfix:
```json
{
"extends": ["@feature-sliced"]
}
```4. `TYPESCRIPT-ONLY:` Also setup TS-parser and TS-plugin [(why?)](https://github.com/javierbrea/eslint-plugin-boundaries#usage-with-typescript)
Details**Install dependencies:**
```sh
$ npm i -D @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint-import-resolver-typescript
# or by yarn
$ yarn add -D @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint-import-resolver-typescript
```**Configure `@typescript-eslint/parser` as parser and setup the `eslint-import-resolver-typescript` resolver in the `.eslintrc` config file:**
```json
{
"parser": "@typescript-eslint/parser",
"settings": {
"import/resolver": {
"typescript": {
"alwaysTryTypes": true
}
}
}
}
```
## Usage
- Support general **aliases**
```js
import { Input } from "~/shared/ui/input";
import { Input } from "@/shared/ui/input";
import { Input } from "@shared/ui/input";
import { Input } from "$shared/ui/input";
// But not - import { Input } from "$UIKit/input";
```- Support **relative** and **absolute** imports (but look at [recommendations](https://github.com/feature-sliced/eslint-config/issues/29))
```js
import { ... } from "entities/foo"; // absolute imports
import { ... } from "@/entities/foo"; // aliased imports
import { ... } from "../entities/foo"; // relative imports
```- **Case**-agnostic
```js
import { ... } from "entities/user-post"; // Support kebab-case (recommended)
import { ... } from "entities/UserPost"; // Support PascalCase
import { ... } from "entities/userPost"; // Support camelCase
import { ... } from "entities/user_post"; // Support snake_case
```- For exceptional cases, support ⚠️**DANGEROUS-mode**⚠️ (see more for [specific rule](#rules))
## Customization
1. You can *partially use* the rules
> **WARN:** Don't use main config (`"@feature-sliced"`) in customization to avoid rules conflicts.
```js
"extends": [
"@feature-sliced/eslint-config/rules/import-order",
"@feature-sliced/eslint-config/rules/public-api",
"@feature-sliced/eslint-config/rules/layers-slices",
]
```1. You can use *alternative experimental rules*
- Use [`import-order/experimental`](./rules/import-order#Experimental) for formatting with spaces between groups and reversed order of layers [(why?)](https://github.com/feature-sliced/eslint-config/issues/85)```js
"extends": [
// ... Other rules or config
"@feature-sliced/eslint-config/rules/import-order/experimental",
]
```- Use [`public-api/lite`](./rules/public-api#Lite) for less strict PublicAPI boundaries [(why?)](https://github.com/feature-sliced/eslint-config/issues/90)
```js
"extends": [
// ... Other rules or config
"@feature-sliced/eslint-config/rules/public-api/lite",
]
```1. You can use *warnings* instead of *errors* for specific rules
```js
"rules": {
// feature-sliced/import-order
"import/order": "warn" // ~ 1,
// feature-sliced/public-api
"import/no-internal-modules": "warn" // ~ 1,
// feature-sliced/layers-slices
"boundaries/element-types": "warn" // ~ 1,
}
```
1. You can use *[advanced FSD-specific messages processing](https://www.npmjs.com/package/@feature-sliced/eslint-plugin-messages)*```diff
# (feature-sliced/public-api)
- 'Reaching to "features/search/ui" is not allowed.'
+ 'Violated usage of modules Public API | https://git.io/Jymjf'
```## See also
- [FAQ](./FAQ.md)
- [Releases & Changelog](https://github.com/feature-sliced/eslint-config/releases)
- [**How can I help?**](./CONTRIBUTING.md)
- ⭐ Rate us on GitHub
- 💫 **Any assistance is important** - from *feedback to participation in the development of the methodology*!