Reactで構築していたシステムに、ふとjQueryを入れないと実現できないような要件が発生しました。
そもそもReactとjQueryを共用してもいいのか・・?
ざっっっくり調べた個人的解釈では、
「使い方ちゃんとすれば別に大丈夫じゃない?」
という感じ。
とりあえずやってみたら、ESLintさんに
‘$‘ is not defined. (no-undef)
と言われてしましました。
どうすりゃいいのか調べたら、解決策見つけたので書いておきます。
そもそもReact と jQuery 共存は?
結論のまえに、まずReactとjQueryの共存について少しだけ。
相性は良くないだろうとは思ってざっくり調べましたが、必要最低限に使用箇所を考慮して使う文にはまぁ大丈夫そうです。
詳しくは以下のサイトがわかりやすかったのでご参照を。。
参考にしたサイト (ありがとございますー!)
React と jQuery を共存させる | GMOインターネット 次世代システム研究室
React と jQuery は共存可能なのか? - Qiita
注意するポイント
「 jQuery は DOM が現れたり削除されたりするライフサイクルメソッド( componentDidMount, componentWillUnmount, componentDidUpdate )の中でだけ実行しなさい。」
(React と jQuery を共存させる | GMOインターネット 次世代システム研究室から抜粋 )
かなと思ってます。
かなり端的ですけど、理論上は納得ので可能な限りは準拠しようかと。
‘$‘ is not defined. (no-undef)の解決策
本題の解決策です。
ドンピシャで教えてくれてるブログを見つけました。
結論から言うと解決策は単純で、.eslintrc
のenvにjqueryを追加すればOKです。
こんな感じ。
{ "env": { "es6": true, "browser": true, "node": true, "jquery": true, } }
※上記は例ですので、"jquery": true,
の記述さえあれば問題ありません。
いやー無知って怖い。
[ブログ]メンチカツさん、ありがとうございます。