Home [React-Native] Could not find a declaration file for module 'react-query'
Post
Cancel

[React-Native] Could not find a declaration file for module 'react-query'

๐ŸšจCould not find a declaration file for module โ€˜react-queryโ€™


1. Error Occured

1
import {QueryClient, QueryClientProvider} from 'react-query'

React Native ํ”„๋กœ์ ํŠธ์—์„œ API ์ƒํƒœ๊ด€๋ฆฌ๋ฅผ ์œ„ํ•ด react-query๋ฅผ ์„ค์น˜ํ•˜๊ณ  ๋ชจ๋“ˆ์„ ์ž„ํฌํŠธํ•˜๋Š”๋ฐ ๋‹ค์Œ๊ณผ ๊ฐ™์€ ์—๋Ÿฌ๊ฐ€ ๋ฐœ์ƒํ–ˆ๋‹ค.

action
wow
1
2
3
4
Could not find a declaration file for module 'react-query'.
'C:/Users/.../node_modules/react-query/build/cjs/packages/react-query/src/index.js'
implicitly has an 'any' type.
  Try `npm i --save-dev @types/react-query` if it exists or add a new declaration (.d.ts) file containing `declare module 'react-query';`


2. Install @types/react-query

์œ„ ์—๋Ÿฌ๋Š” ์ผ๋‹จ ๋ณดํ†ต Typescript๋ฅผ ์‚ฌ์šฉํ•  ๋•Œ ๋ชจ๋“ˆ์˜ ํƒ€์ž…์ด ์ •์˜๋˜์ง€ ์•Š์•„์„œ ๋ฐœ์ƒํ•˜๋Š” ์—๋Ÿฌ๋กœ, ํ•ด๋‹น ๋ชจ๋“ˆ์—์„œ ์ž์ฒด์ ์œผ๋กœ ํƒ€์ž…์„ ์ œ๊ณตํ•˜์ง€ ์•Š์„ ๋•Œ์— ๋ฐœ์ƒํ•˜๋ฉฐ, community-contributed typings๋ฅผ ์ œ๊ณตํ•˜๋Š” ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋“ค์€ @types/module-name ์„ ์„ค์น˜ํ•จ์œผ๋กœ์„œ ํ•ด๊ฒฐํ•  ์ˆ˜ ์žˆ๊ณ , ๊ทธ ์™ธ์—๋Š” types๋ฅผ ์ง์ ‘ ์„ค์ •ํ•จ์œผ๋กœ์„œ ํ•ด๊ฒฐ์ด ๊ฐ€๋Šฅํ•˜๋‹ค.

react-query์˜ ๊ฒฝ์šฐ community-contributed typings๊ฐ€ ์กด์žฌํ•ด์„œ @types/react-query๋ฅผ ์„ค์น˜๋ฅผ ํ•ด๋ณด์•˜์ง€๋งŒ ๊ณ ์ณ์ง€์ง€ ์•Š์•˜๋‹ค.


3. Use require()

๋ฌธ์ œ ์ƒํ™ฉ์„ ๊ฒ€์ƒ‰ํ•˜๋ฉฐ ๋‚˜์™”๋˜ ํ•ด๊ฒฐ ๋ฐฉ๋ฒ• ์ค‘ ํ•˜๋‚˜. require๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ํ™•์ธํ–ˆ๋‹ค.

1
2
const reactQuery = require('react-query');
const {QueryClient, QueryClientProvider} = reactQuery;

์œ„์™€๊ฐ™์ด ์ž‘์„ฑ์„ ํ•˜๋ฉด ์—๋Ÿฌ๋Š” ์•ˆ๋‚˜์ง€๋งŒ, require๋ฅผ ์‚ฌ์šฉํ•œ ๋ถ€๋ถ„์— import๋ฌธ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค๋Š” ๊ฒฝ๊ณ ๊ฐ€ ๋œจ๊ณ , react-query ๋ชจ๋“ˆ์„ ์‚ฌ์šฉํ•  ๋•Œ ํƒ€์ž…์ฒดํ‚น์ด ์ œ๋Œ€๋กœ ์ž‘๋™ํ•˜์ง€ ์•Š์•˜๋‹ค.


4. ๋ช…ํƒ์ •๋‹ค์ธ(Detective Dain)

[ ๋‹จ์„œ 1 ]
nodemodules ํด๋”์˜ @types/react-query ์— ๊ฐ€๋ณด๋‹ˆ readme ํŒŒ์ผ์— react-query๋Š” ์ž์ฒด์ ์ธ ํƒ€์ž…์„ ์ œ๊ณตํ•˜๋ฏ€๋กœ @types/react-query๋ฅผ ์„ค์น˜ํ•ด์ค„ ํ•„์š”๊ฐ€ ์—†๋‹ค๊ณ  ๋ช…์‹œ๋˜์–ด์žˆ์—ˆ๋‹ค.์•ฝ๊ฐ„ ๋ณด๋ฌผ์ฐพ๊ธฐ ์ชฝ์ง€ ์ฐพ์€ ๋Š๋‚Œ_

๊ทธ๋ž˜์„œ @types/react-query๋Š” ๋‹ค์‹œ remove ํ•ด์ฃผ์—ˆ๋‹ค.

[ ๋‹จ์„œ 2 ]
node_modules์˜ react-query ํด๋”์˜ package.json ํด๋”์— types์˜ ๊ฒฝ๋กœ๊ฐ€ ์ง€์ •๋˜์–ด์žˆ๋Š”๋ฐ build/types/packages/query-core/src/index.d.ts๋กœ ์„ค์ •๋˜์–ด์žˆ์—ˆ๋‹ค. ๊ทธ๋Ÿฐ๋ฐ build ํด๋” ์•ˆ์— types๋ผ๋Š” ํด๋”๊ฐ€ ์กด์žฌํ•˜์ง€ ์•Š์•˜๋‹คโ€ฆ (ํ˜ผ๋ž€๐Ÿ˜ฑ)


5. Install Previous Version

๊ฒฐ๋ก ์ ์œผ๋กœ ์นœ๊ตฌ ๊ฐœ๋ฐœ์ž์˜ ์กฐ์–ธ์œผ๋กœ ๋ฆฌ์•กํŠธ ์ฟผ๋ฆฌ ๋ฒ„์ „์„ ๋‚ฎ์ถฐ์ฃผ๋‹ˆ ๋ฌธ์ œ๊ฐ€ ํ•ด๊ฒฐ๋˜์—ˆ๋‹ค. 4.0.0์ด ์ตœ๊ทผ์— ๋ฐฐํฌ๋œ ๋ฒ„์ „์ด๋ผ ๋ฌธ์ œ์˜€๋˜ ๊ฒƒ ๊ฐ™๋‹ค. ์นœ๊ตฌ๊ฐ€ ๋งˆ์ง€๋ง‰์œผ๋กœ ์‚ฌ์šฉํ–ˆ๋˜ react-query 3.39.1 ๋ฒ„์ „์œผ๋กœ ์„ค์น˜ํ–ˆ๋‹ค.

1
yarn install react-query@3.39.1

๊ทธ๋žฌ๋”๋‹ˆ ์ •์ƒ ์ž‘๋™ํ•œ๋‹ค.

(์›์ธ์ธ์ง€ ๋ชจ๋ฅด๊ฒ ์ง€๋งŒ 3.39.1 ๋ฒ„์ „์„ ์„ค์น˜ํ–ˆ์„ ๋•Œ์—๋Š” node_modules/react-query/package.json์— types๊ฒฝ๋กœ๊ฐ€ types/index.d.ts๋กœ ์ง€์ •๋˜์–ด์žˆ์—ˆ๊ณ , typesํด๋”๋„ ์ž˜ ์žˆ์—ˆ๋‹ค!)


Conclusion

๐Ÿ˜‚์ผ๋‹จ ๋ชจ๋“ˆ ์—๋Ÿฌ๊ฐ€ ๋‚œ๋‹ค๋ฉด ์ตœ์‹  ๋ฒ„์ „ ์ด์Šˆ๋Š” ์•„๋‹Œ์ง€ ๊ผญ ํ™•์ธํ•ด๋ณด์ž.
(๊ทธ๋ ‡์ง€ ์•Š์œผ๋ฉด 2~3์‹œ๊ฐ„์ด ๊ฑฐ๋œฌํ•˜๊ฒŒ ์‚ฌ๋ผ์ง„๋‹ค.)

This post is licensed under CC BY 4.0 by the author.

[Git] Git Action & Git Branch Protection Rule ์„ ํ†ตํ•œ ํ˜‘์—… ์ฝ”๋“œ ๊ด€๋ฆฌ!

[React-Native] React-Query ๋„์ž