cover image
📱

フロントの構文チェックについてまとめてみた

カテゴリ
Tech
書いた人
Kyohei Shibuya
公開日
2021/09/01
💡
概要
お手伝いさせてもらっているサービスで構文チェックをもちろんのこと導入されているですが、私自身雰囲気で使っていたのでまとめてみる回でございます。
そもそもlintっていろんなlintがあるイメージですがlintってなんですかね。
 
🚀
記事はこちら!
ESLintとか雰囲気で使ってたから
お手伝いさせてもらっているサービスで構文チェックをもちろんのこと導入されているですが、私自身雰囲気で使っていたのでまとめてみる回でございます。 ESLint - Pluggable JavaScript linter A pluggable and configurable linter tool for identifying and reporting on patterns in JavaScript. Maintain your code quality with ease. そもそもlintっていろんなlintがあるイメージですがlintってなんですかね。 lintとは、コンピュータプログラムなどのソースコードを読み込んで内容を分析し、問題点を指摘してくれる 静的解析ツール 。また、そのようなツールで解析を行うこと。ツールを指す場合は "linter" (リンター)と呼ぶこともある。 https://e-words.jp/w/lint.html ソースコードの中に潜むバグの原因や、構文間違いを自動でチェックしてくれるツールを総称してlinterと呼ぶみたい。この知ってるようで説明できないことを知れた感じが良いですね〜。名前はECMA Script linterのことでしょうきっと。 例として下記。 import { hoge, huga } from './hogehuga.ts' export const piyo = () => { return hoge } huga をimportしているのに使用していない場合、eslintにかけると 'huga' is defined but never used といった感じで怒ってくれる。 この機能ってバグを防ぐのは勿論なんですが、レビュワーの負担を減らす意味でも大きな効果がありますよね。時間的な負担もありますが 精神的な負担が減る。「あーこう書いてるけどわざわざ言わなくてもいいかなー、バグにはならんし」とか「これ指摘したら細かすぎかなー」とか。そういうことを考えなくてよくなるわけです。変な気を使いたくない! GitHub - prettier/prettier: Prettier is an opinionated code formatter.