Recently build a framework, a little time, want to add code check. I’m not sure what I’m going to use, so I’ll make a note of what I’ve checked.
Use create-react-app Typescript with Custom CRA ESLint Rules
Link: michael-harley.medium.com/using-creat…
Create-React-App with TypeScript, ESLint, Prettier, and Github Actions
Link: brygrill.medium.com/create-reac…
TSLInt-Prettier-CreateReactApp-TypeScript-setup.md
Link: gist.github.com/rimatla/a5a…
Should TypeScript use ESLint or TSLint for code checking?
Link: www.v2ex.com/t/448594
Code Review – TypeScript Tutorial
Link: ts.xcatliu.com/engineering…
What is the difference between typescript-eslint-parser and tsLint?
Link: www.zhihu.com/question/27…
The conclusion is that typescript-eslint-parser is recommended for the following reasons:
Typescript-eslint-parser and tsLint are both created for historical reasons. The main difference is that they are lint tools based on different AST. Typescript-eslint-parser is compatible with the ESLint ecosystem. It can be used with various plugins for ESLint, but tsLint cannot.
Now that the ESLint community is so well established, and TSLint can’t use the work of those communities or contribute its own work back to the community, So tsLint’s authors have announced that tsLint will be phased out in favor of typescript-esLint-Parser (medium.com/palantir/ts…) The TypeScript development team also announced plans to move its Lint tool from TSLint to typescript-eslint-Parser (github.com/microsoft/T…). .
Configure TypeScript projects from scratch
Link: github.com/ziyi2/ziyi2…
For background on TSLint and ESLint, here are a few quotes
ESLint background:
- There are two main TypeScript code checking tools: TSLint and ESLint. Early TypeScript projects used TSLint for checking. TSLint and TypeScript compile in the same AST format, but the main problem is that the JavaScript ecosystem is not project-friendly, As a result, the TypeScript team announced a full switch to ESLint in 2019 (see the.eslintrc.json configuration of the official TypeScript repository). See more about the reasons for the switch:
- Medium.com/palantir/ts…
- microsoft/TypeScript#30553
- TypeScript and ESLint use different AST for parsing, so to support TypeScript code checking in ESLint additional Custom Parsers (Custom Parsers, ESLint’s custom parser functionality needs to be ESTree based) in order to be able to parse TypeScript syntax and convert to ESLint-compliant AST.
@typescript-eslint/parser
Born in this context, it handles all esLint-specific configurations and calls@typescript-eslint/typescript-estree
generateESTree-compatible AST
(Note that there is more than compatibilityESLint
, can also be compatiblePrettier
).@typescript-eslint
In addition to the NPM packages mentioned above, it also contains the following two important NPM packages:
@typescript-eslint/eslint-plugin
: The ESLint plugin that works with @typescript-esLint /parser to set typescript validation rules.@typescript-eslint/eslint-plugin-tslint
: TSLint A plugin that migrates to ESLint.- Tip: When Migrating from TSLint to ESLint, you can check whether you can migrate from TSLint to ESLint. When Migrating from TSLint to ESLint, you can migrate from TSLint to ESLint. In addition, the packages described above are distributed in consistent versions (for compatibility with joint use), so it is important to note that @typescript-esLint supports versions of typescript and ESLint. See the @typescript-esLint /parser repository for more information.
TypeScript ESLint
Link: github.com/typescript-…
Typescript-eslint usage guide
Link: github.com/typescript-…
Using ESLint and Prettier in a TypeScript Project
Link: robertcooper. Me/post/using -…
Learn TypeScript Linting Part 1
Link: blog. The Matterhorn. Dev/posts/learn…
Enable StandardJS for the create-React-app project
Link: sebastianblade.com/add-standar…