Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
eslintのプラグインを作成した話
Search
hirasa
February 08, 2022
1
120
eslintのプラグインを作成した話
eslintのプラグインを作成した話
hirasa
February 08, 2022
Tweet
Share
More Decks by hirasa
See All by hirasa
redux使うのやめました
hirasa
1
510
dev_server_proxyのススメ
hirasa
0
140
Featured
See All Featured
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
36
6.1k
Building Flexible Design Systems
yeseniaperezcruz
329
39k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
34
2.5k
Making Projects Easy
brettharned
120
6.4k
Raft: Consensus for Rubyists
vanstee
140
7.2k
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.7k
Statistics for Hackers
jakevdp
799
220k
How STYLIGHT went responsive
nonsquared
100
5.8k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
230
22k
Building an army of robots
kneath
306
46k
Documentation Writing (for coders)
carmenintech
75
5.1k
Transcript
Eslintのプラグインを 作成した話 平崎 葵(ひらさき まもる) 2022/02/08 Saitama.js vol.2発表資料 https://saitamajs.connpass.com/event/233089/
⾃⼰紹介 平崎葵(ひらさきまもる) クーガー株式会社 所属 https://couger.co.jp u フロントエンド、サーバサイドエンジニア u バーチャルヒューマンエージェントの開発 趣味:
ドラム、作曲
発表内容 Eslintのプラグインを作成して、npmパッケージとして公開した話 u どういうものを作ったのか u なぜ作ったのか u どう使うのか u どう作ったのか
どういうものを作ったのか コーディングルールをeslintでチェック ▪npmパッケージ https://www.npmjs.com/package/@hirasaki/eslint-plugin-coding-rules ▪github https://github.com/hirasaki1985/eslint-plugin-coding-rules
なぜ作ったのか コードレビューを⾃動化したい ▪⼀例で、フロント側の設計例 • ServiceやRepository, WebAPIを直接componentから呼び出されたくない • Organisms〜Atomのコンポーネントでreduxを直接使われたくない
どう使うのか u https://github.com/hirasaki1985/eslint-plugin-coding-rules#rule-details Pathの書き⽅はmicromatchを選択。 https://github.com/micromatch/micromatch
どう作ったのか u Typescriptで実装。 u テストはjestを使⽤。 u Buildはtsupを使⽤。 ▪Eslintのプラグインの構成について • metaとcreateから構成されている。
• meta: ルールのメタ情報 • Create: ルールを実装したオブジェクトを返す。 ▪参考 https://eslint.org/docs/developer-guide/working-with-rules
参考 u https://speakerdeck.com/texmeijin/eslintfalsedu-zi-ruruzuo-cheng- nitiyarenzisitahua u https://techblog.yahoo.co.jp/javascript/how-to-create-eslint-rules/ u https://azu.github.io/JavaScript-Plugin-Architecture/ja/ESLint/ 公式 u
https://eslint.org/docs/developer-guide/architecture
エンジニア募集中 https://couger.co.jp/news/career/ カジュアル⾯談実施中︕ u フロントエンドエンジニア u DevOpsエンジニア u AI/機械学習エンジニア u
サーバアプリケーションエンジニア