[ESLint] The react-srcipts package provided by Create React App requires a dependency :: ์˜์กด์„ฑ ๋ฌธ์ œ
์›น (WEB)/์—๋Ÿฌํ•ด๊ฒฐ 2020. 12. 3. 14:42

์˜์กด์„ฑ ์—๋Ÿฌ ํ•ด๊ฒฐ ์—๋Ÿฌ ๋ฐœ์ƒ ์ด๋Ÿฐ ์˜ค๋ฅ˜๊ฐ€ ๋–ด๋‹ค. CRA๊ฐ€ ์ œ๊ณตํ•˜๋Š” react-scripts ํŒจํ‚ค์ง€๊ฐ€ eslint 6.6.0 ๋ฒ„์ „์— ์˜์กดํ•˜๋Š”๋ฐ, 7.2.0 ๋ฒ„์ „์„ ์„ค์น˜ํ•ด์„œ ๊ทธ๋ ‡๋‹ค๊ณ  ํ•œ๋‹ค. ์ € ๋ฐ‘์— ๋‚˜์˜ค๋Š” ํ•ด๊ฒฐ๋ฐฉ๋ฒ•์ด ์žˆ๋Š”๋ฐ, ๋”ฐ๋ผํ•ด๋„ ํ•ด๊ฒฐ๋˜์ง€ ์•Š๋Š”๋‹ค ใ…Ž... ์ €๋ฒˆ์—๋„ ๊ฐ™์€ ๋ฌธ์ œ๋กœ ์†์ฉ์—ฌ์„œ ์ด๋ฒˆ์—” ์ œ๋Œ€๋กœ ๊ฐ์žก๊ณ  ํ•ด๊ฒฐํ•ด๋ณด๋ ค๊ณ  ํ•œ๋‹ค. ์ด์œ  ๋ฐœ๊ฒฌ ์ด์œ ๋Š” ๊ตฌ๊ธ€๋งํ•˜๋‹ค๊ฐ€ ๋ฐœ๊ฒฌํ–ˆ๋Š”๋ฐ(https://github.com/wesbos/eslint-config-wesbos/issues/17) , react-scripts์˜ eslint ์˜์กด์„ฑ ๋ฒ„์ „๊ณผ airbnb linting์—์„œ์˜ eslint ์˜์กด์„ฑ ๋ฒ„์ „์ด ์ผ์น˜ํ•˜์ง€ ์•Š์•„์„œ ๋‚˜์˜ค๋Š” ๋ฌธ์ œ์˜€๋‹ค. ๋ป˜์ง“ ๊ทธ๋ž˜์„œ ์ผ๋‹จ react-scripts version์„ `npm view react-s..

[ESLint] createRequire is not a function Referenced from: ...
์›น (WEB)/์—๋Ÿฌํ•ด๊ฒฐ 2020. 12. 3. 12:26

VScode์—์„œ eslint๊ฐ€ ์ ์šฉ์ด ์•ˆ๋˜๊ณ  ์ž๊พธ ํ•ด๋‹น ์—๋Ÿฌ๊ฐ€ ๋œจ๊ธธ๋ž˜ ๊ฒ€์ƒ‰ํ•ด๋ดค๋‹ค. ๋ฒ„์ „์ด ์•ˆ ๋งž์•„์„œ ๊ทธ๋Ÿฐ ๊ฒƒ์ด๋‹ˆ VScode๋ฅผ ๋‹ค์‹œ ๊น”๋ฉด ๋ฒ„์ „ ์—…๋ฐ์ดํŠธ๋˜๋ฉด์„œ eslint๊ฐ€ ์ž˜ ๋œ๋‹ค. ๋‹ค์šด๋กœ๋“œ : code.visualstudio.com/download ์ฐธ๊ณ  : https://github.com/typescript-eslint/typescript-eslint/issues/2020

[eslint] Error: Unexpected token 'export'
์›น (WEB)/์—๋Ÿฌํ•ด๊ฒฐ 2020. 11. 21. 21:46

์ฐธ๊ณ  : https://hoilzz.github.io/webpack/11-eslint-prettier/ eslint์˜ parser๊ฐ€ ๊ณต์‹์ ์œผ๋กœ ES ํ‘œ์ค€๋งŒ์„ ์ง€์›ํ•˜๊ธฐ ๋•Œ๋ฌธ์—, ES6~7 ํŒŒ์‹ฑ ์‹œ ๋ฌธ์ œ๊ฐ€ ์ƒ๊ธด๋‹ค. ๋”ฐ๋ผ์„œ, .eslintrc.js ํŒŒ์ผ์˜ export default๋ฅผ module.export๋กœ ๋ณ€๊ฒฝํ•˜๊ธฐ export๋Š” ES6 syntax์ด๊ณ , module export๋Š” commonJS syntax์ด๋‹ค. babel-eslint ์„ค์น˜ ํ›„ .eslintrc.js์— "parser": "babel-eslint",์ถ”๊ฐ€ํ•˜๊ธฐ ๋‘ ๋ฐฉ๋ฒ• ์ค‘ ํ•˜๋‚˜๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ๋œ๋‹ค.

[Yaml] ๋ฐ์ดํ„ฐ ์–‘์‹ YAML์ด๋ž€ ๋ญ˜๊นŒ?
์›น (WEB)/๊ณต๋ถ€ 2020. 10. 6. 14:53

๊ฐœ์š” YAML : YAML Ain't Markup Language ์žฌ๊ท€๋ฅผ ํ†ตํ•ด ์ด๋ฆ„์ง“๊ธฐ ์ฟ ์ฟ  ๊ธฐ์กด์—๋Š” ํ”„๋กœ๊ทธ๋žจ์˜ ์„ค์ •์„ ์ €์žฅํ•˜๊ณ  ์ฝ๋Š”๋ฐ์— xml ํ˜•์‹์„ ์จ์™”๋‹ค. ํ•˜์ง€๋งŒ ์ž‘์„ฑ์ด ๋„ˆ๋ฌด ๊ท€์ฐฎ์•„์„œ ๋‹ค๋ฅธ ๋ฐฉ์‹์„ ๊ฐ•๊ตฌํ•˜๊ฒŒ ๋˜์—ˆ๋‹ค. ์ •๋ณด๋ฅผ ์ €์žฅํ•  ์ˆ˜๋งŒ ์žˆ๋‹ค๋ฉด ๋‹ค๋ฅธ ๋ฐฉ์‹๋„ ๊ฐ€๋Šฅํ•˜๋‹ค. ๊ทธ๋ž˜์„œ ๋‚˜์˜จ๊ฒŒ json ํŒŒ์ผ ํ˜•์‹์ด๋‹ค. json์€ ๊ฐ์ฒด ํ˜•์‹์œผ๋กœ xml๋ณด๋‹ค๋Š” ๊ฐ„ํŽธํ•œ ์ž‘์„ฑ์ด ๊ฐ€๋Šฅํ•˜๋‹ค. ํ—ˆ๋‚˜ ๋” ์‰ฝ๊ฒŒ ์ž‘์„ฑํ•  ์ˆ˜ ์žˆ๋Š” ํ˜•์‹์ด ๋ฐ”๋กœ YAML ํ˜•์‹์ด๋‹ค. YAML์€ ๊ฐ€๋…์„ฑ์ด ์ข‹์•„์„œ JSON์— ๋น„ํ•ด ๊ตฌ์กฐ๊ฐ€ ๋ณต์žกํ•˜์ง€๋งŒ ์‚ฌ๋žŒ์ด ๋ณด๊ธฐ์—๋Š” ์ž์—ฐ์Šค๋Ÿฌ์šด ํ˜•ํƒœ์ด๋‹ค. ์ด์— ๋”ฐ๋ผ YAML์€ ์„ค์ • ํŒŒ์ผ์˜ ๋ชฉ์ ์œผ๋กœ ๋งŽ์ด ์“ฐ์ด๊ณ , JSON์€ ์„ค์ • ํŒŒ์ผ์„ ์ œ์™ธํ•œ ๋ถ„์•ผ์—์„œ ๋ชจ๋‘ ๋„๋ฆฌ ์“ฐ์ด๊ณ  ์žˆ๋‹ค. ์ด๋Ÿฌํ•œ ํŒŒ์ผ ํ˜•์‹๋“ค์€ ์ƒํ™ฉ๋งˆ๋‹ค ํ•„์š”์— ๋”ฐ๋ผ์„œ ์‚ฌ์šฉํ•˜๋ฉด ๋œ๋‹ค..

[React] Hook์— ๋Œ€ํ•œ ์„ค๋ช… (useState, useEffect, ๋“ฑ์žฅ ๋ฐฐ๊ฒฝ๊นŒ์ง€)
์›น (WEB)/๊ณต๋ถ€ 2020. 8. 2. 16:04

React Hook React ๊ณต์‹์‚ฌ์ดํŠธ ์ฐธ์กฐ : https://ko.reactjs.org/docs/hooks-intro.html Hook ์†Œ๊ฐœ Hook์€ ์–ด๋–ค ๊ฒƒ์ด๊ณ  ์™œ ๋‚˜์˜ค๊ฒŒ ๋˜์—ˆ์„๊นŒ? Hook์ด๋ž€? ์šฐ์„  Hook์€ React 16.8 ๋ฒ„์ „์— ์ƒˆ๋กœ ์ถ”๊ฐ€๋œ ์ตœ์‹  ๊ธฐ๋Šฅ์œผ๋กœ, ํด๋ž˜์Šคํ˜• ์ปดํฌ๋„ŒํŠธ์˜ ๋‹จ์ ์„ ๊ทน๋ณตํ•˜๊ณ ์ž ๋‚˜์˜จ ํ•จ์ˆ˜ํ˜• ์ปดํฌ๋„ŒํŠธ์— ๋Œ€ํ•œ ๊ธฐ๋Šฅ์ด๋‹ค. Hook์€ ํ•จ์ˆ˜ํ˜• ์ปดํฌ๋„ŒํŠธ๋กœ๋„ ํด๋ž˜์Šคํ˜• ์ปดํฌ๋„ŒํŠธ์˜ ๊ธฐ๋Šฅ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•ด์ค€๋‹ค. ํ•จ์ˆ˜ํ˜• ์ปดํฌ๋„ŒํŠธ๋ž€? // ํด๋ž˜์Šคํ˜• ์ปดํฌ๋„ŒํŠธ import React, { Component } from 'react'; class App extends Component { render(){ return ( //jsx ); } } export default App; // ํ•จ์ˆ˜ํ˜•..