# lint-config-web

> from eslint-config-react-app@5.0.2

Latest version **2.0.2** (published 2021-05-15) · MIT license · 0 weekly downloads

## Install

```sh
npm install lint-config-web
pnpm add lint-config-web
yarn add lint-config-web
bun add lint-config-web
```

Provides the command `lint-config-web`.

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.0.2 |
| Published | 2021-05-15 |
| First published | 2021-05-15 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 19 |
| Unpacked size | 36.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | yanrong.tian |
| Maintainers | ucdbook |
| Keywords | eslint |

## Links

- npm: https://www.npmjs.com/package/lint-config-web
- npm.io page: https://npm.io/package/lint-config-web

## Dependencies (19)

- [husky](https://npm.io/package/husky.md) ^4.0.7
- [eslint](https://npm.io/package/eslint.md) ^6.x
- [prettier](https://npm.io/package/prettier.md) 1.19.1
- [stylelint](https://npm.io/package/stylelint.md) ^10.0.1
- [lint-staged](https://npm.io/package/lint-staged.md) ^10.0.0
- [babel-eslint](https://npm.io/package/babel-eslint.md) ^10.x
- [stylelint-order](https://npm.io/package/stylelint-order.md) ^3.0.0
- [eslint-plugin-react](https://npm.io/package/eslint-plugin-react.md) ^7.x
- [eslint-plugin-import](https://npm.io/package/eslint-plugin-import.md) ^2.x
- [eslint-config-prettier](https://npm.io/package/eslint-config-prettier.md) ^4.1.0
- [eslint-formatter-pretty](https://npm.io/package/eslint-formatter-pretty.md) ^2.1.1
- [@typescript-eslint/parser](https://npm.io/package/@typescript-eslint/parser.md) ^2.x
- [eslint-plugin-react-hooks](https://npm.io/package/eslint-plugin-react-hooks.md) ^1.x
- [stylelint-config-prettier](https://npm.io/package/stylelint-config-prettier.md) ^5.2.0
- [stylelint-config-standard](https://npm.io/package/stylelint-config-standard.md) ^18.3.0
- [stylelint-config-css-modules](https://npm.io/package/stylelint-config-css-modules.md) ^1.4.0
- [stylelint-config-rational-order](https://npm.io/package/stylelint-config-rational-order.md) ^0.1.2
- [@typescript-eslint/eslint-plugin](https://npm.io/package/@typescript-eslint/eslint-plugin.md) ^2.x
- [stylelint-declaration-block-no-ignored-properties](https://npm.io/package/stylelint-declaration-block-no-ignored-properties.md) ^2.1.0

## Alternatives

- [eslint-plugin-sonarjs](https://npm.io/package/eslint-plugin-sonarjs.md) — 2.9M weekly downloads
- [eslint-config-expo](https://npm.io/package/eslint-config-expo.md) — 1.5M weekly downloads
- [@matter/protocol](https://npm.io/package/@matter/protocol.md) — 63.5K weekly downloads
- [@eventcatalog/linter](https://npm.io/package/@eventcatalog/linter.md) — 24.8K weekly downloads
- [@pandacss/eslint-plugin](https://npm.io/package/@pandacss/eslint-plugin.md) — 18.7K weekly downloads

## Recent versions

- 2.0.2 (latest) — 2021-05-15

## README

# lint-config-web

用于智能化react技术栈项目的编码语法规范、格式规范检查, 及保存文件时, 根据此规范，编辑器中提示或自动fix或通过prettier进行格式化。
## 包含四部分:
1. js、ts的编码规范、输写规范： eslint的规范";
2. 样式编码规范: stylelint;
3. 格式化处理: prettier;
4. git提交时lint检查: husky、lint-staged; (lint验查失败、git提交会被阻止)

## 安装vscode插件
为了在编辑代码文件时，或保存文件时，能够通过编辑器功能（高亮波浪下划线）：
1. 提示eslint检验后错误项，并支持在保存时自动修复能修复的，如强制单引、强制缩进；
2. 在输入、保存、粘贴时，根据prettier规则自动格式化: 强制单引、强制缩进、是否换行；

播件有：
  - ESlint
  - Prettier - Code formatter


## 在项目中进行配置

### 第一步：安装依赖(在项目根目录终端执行)
```
npm i lint-config-web --save-dev -S

npm run lint-config-web

```

### 第二步：项目的package.json加上scripts、husky、lint-staged
```
{
  ...
  "scripts": {
    ...
    "lint": "npm run lint:js && npm run lint:style",
    "lint:js": "eslint --cache --ext .js,.jsx,.ts,.tsx ./src",
    "lint:style": "stylelint --fix \"src/**/*.less\" --syntax less",
    "prettier": "prettier -c --write \"**/*\"",
    "lint-staged": "lint-staged"
  },
  "husky": {
    "hooks": {
      "pre-commit": "npm run lint-staged"
    }
  },
  "lint-staged": {
    "**/*.less": "stylelint --syntax less",
    "**/*.{js,jsx,ts,tsx}": "npm run lint"
  },
  ...
}
```

### 第三步：lint初始化
```
npm run lint:init
```
lint初始化，会在项目根目录创建或修改以下文件, 目的是把lint-config-web中的规则应用到当前项目中，.vscode > settings.json中的内容，定义了当前项目，在编辑是、保存时，是否进行eslint修复及prettier自动格式化。
  - .vscode
    - settings.json  //根据当前项目在保存时定义:1)eslint检查,自动修复, 2)是否prettier自动化格式
  - .editorconfig    //编辑器中新建文件时，会以这个配置定义缩进、charset等
  - .eslintignore    //不进行eslint检查的文件
  - .eslintrc.js     //lint-config-web eslint规则的引入, 并且可以在这增加规则项。
  - .prettierignore  //不进行自动格式化的文件
  - .prettierrc.js   //lint-config-web prettier规则的引入
  - .stylelintrc.js  //lint-config-web stylelint规则的引入

---
_Source: https://npm.io/package/lint-config-web · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._