2
求一个针对 React+TSX 的 ESLint+Prettier 的 Boilerplate
source link: https://www.v2ex.com/t/802325
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
想优化一下自己的配置，但是感觉又无从下手（之前从 Google 抄的，感觉是个缝合怪，所以不敢乱改，怕配坏了，折腾半天），如果 ESLint 和 Prettier 能够合并成一个工具那就好了，主要是我看到 eslint 兼容 prettier 的那堆配置，我心里发慌，不敢乱动。
所以 RT，求一个针对 React+TSX 的 ESLint+Prettier 的 Boilerplate，最好是主流常用的。
楼主非专业前端，看到一大堆配置就发慌，轻喷。
7 条回复 • 2021-09-16 19:02:16 +08:00
XTTX 56 分钟前 
1
https://github.com/wesbos/eslint-config-wesbos
========================================
tsconfig
{
"compilerOptions": {
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx"
},
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
"exclude": ["node_modules"]
}
========================================
tsconfig
{
"compilerOptions": {
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx"
},
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
"exclude": ["node_modules"]
}
XTTX 55 分钟前
eslintrc
======================================
{
"extends": ["wesbos", "wesbos/typescript"],
"parserOptions": {
"project": ["./tsconfig.json"]
},
"rules": {
"no-use-before-define": "off",
"no-shadow": "off",
"@typescript-eslint/no-unsafe-assignment": "off",
"@typescript-eslint/no-unsafe-call": "off",
"@typescript-eslint/no-unsafe-member-access": "off",
"@typescript-eslint/no-unsafe-return": "warn",
"@typescript-eslint/no-floating-promises": "warn",
"@typescript-eslint/no-use-before-define": "error",
"@typescript-eslint/require-await": "off",
"@typescript-eslint/restrict-plus-operands": "off",
"prefer-template": "off",
"arrow-body-style": "off",
"react/button-has-type": "off",
"@typescript-eslint/restrict-template-expressions": "off",
"no-console": "off",
"prettier/prettier": [
"warn",
{
"endOfLine": "auto",
"singleQuote": true,
"semi": false
}
]
}
}
======================================
{
"extends": ["wesbos", "wesbos/typescript"],
"parserOptions": {
"project": ["./tsconfig.json"]
},
"rules": {
"no-use-before-define": "off",
"no-shadow": "off",
"@typescript-eslint/no-unsafe-assignment": "off",
"@typescript-eslint/no-unsafe-call": "off",
"@typescript-eslint/no-unsafe-member-access": "off",
"@typescript-eslint/no-unsafe-return": "warn",
"@typescript-eslint/no-floating-promises": "warn",
"@typescript-eslint/no-use-before-define": "error",
"@typescript-eslint/require-await": "off",
"@typescript-eslint/restrict-plus-operands": "off",
"prefer-template": "off",
"arrow-body-style": "off",
"react/button-has-type": "off",
"@typescript-eslint/restrict-template-expressions": "off",
"no-console": "off",
"prettier/prettier": [
"warn",
{
"endOfLine": "auto",
"singleQuote": true,
"semi": false
}
]
}
}
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK