Closed18
ReactNativeにESlintとPrettierを入れる
こちらを参考に
yarn add --dev eslint
yarn eslint --init
➜ react-native-shop-app git:(master) ✗ yarn eslint --init
yarn run v1.22.19
$ /Users/kimura_yuma/develop/sandbox/react-native-shop-app/node_modules/.bin/eslint --init
You can also run this command directly using 'npm init @eslint/config'.
✔ How would you like to use ESLint? · style
✔ What type of modules does your project use? · esm
✔ Which framework does your project use? · react
✔ Does your project use TypeScript? · No / Yes
✔ Where does your code run? · browser
✔ How would you like to define a style for your project? · prompt
✔ What format do you want your config file to be in? · JavaScript
✔ What style of indentation do you use? · 4
✔ What quotes do you use for strings? · single
✔ What line endings do you use? · unix
✔ Do you require semicolons? · No / Yes
The config that you've selected requires the following dependencies:
eslint-plugin-react@latest @typescript-eslint/eslint-plugin@latest @typescript-eslint/parser@latest
✔ Would you like to install them now? · No / Yes
✔ Which package manager do you want to use? · yarn
diff --git a/package.json b/package.json
index 8fd3a77..8e7c2ed 100644
--- a/package.json
+++ b/package.json
@@ -6,7 +6,8 @@
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
- "web": "expo start --web"
+ "web": "expo start --web",
+ "lint": "eslint --ext .tsx --ext .ts src/"
},
yarn lint
実行したらいっぱいerror出た
--rule
オプションつけてerrorごと修正してみる
Command Line Interface - ESLint - Pluggable JavaScript Linter
yarn lint --fix --rule 'quotes:[error]'
でエラー出てたやつが修正された。
yarn lint --fix --rule 'quotes:[error, double]'
とかで修正方法を変えられるっぽい
いや、指定したルール以外も修正されている、、、
yarn add --dev prettier eslint-plugin-prettier
echo {}> .prettierrc.json
複数のルールをまとめたコンフィギュレーション名を適用します。
tsconfigにもeslint追記する必要あるっぽい?
TypeScript + Node.jsプロジェクトにESLint + Prettierを導入する手順2020 - Qiita
vscodeでprittierのプラグインのインストールと、"editor.formatOnSave": true,
の設定だけでは保存時にフォーマットされなかった。
"[typescriptreact]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
を追記したら保存時にフォーマットされるようになった。
このスクラップは2022/08/29にクローズされました