1
Watch
0
Star
0
Fork
0
Issue
wangtaostar
wangtaostar
pushedAt 11 months ago

wangtaostar/TJ

TJ

blabla

https://blog.csdn.net/sinat_17775997/article/details/108600555

eslint Prettier

  1. install eslint

    yarn add eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin eslint-plugin-react --dev

  2. 在根目录下创建一个eslintrc.js 文件并添加以下内容:

     module.exports =  {
       parser:  '@typescript-eslint/parser',  // 指定ESLint解析器
       extends:  [
         'plugin:react/recommended',  // 使用来自 @eslint-plugin-react 的推荐规则
         'plugin:@typescript-eslint/recommended',  // 使用来自@typescript-eslint/eslint-plugin的推荐规则
       ],
       parserOptions:  {
       ecmaVersion:  2018,  // 允许解析最新的 ECMAScript 特性
       sourceType:  'module',  // 允许使用 import
       ecmaFeatures:  {
         jsx:  true,  // 允许对JSX进行解析
       },
       },
       rules:  {
         // 自定义规则
         // e.g. "@typescript-eslint/explicit-function-return-type": "off",
       },
       settings:  {
         react:  {
           version:  'detect',  // 告诉 eslint-plugin-react 自动检测 React 的版本
         },
       },
     };
    
  3. 添加 Prettier 依赖

     yarn add prettier eslint-config-prettier eslint-plugin-prettier --dev
    

    在根目录下创建一个 .prettierrc.js 文件并添加以下内容

         module.exports =  {
           semi:  true,
           trailingComma:  'all',
           singleQuote:  true,
           printWidth:  120,
           tabWidth:  4,
         };
    

第三方库

无论是用于诸如 Apollo 之类的 GraphQL 客户端还是用于诸如 React Testing Library 之类的测试,我们经常会在 React 和 TypeScript 项目中使用第三方库。发生这种情况时,你要做的第一件事就是查看这个库是否有一个带有 TypeScript 类型定义 @types 包。你可以通过运行:

			#yarn
			yarn add @types/<package-name>
			#npm

			npm install @types/<package-name>

eg:

			#yarn
			yarn add @types/jest
			
			#npm
			npm install @types/jest
ucloud ads