versot-fe-eslint-config 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.editorconfig +17 -0
- package/.eslintignore +17 -0
- package/.eslintrc.js +5 -0
- package/README.md +286 -0
- package/__tests__/fixtures/es5.js +4 -0
- package/__tests__/fixtures/index.js +3 -0
- package/__tests__/fixtures/node.js +24 -0
- package/__tests__/fixtures/react-display-name.js +7 -0
- package/__tests__/fixtures/react.jsx +132 -0
- package/__tests__/fixtures/ts-import-a.ts +3 -0
- package/__tests__/fixtures/ts-import-b.ts +3 -0
- package/__tests__/fixtures/ts-node.ts +20 -0
- package/__tests__/fixtures/ts-react.tsx +27 -0
- package/__tests__/fixtures/ts-vue.vue +36 -0
- package/__tests__/fixtures/ts.ts +17 -0
- package/__tests__/fixtures/tsconfig.json +7 -0
- package/__tests__/fixtures/use-babel-eslint.jsx +170 -0
- package/__tests__/fixtures/vue.vue +16 -0
- package/__tests__/use-babel-eslint.test.js +47 -0
- package/__tests__/validate-js-configs.test.js +259 -0
- package/__tests__/validate-ts-configs.test.js +257 -0
- package/es5.js +10 -0
- package/essential/es5.js +12 -0
- package/essential/index.js +12 -0
- package/essential/react.js +76 -0
- package/essential/rules/blacklist.js +48 -0
- package/essential/rules/es6-blacklist.js +62 -0
- package/essential/rules/set-style-to-warn.js +30 -0
- package/essential/rules/ts-blacklist.js +15 -0
- package/essential/typescript/index.js +7 -0
- package/essential/typescript/react.js +7 -0
- package/essential/typescript/vue.js +9 -0
- package/essential/vue.js +8 -0
- package/index.js +23 -0
- package/jsx-a11y.js +5 -0
- package/node.js +6 -0
- package/package.json +49 -0
- package/react.js +11 -0
- package/rules/base/best-practices.js +284 -0
- package/rules/base/es6.js +168 -0
- package/rules/base/possible-errors.js +126 -0
- package/rules/base/strict.js +6 -0
- package/rules/base/style.js +445 -0
- package/rules/base/variables.js +48 -0
- package/rules/es5.js +11 -0
- package/rules/imports.js +167 -0
- package/rules/jsx-a11y.js +23 -0
- package/rules/node.js +11 -0
- package/rules/react.js +354 -0
- package/rules/typescript.js +807 -0
- package/rules/vue.js +96 -0
- package/typescript/index.js +6 -0
- package/typescript/node.js +6 -0
- package/typescript/react.js +6 -0
- package/typescript/vue.js +10 -0
- package/vue.js +10 -0
package/.editorconfig
ADDED
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
# http://editorconfig.org
|
|
2
|
+
root = true
|
|
3
|
+
|
|
4
|
+
[*]
|
|
5
|
+
indent_style = space
|
|
6
|
+
indent_size = 2
|
|
7
|
+
end_of_line = lf
|
|
8
|
+
charset = utf-8
|
|
9
|
+
trim_trailing_whitespace = true
|
|
10
|
+
insert_final_newline = true
|
|
11
|
+
|
|
12
|
+
[*.md]
|
|
13
|
+
trim_trailing_whitespace = false
|
|
14
|
+
|
|
15
|
+
[makefile]
|
|
16
|
+
indent_style = tab
|
|
17
|
+
indent_size = 4
|
package/.eslintignore
ADDED
package/.eslintrc.js
ADDED
package/README.md
ADDED
|
@@ -0,0 +1,286 @@
|
|
|
1
|
+
# versot-fe-eslint-config
|
|
2
|
+
|
|
3
|
+
> Versot JavaScript TypeScript Node 规范
|
|
4
|
+
|
|
5
|
+
提供了多套配置文件以支持 `JavaScript`、`TypeScript`、`React`、`Vue`、`Node.js` 等多种项目类型。
|
|
6
|
+
|
|
7
|
+
## JavaScript 项目 - versot-fe-eslint-config
|
|
8
|
+
|
|
9
|
+
针对未使用 `React` 或 `Vue` 的原生 `JavaScript` 项目,使用 `ESLint` 原生规则和 [eslint-plugin-import](https://www.npmjs.com/package/eslint-plugin-import) 规则,使用 [@babel/eslint-parser](https://www.npmjs.com/package/@babel/eslint-parser) 作为 `parser`,是本包的默认配置。
|
|
10
|
+
|
|
11
|
+
### 依赖
|
|
12
|
+
|
|
13
|
+
- [@babel/core](https://www.npmjs.com/package/@babel/core)@^7.16.0
|
|
14
|
+
- [@babel/eslint-parser](https://www.npmjs.com/package/@babel/eslint-parser)@^7.16.3
|
|
15
|
+
- [eslint-plugin-import](https://www.npmjs.com/package/eslint-plugin-import)@^2.25.3
|
|
16
|
+
|
|
17
|
+
### 安装
|
|
18
|
+
|
|
19
|
+
```shell
|
|
20
|
+
npm i -D versot-fe-eslint-config @babel/core @babel/eslint-parser eslint-plugin-import
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
### 配置
|
|
24
|
+
|
|
25
|
+
```json
|
|
26
|
+
{
|
|
27
|
+
"extends": ["versot-fe-eslint-config"]
|
|
28
|
+
}
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
## JavaScript + React 项目 - versot-fe-eslint-config/react
|
|
32
|
+
|
|
33
|
+
针对 JS React 项目,继承了默认配置,并启用了 [eslint-plugin-react](https://www.npmjs.com/package/eslint-plugin-react) 和 [eslint-plugin-react-hooks](https://www.npmjs.com/package/eslint-plugin-react-hooks) 的规则。
|
|
34
|
+
|
|
35
|
+
### 依赖
|
|
36
|
+
|
|
37
|
+
- [@babel/core](https://www.npmjs.com/package/@babel/core)@^7.16.0
|
|
38
|
+
- [@babel/eslint-parser](https://www.npmjs.com/package/@babel/eslint-parser)@^7.16.3
|
|
39
|
+
- [eslint-plugin-import](https://www.npmjs.com/package/eslint-plugin-import)@^2.25.3
|
|
40
|
+
- [eslint-plugin-react](https://www.npmjs.com/package/eslint-plugin-react)@^7.17.0
|
|
41
|
+
- [eslint-plugin-react-hooks](https://www.npmjs.com/package/)@^4.2.0
|
|
42
|
+
- [eslint-plugin-jsx-a11y](https://www.npmjs.com/package/eslint-plugin-jsx-a11y)@^6.3.1(可选)
|
|
43
|
+
|
|
44
|
+
### 安装
|
|
45
|
+
|
|
46
|
+
```shell
|
|
47
|
+
npm i -D versot-fe-eslint-config @babel/core @babel/eslint-parser eslint-plugin-import eslint-plugin-react eslint-plugin-react-hooks
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
### 配置
|
|
51
|
+
|
|
52
|
+
```json
|
|
53
|
+
{
|
|
54
|
+
"extends": ["versot-fe-eslint-config/react"]
|
|
55
|
+
}
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
如果需要无障碍能力:
|
|
59
|
+
|
|
60
|
+
```shell
|
|
61
|
+
npm i -D eslint-plugin-jsx-a11y
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
```json
|
|
65
|
+
{
|
|
66
|
+
"extends": ["versot-fe-eslint-config/react", "versot-fe-eslint-config/jsx-a11y"]
|
|
67
|
+
}
|
|
68
|
+
```
|
|
69
|
+
|
|
70
|
+
## JavaScript + Vue 项目 - versot-fe-eslint-config/vue
|
|
71
|
+
|
|
72
|
+
针对 `JS Vue` 的项目,继承了默认配置,并启用了 [eslint-plugin-vue](https://www.npmjs.com/package/eslint-plugin-vue) 插件的规则,使用 [vue-eslint-parser](https://www.npmjs.com/package/vue-eslint-parser) 作为 parser。
|
|
73
|
+
|
|
74
|
+
### 依赖
|
|
75
|
+
|
|
76
|
+
- [@babel/core](https://www.npmjs.com/package/@babel/core)@^7.16.0
|
|
77
|
+
- [@babel/eslint-parser](https://www.npmjs.com/package/@babel/eslint-parser)@^7.16.3
|
|
78
|
+
- [eslint-plugin-import](https://www.npmjs.com/package/eslint-plugin-import)@^2.25.3
|
|
79
|
+
- [vue-eslint-parser](https://www.npmjs.com/package/vue-eslint-parser)@^7.0.0
|
|
80
|
+
- [eslint-plugin-vue](https://www.npmjs.com/package/eslint-plugin-vue)@^7.3.0
|
|
81
|
+
|
|
82
|
+
### 安装
|
|
83
|
+
|
|
84
|
+
```shell
|
|
85
|
+
npm i -D versot-fe-eslint-config @babel/core @babel/eslint-parser eslint-plugin-import vue-eslint-parser eslint-plugin-vue
|
|
86
|
+
```
|
|
87
|
+
|
|
88
|
+
### 配置
|
|
89
|
+
|
|
90
|
+
```json
|
|
91
|
+
{
|
|
92
|
+
"extends": ["versot-fe-eslint-config/vue"]
|
|
93
|
+
}
|
|
94
|
+
```
|
|
95
|
+
|
|
96
|
+
## JavaScript (Node.js) 项目 - versot-fe-eslint-config/node
|
|
97
|
+
|
|
98
|
+
针对 Node.js 项目,继承了默认配置和 [eslint-config-egg 的规则](https://github.com/eggjs/eslint-config-egg/blob/master/lib/rules/node.js),规则由 ESLint 原生规则和 [eslint-plugin-node](https://github.com/mysticatea/eslint-plugin-node) 提供。
|
|
99
|
+
|
|
100
|
+
### 依赖
|
|
101
|
+
|
|
102
|
+
- [@babel/core](https://www.npmjs.com/package/@babel/core)@^7.16.0
|
|
103
|
+
- [@babel/eslint-parser](https://www.npmjs.com/package/@babel/eslint-parser)@^7.16.3
|
|
104
|
+
- [eslint-plugin-import](https://www.npmjs.com/package/eslint-plugin-import)@^2.25.3
|
|
105
|
+
- [eslint-config-egg](https://www.npmjs.com/package/eslint-config-egg)@^10.0.0
|
|
106
|
+
|
|
107
|
+
### 安装
|
|
108
|
+
|
|
109
|
+
```shell
|
|
110
|
+
npm i -D versot-fe-eslint-config @babel/core @babel/eslint-parser eslint-plugin-import eslint-config-egg
|
|
111
|
+
```
|
|
112
|
+
|
|
113
|
+
### 配置
|
|
114
|
+
|
|
115
|
+
```json
|
|
116
|
+
{
|
|
117
|
+
"extends": ["versot-fe-eslint-config/node"]
|
|
118
|
+
}
|
|
119
|
+
```
|
|
120
|
+
|
|
121
|
+
## TypeScript 项目 - versot-fe-eslint-config/typescript
|
|
122
|
+
|
|
123
|
+
针对未使用 `React` 或 `Vue` 的 `TypeScript` 项目,继承了默认配置,并启用了 [@typescript-eslint/eslint-plugin](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/eslint-plugin) 插件的规则,使用 [@typescript-eslint/parser](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/parser) 作为 parser。
|
|
124
|
+
|
|
125
|
+
### 依赖
|
|
126
|
+
|
|
127
|
+
- [@typescript-eslint/parser](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/parser)@^5.0.0
|
|
128
|
+
- [@typescript-eslint/eslint-plugin](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/eslint-plugin)@^5.0.0
|
|
129
|
+
- [eslint-plugin-import](https://www.npmjs.com/package/eslint-plugin-import)@^2.25.3
|
|
130
|
+
- [eslint-import-resolver-typescript](https://www.npmjs.com/package/eslint-import-resolver-typescript)@2
|
|
131
|
+
|
|
132
|
+
### 安装
|
|
133
|
+
|
|
134
|
+
```shell
|
|
135
|
+
npm i -D versot-fe-eslint-config @typescript-eslint/parser @typescript-eslint/eslint-plugin eslint-plugin-import eslint-import-resolver-typescript
|
|
136
|
+
```
|
|
137
|
+
|
|
138
|
+
### 配置
|
|
139
|
+
|
|
140
|
+
```json
|
|
141
|
+
{
|
|
142
|
+
"extends": ["versot-fe-eslint-config/typescript"]
|
|
143
|
+
}
|
|
144
|
+
```
|
|
145
|
+
|
|
146
|
+
需保证项目已安装 `typescript` 依赖,另外如果项目的 `TS` 配置文件不是 `./tsconfig.json`,则需要设置 `.eslintrc` 中的 [parserOptions.project](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/parser#parseroptionsproject) 字段 ,例如:
|
|
147
|
+
|
|
148
|
+
```json
|
|
149
|
+
{
|
|
150
|
+
"extends": "versot-fe-eslint-config/typescript",
|
|
151
|
+
"parserOptions": {
|
|
152
|
+
"project": "./tsconfig.eslint.json"
|
|
153
|
+
}
|
|
154
|
+
}
|
|
155
|
+
```
|
|
156
|
+
|
|
157
|
+
## TypeScript + React 项目 - versot-fe-eslint-config/typescript/react
|
|
158
|
+
|
|
159
|
+
针对 `TS React` 项目,继承了 `JS React` 的配置,并启用了 [@typescript-eslint/eslint-plugin](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/eslint-plugin) 插件的规则,使用 [@typescript-eslint/parser](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/parser) 作为 parser。
|
|
160
|
+
|
|
161
|
+
### 依赖
|
|
162
|
+
|
|
163
|
+
- [@typescript-eslint/parser](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/parser)@^5.0.0
|
|
164
|
+
- [@typescript-eslint/eslint-plugin](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/eslint-plugin)@^5.0.0
|
|
165
|
+
- [eslint-plugin-import](https://www.npmjs.com/package/eslint-plugin-import)@^2.25.3
|
|
166
|
+
- [eslint-import-resolver-typescript](https://www.npmjs.com/package/eslint-import-resolver-typescript)@2
|
|
167
|
+
- [eslint-plugin-react](https://www.npmjs.com/package/eslint-plugin-react)@^7.17.0
|
|
168
|
+
- [eslint-plugin-react-hooks](https://www.npmjs.com/package/eslint-plugin-react-hooks)@^4.2.0
|
|
169
|
+
- [eslint-plugin-jsx-a11y](https://www.npmjs.com/package/eslint-plugin-jsx-a11y)@^6.3.1(可选)
|
|
170
|
+
|
|
171
|
+
### 安装
|
|
172
|
+
|
|
173
|
+
```
|
|
174
|
+
npm i -D versot-fe-eslint-config @typescript-eslint/parser @typescript-eslint/eslint-plugin eslint-plugin-import eslint-import-resolver-typescript eslint-plugin-react eslint-plugin-react-hooks
|
|
175
|
+
```
|
|
176
|
+
|
|
177
|
+
### 配置
|
|
178
|
+
|
|
179
|
+
```json
|
|
180
|
+
{
|
|
181
|
+
"extends": ["versot-fe-eslint-config/typescript/react"]
|
|
182
|
+
}
|
|
183
|
+
```
|
|
184
|
+
|
|
185
|
+
如果需要无障碍能力:
|
|
186
|
+
|
|
187
|
+
```shell
|
|
188
|
+
npm i -D eslint-plugin-jsx-a11y
|
|
189
|
+
```
|
|
190
|
+
|
|
191
|
+
```json
|
|
192
|
+
{
|
|
193
|
+
"extends": ["versot-fe-eslint-config/typescript/react", "versot-fe-eslint-config/jsx-a11y"]
|
|
194
|
+
}
|
|
195
|
+
```
|
|
196
|
+
|
|
197
|
+
## TypeScript + Vue 项目 - versot-fe-eslint-config/typescript/vue
|
|
198
|
+
|
|
199
|
+
针对 `TS Vue` 项目,继承了 `JS Vue` 的配置,并启用了 [@typescript-eslint/eslint-plugin](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/eslint-plugin) 插件的规则,使用 [@typescript-eslint/parser](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/parser) 作为 `parser`。
|
|
200
|
+
|
|
201
|
+
### 依赖
|
|
202
|
+
|
|
203
|
+
- [@typescript-eslint/parser](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/parser)@^5.0.0
|
|
204
|
+
- [@typescript-eslint/eslint-plugin](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/eslint-plugin)@^5.0.0
|
|
205
|
+
- [eslint-plugin-import](https://www.npmjs.com/package/eslint-plugin-import)@^2.25.3
|
|
206
|
+
- [eslint-import-resolver-typescript](https://www.npmjs.com/package/eslint-import-resolver-typescript)@2
|
|
207
|
+
- [vue-eslint-parser](https://www.npmjs.com/package/vue-eslint-parser)@^7.0.0
|
|
208
|
+
- [eslint-plugin-vue](https://www.npmjs.com/package/eslint-plugin-vue)@^7.3.0
|
|
209
|
+
|
|
210
|
+
### 安装
|
|
211
|
+
|
|
212
|
+
```shell
|
|
213
|
+
npm i -D versot-fe-eslint-config @typescript-eslint/parser @typescript-eslint/eslint-plugin eslint-plugin-import eslint-import-resolver-typescript vue-eslint-parser eslint-plugin-vue
|
|
214
|
+
```
|
|
215
|
+
|
|
216
|
+
### 配置
|
|
217
|
+
|
|
218
|
+
```json
|
|
219
|
+
{
|
|
220
|
+
"extends": ["versot-fe-eslint-config/typescript/vue"]
|
|
221
|
+
}
|
|
222
|
+
```
|
|
223
|
+
|
|
224
|
+
## TypeScript (Node.js) 项目 - versot-fe-eslint-config/typescript/node
|
|
225
|
+
|
|
226
|
+
针对未使用 `React` 和 `Vue` 的 `TypeScript(Node)` 项目,继承了 `JS Node.js` 配置,并启用了 [@typescript-eslint/eslint-plugin](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/eslint-plugin) 插件的规则,使用 [@typescript-eslint/parser](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/parser) 作为 parser。
|
|
227
|
+
|
|
228
|
+
### 依赖
|
|
229
|
+
|
|
230
|
+
- [@typescript-eslint/parser](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/parser)@^5.0.0
|
|
231
|
+
- [@typescript-eslint/eslint-plugin](https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/eslint-plugin)@^5.0.0
|
|
232
|
+
- [eslint-plugin-import](https://www.npmjs.com/package/eslint-plugin-import)@^2.25.3
|
|
233
|
+
- [eslint-import-resolver-typescript](https://www.npmjs.com/package/eslint-import-resolver-typescript)@2
|
|
234
|
+
- [eslint-config-egg](https://www.npmjs.com/package/eslint-config-egg)@^10.0.0
|
|
235
|
+
|
|
236
|
+
### 安装
|
|
237
|
+
|
|
238
|
+
```
|
|
239
|
+
npm i -D versot-fe-eslint-config @typescript-eslint/parser @typescript-eslint/eslint-plugin eslint-plugin-import eslint-import-resolver-typescript eslint-config-egg
|
|
240
|
+
```
|
|
241
|
+
|
|
242
|
+
### 配置
|
|
243
|
+
|
|
244
|
+
```json
|
|
245
|
+
{
|
|
246
|
+
"extends": ["versot-fe-eslint-config/typescript/node"]
|
|
247
|
+
}
|
|
248
|
+
```
|
|
249
|
+
|
|
250
|
+
## 配合 Prettier 使用
|
|
251
|
+
|
|
252
|
+
如果你的项目使用 [Prettier](https://prettier.io/) 进行代码格式化,本包的一些规则可能会跟 Prettier 格式化结果有冲突,[例如这条规则](https://github.com/typescript-eslint/typescript-eslint/issues/372)。为了避免冲突,你需要手动安装 [eslint-config-prettier](https://github.com/prettier/eslint-config-prettier) 和 [eslint-plugin-prettier](https://github.com/prettier/eslint-plugin-prettier):
|
|
253
|
+
|
|
254
|
+
### 安装
|
|
255
|
+
|
|
256
|
+
```sh
|
|
257
|
+
npm install --save-dev eslint-config-prettier eslint-plugin-prettier
|
|
258
|
+
```
|
|
259
|
+
|
|
260
|
+
### 配置
|
|
261
|
+
|
|
262
|
+
并修改 `.eslintrc` 的 `extends` 配置,增加 `prettier`,如下(以 TS React 项目为例):
|
|
263
|
+
|
|
264
|
+
```json
|
|
265
|
+
{
|
|
266
|
+
"extends": ["versot-fe-eslint-config/typescript/react", "prettier"]
|
|
267
|
+
}
|
|
268
|
+
```
|
|
269
|
+
|
|
270
|
+
了解更多请阅读 [Prettier - Integrating with Linters](https://prettier.io/docs/en/integrating-with-linters.html)。
|
|
271
|
+
|
|
272
|
+
## 将风格问题降级
|
|
273
|
+
|
|
274
|
+
为了保证一致的编码风格,本包中大量风格相关的规则被设为了 `error` 级别,以引起开发者的足够重视。如果你觉得风格问题不足以是 `error` 级别(有些用户根据 ESLint error 进行流程卡点),本包还提供了一套名为 'essential' 的配置文件,这套配置将所有风格问题降级为 `warn` 级别,仅将必要问题报告为 `error`,引用方式为在相应配置的 `versot-fe-eslint-config` 后面加上 `/essential`,如对 `JS React` 项目为 `versot-fe-eslint-config/essential/react`、对 `TS Vue` 项目为 `versot-fe-eslint-config/essential/typescript/vue`
|
|
275
|
+
|
|
276
|
+
## 了解更多
|
|
277
|
+
|
|
278
|
+
- 如果你对 ESLint 还不熟悉,可以阅读官网的 [Getting Started](https://eslint.org/docs/user-guide/getting-started) 快速入门。
|
|
279
|
+
- 了解如何为 IDE 配置 ESLint,可以参考官网的 [Integrations](http://eslint.org/docs/user-guide/integrations)。
|
|
280
|
+
- 了解如何在继承本包的基础上对项目 ESLint 进行个性化配置,可参考官网的 [Configuring ESLint](https://eslint.org/docs/user-guide/configuring)。下面简介下 ESLint 配置中的几个常用字段:
|
|
281
|
+
- `extends`: 继承一组规则集。`"extends": "versot-fe-eslint-config",` 表示继承本包定义的规则配置。
|
|
282
|
+
- `rules`: 配置规则,这里定义的规则会覆盖 `extends` 的规则。如果觉得本包开启的某条规则过于严格,你可以暂时在这里将其关闭。
|
|
283
|
+
- `parser`: 设置 ESLint 的解析器。ESLint 使用 espree 作为默认的解析器,可以通过这个参数指定其他的解析器。比如指定为 [@babel/eslint-parser](https://npmjs.com/package/@babel/eslint-parser),以解析 Babel 支持但 ESLint 默认解析器不支持的语法(本包不同配置文件使用的解析器可在简介表格中的「依赖 parser」一列查看)。
|
|
284
|
+
- `globals`: 指定代码中可能用到的全局变量,以免全局变量被 [no-undef](http://eslint.org/docs/rules/no-undef) 规则报错。
|
|
285
|
+
- `env`: 指定代码的运行环境,每个环境预定义了一组对应的全局变量,本包已开启的环境有 browser、node、jquery、es6 及几个测试框架的环境。
|
|
286
|
+
- 了解常用的 ESLint 命令,如 `--fix`、`--ext`,可参考官网的 [Command Line Interface](http://eslint.org/docs/user-guide/command-line-interface)。
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
// 'no-var'
|
|
2
|
+
var fs = require('fs');
|
|
3
|
+
|
|
4
|
+
// 'node/prefer-global/buffer'
|
|
5
|
+
// 'quotes'
|
|
6
|
+
const { Buffer } = require("buffer");
|
|
7
|
+
// 'node/no-new-require'
|
|
8
|
+
// 'new-cap'
|
|
9
|
+
const util = new require('util');
|
|
10
|
+
|
|
11
|
+
// 'no-console'
|
|
12
|
+
console.log(util);
|
|
13
|
+
// 'semi'
|
|
14
|
+
// 'no-unused-vars'
|
|
15
|
+
const b = Buffer.alloc(16)
|
|
16
|
+
|
|
17
|
+
// 'node/prefer-promises/fs'
|
|
18
|
+
fs.readFile('../node.ts', 'utf-8', (err, data) => {
|
|
19
|
+
// 'no-console'
|
|
20
|
+
console.log(err, data);
|
|
21
|
+
});
|
|
22
|
+
|
|
23
|
+
exports = fs;
|
|
24
|
+
// 'eol-last'
|
|
@@ -0,0 +1,132 @@
|
|
|
1
|
+
import React, { Component } from 'react';
|
|
2
|
+
import { connect } from 'react-redux';
|
|
3
|
+
import { bindActionCreators } from 'redux';
|
|
4
|
+
import { Breadcrumb, Button, Search, Select, Dropdown, Menu, Notice } from 'antd';
|
|
5
|
+
import Layout from 'layout';
|
|
6
|
+
import { Translate } from 'antd-i18n';
|
|
7
|
+
import * as actions from '../actions/index';
|
|
8
|
+
|
|
9
|
+
const { Nav, Card, Section, Toolbar } = Layout;
|
|
10
|
+
|
|
11
|
+
const ButtonGroup = Button.Group;
|
|
12
|
+
const { Option } = Select;
|
|
13
|
+
|
|
14
|
+
class Root extends Component {
|
|
15
|
+
componentDidMount() {
|
|
16
|
+
this.props.getBreadcrumb();
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
onSearch(searchParams) {
|
|
20
|
+
console.log(searchParams);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
onSelectChange(value, data) {
|
|
24
|
+
console.log(value, data);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
onMenuClick(selectedKeys, menuItem, meta) {
|
|
28
|
+
console.log(selectedKeys, menuItem, meta);
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
render() {
|
|
32
|
+
const { breadcrumb } = this.props;
|
|
33
|
+
const subNavData = {
|
|
34
|
+
navs: [
|
|
35
|
+
{
|
|
36
|
+
key: 'home',
|
|
37
|
+
text: '导航操作区',
|
|
38
|
+
active: true,
|
|
39
|
+
link: '#',
|
|
40
|
+
},
|
|
41
|
+
{
|
|
42
|
+
key: 'permit',
|
|
43
|
+
text: '权限',
|
|
44
|
+
link: '#',
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
key: 'favorite',
|
|
48
|
+
text: '常用链接',
|
|
49
|
+
link: '#',
|
|
50
|
+
},
|
|
51
|
+
],
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
return (
|
|
55
|
+
<Layout>
|
|
56
|
+
<Nav data={subNavData} />
|
|
57
|
+
<Section>
|
|
58
|
+
<Breadcrumb dataSource={breadcrumb} />
|
|
59
|
+
</Section>
|
|
60
|
+
<Section>
|
|
61
|
+
<Notice title="提示:" type="info">
|
|
62
|
+
页面提示信息区(Notice组件)
|
|
63
|
+
</Notice>
|
|
64
|
+
</Section>
|
|
65
|
+
<Section>
|
|
66
|
+
<Toolbar>
|
|
67
|
+
<Toolbar.Left>
|
|
68
|
+
<Toolbar.Item>
|
|
69
|
+
<Button type="primary">页面操作区</Button>
|
|
70
|
+
</Toolbar.Item>
|
|
71
|
+
<Toolbar.Item>
|
|
72
|
+
<ButtonGroup>
|
|
73
|
+
<Dropdown
|
|
74
|
+
triggerButton={<Button type="normal">批量操作</Button>}
|
|
75
|
+
triggerType="click"
|
|
76
|
+
>
|
|
77
|
+
<Menu onClick={this.onMenuClick}>
|
|
78
|
+
<Menu.Item key="submit_cr">提交发布</Menu.Item>
|
|
79
|
+
<Menu.Item key="close_cr">关闭变更</Menu.Item>
|
|
80
|
+
</Menu>
|
|
81
|
+
</Dropdown>
|
|
82
|
+
<Dropdown triggerButton={<Button type="normal">更多</Button>} triggerType="click">
|
|
83
|
+
<Menu onClick={this.onMenuClick}>
|
|
84
|
+
<Menu.Item key="other_1">更多操作 1</Menu.Item>
|
|
85
|
+
<Menu.Item key="other_2">更多操作 2</Menu.Item>
|
|
86
|
+
<Menu.Item key="other_3">更多操作 3</Menu.Item>
|
|
87
|
+
</Menu>
|
|
88
|
+
</Dropdown>
|
|
89
|
+
</ButtonGroup>
|
|
90
|
+
</Toolbar.Item>
|
|
91
|
+
</Toolbar.Left>
|
|
92
|
+
<Toolbar.Right>
|
|
93
|
+
<Toolbar.Item>
|
|
94
|
+
<Select onChange={this.onSelectChange} defaultValue="default">
|
|
95
|
+
<Option value="default">默认排序</Option>
|
|
96
|
+
<Option value="gmt_create|DESC">按创建时间降序</Option>
|
|
97
|
+
<Option value="gmt_create|ASC">按创建时间升序</Option>
|
|
98
|
+
</Select>
|
|
99
|
+
</Toolbar.Item>
|
|
100
|
+
<Toolbar.Item>
|
|
101
|
+
<Search placeholder="请输入关键词搜索" onSearch={this.onSearch} />
|
|
102
|
+
</Toolbar.Item>
|
|
103
|
+
</Toolbar.Right>
|
|
104
|
+
</Toolbar>
|
|
105
|
+
</Section>
|
|
106
|
+
<Section>
|
|
107
|
+
<Card title="详细内容展示区(Card组件)" extra={<a href="#">更多操作</a>}>
|
|
108
|
+
<p>
|
|
109
|
+
<a
|
|
110
|
+
href="#"
|
|
111
|
+
target="_blank"
|
|
112
|
+
rel="noreferrer noopener"
|
|
113
|
+
>
|
|
114
|
+
点击查看设计规范
|
|
115
|
+
</a>
|
|
116
|
+
</p>
|
|
117
|
+
<p>
|
|
118
|
+
<Button type="primary" onClick={this.props.changeLang}>
|
|
119
|
+
<Translate value="buttonText" />
|
|
120
|
+
</Button>
|
|
121
|
+
</p>
|
|
122
|
+
</Card>
|
|
123
|
+
</Section>
|
|
124
|
+
</Layout>
|
|
125
|
+
);
|
|
126
|
+
}
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
export default connect(
|
|
130
|
+
({ index, ...others }) => ({ ...index, ...others }),
|
|
131
|
+
dispatch => bindActionCreators(actions, dispatch)
|
|
132
|
+
)(Root);
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
// node/prefer-promises/fs
|
|
2
|
+
import fs from 'fs';
|
|
3
|
+
|
|
4
|
+
fs.readFile('../node.js', 'utf-8', (err, data) => {
|
|
5
|
+
// no-console
|
|
6
|
+
console.log(err, data);
|
|
7
|
+
});
|
|
8
|
+
|
|
9
|
+
// no-var
|
|
10
|
+
// @typescript-eslint/no-unused-vars
|
|
11
|
+
var count = 1 + 1;
|
|
12
|
+
|
|
13
|
+
class Test {
|
|
14
|
+
func(): void {
|
|
15
|
+
return 1;
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
export default Test;
|
|
20
|
+
// eol-last
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
export interface Props {
|
|
4
|
+
name: string;
|
|
5
|
+
enthusiasmLevel?: number;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
function Hello({ name, enthusiasmLevel = 1 }: Props) {
|
|
9
|
+
if (enthusiasmLevel <= 0) {
|
|
10
|
+
throw new Error('You could be a little more enthusiastic. :D');
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
const foo: number = 1
|
|
14
|
+
|
|
15
|
+
return (
|
|
16
|
+
<div className="hello">
|
|
17
|
+
<div className="greeting">
|
|
18
|
+
Hello {name + enthusiasmLevel}
|
|
19
|
+
</div>
|
|
20
|
+
<Hi>
|
|
21
|
+
haha
|
|
22
|
+
</Hi>
|
|
23
|
+
</div>
|
|
24
|
+
);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
export default Hello;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div style="margin: 20px;">
|
|
3
|
+
<textarea>{{ value }}</textarea>
|
|
4
|
+
<img class="image-viewer__thumbnails" :src="imageUrl" @click="clickHandler" />
|
|
5
|
+
<div v-show="visible" class="image-viewer__wrapper">
|
|
6
|
+
<i class="image-viewer__closebtn" @click="closeHandler" />
|
|
7
|
+
<div class="image-viewer__img">
|
|
8
|
+
<img :src="imageUrl" />
|
|
9
|
+
</div>
|
|
10
|
+
</div>
|
|
11
|
+
</div>
|
|
12
|
+
</template>
|
|
13
|
+
|
|
14
|
+
<script lang="ts">
|
|
15
|
+
import { Vue, Component, Prop } from 'vue-property-decorator';
|
|
16
|
+
|
|
17
|
+
@Component
|
|
18
|
+
export default class ImageViewer extends Vue {
|
|
19
|
+
@Prop(String) readonly imageUrl;
|
|
20
|
+
|
|
21
|
+
visible = false;
|
|
22
|
+
|
|
23
|
+
closeHandler() {
|
|
24
|
+
this.visible = false;
|
|
25
|
+
|
|
26
|
+
const foo: number = 1
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
clickHandler() {
|
|
30
|
+
this.visible = true;
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
</script>
|
|
34
|
+
|
|
35
|
+
<style lang="scss">
|
|
36
|
+
</style>
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
interface AppDeveloper {
|
|
2
|
+
nickname: string,
|
|
3
|
+
name: string,
|
|
4
|
+
avatarUrl: string,
|
|
5
|
+
id: number,
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
const foo: string = 1
|
|
9
|
+
let bar = [1,2]
|
|
10
|
+
const baz = {obj:2}
|
|
11
|
+
|
|
12
|
+
function func(arg: string): string;
|
|
13
|
+
function func(arg: number): number;
|
|
14
|
+
function func(arg: string | number): string | number {
|
|
15
|
+
if (typeof arg === 'string') return arg;
|
|
16
|
+
return arg;
|
|
17
|
+
}
|