搭建 React Native 项目(TypeScript + Airbnb linter)
使用 TypeScript 模板创建 React Native 项目
添加 ESLint
参考其他资料后,我没能成功地使用 TypeScript 模板和 Airbnb 代码检查工具配置我的 React Native 项目。不过没关系,毕竟变化太快了。我知道我的教程几个月后也会过时,但我会尽量保持更新。
我会使用yarn v1,因为 yarn v2 目前还不支持 React Native。代码检查工具方面,我选择了 Airbnb 代码检查工具。
使用 TypeScript 模板创建 React Native 项目
npx react-native init MyApp --template react-native-template-typescript
cd MyApp
添加 ESLint
yarn add --dev eslint @typescript-eslint/eslint-plugin eslint-config-airbnb eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react eslint-plugin-react-hooks
将.eslintrc.js重命名为.eslintrc.json。如果没有名为 .eslintrc.js 的文件,请创建.eslintrc.json。我们需要在这个文件中添加以下代码。
{
"extends": ["airbnb"],
"plugins": ["@typescript-eslint", "react"],
"parser": "@typescript-eslint/parser",
"rules": {
"import/no-unresolved": 0,
"react/jsx-filename-extension": [1, {
"extensions": [
".jsx",
".tsx"
]
}]
}
}
好了。现在你的RN项目已经配置好了TypeScript和Airbnb代码检查工具。
文章来源:https://dev.to/ksushiva/setting-up-react-native-project-typescript-airbnb-linter-4ai