jsx
-
- [React.js] .js ํ์ผ์์ Uncaught SyntaxError: Unexpected token '<' ์ค๋ฅ ๋ฐ์ํ ๋ ํด๊ฒฐ ๋ฐฉ๋ฒ (Vite)
.js ํ์ผ์์ Uncaught SyntaxError: Unexpected token '๋ค์ด๊ฐ๋ฉฐ@.js@ ํ์ผ์์ @Uncaught SyntaxError: Unexpected token '์ด ๋ฌธ์ ๋ Vite๋ก ๋ง๋ ํ๋ก์ ํธ์ ๋ฐ์ํ๋ ๋ฌธ์ ์ด๋ค. ๋ฌธ์ ๋ฐ์ ์ํฉ@/src/utils/links.js@ ํ์ผ์์ ์ปดํฌ๋ํธ(Component)๊ฐ @value@๋ก ๋ค์ด ์๋ @key@๊ฐ ๋ค์ด ์๋ ๊ฐ์ฒด๋ฅผ ์ธ๋ถ ์ปดํฌ๋ํธ์์ import ํ์ฌ ์ฌ์ฉํ๋ ค๊ณ ํ ๋, ๋ค์๊ณผ ๊ฐ์ ์ค๋ฅ๊ฐ ๋ฐ์ํ์๋ค. /src/utils/links.js@icon@ ํค์ ๊ฐ์ ์ธ๋ถ ์ปดํฌ๋ํธ์์ ๋ถ๋ฌ์ฌ ๋ ์์ ๊ฐ์ ์ค๋ฅ๊ฐ ๋ฐ์ํ์๋ค.const links = [ { id: 1, text: 'stats', path: '/', ..
2024.11.13 -
- [React.js] ์ปดํฌ๋ํธ๋ฅผ ์์ฑํ๋ ๋ฐฉ๋ฒ 2๊ฐ์ง (JSX, React.createElement)
์ปดํฌ๋ํธ๋ฅผ ์์ฑํ๋ ๋ฐฉ๋ฒ 2๊ฐ์ง (JSX, React.createElement)๋ค์ด๊ฐ๋ฉฐ๋ฆฌ์กํธ(React.js)์์ ์ปดํฌ๋ํธ๋ฅผ ์์ฑํ๋ ๋ฐฉ๋ฒ 2๊ฐ์ง๋ฅผ ์ ๋ฆฌํด๋ณธ๋ค. ์ปดํฌ๋ํธ ์์ฑ ๋ฐฉ๋ฒโ ํจ์ํ ์ปดํฌ๋ํธfunction Greeting() { return ( hello world );} ํจ์ํ ์ปดํฌ๋ํธ๋ ์๋ฐ์คํฌ๋ฆฝํธ ํจ์๋ก ์ ์๋๋ฉฐ, JSX(JavaScript XML) ๋ฌธ๋ฒ์ ์ฌ์ฉํ์ฌ UI๋ฅผ ๋ฐํํ๋ค.@@์ @@ ํ๊ทธ๋ฅผ ์ฌ์ฉํ์ฌ UI๋ฅผ ์ ์ํ๋ค.JSX๋ Babel ๊ฐ์ ์ปดํ์ผ๋ฌ๋ฅผ ํตํด @React.createElement@ ํธ์ถ๋ก ๋ณํ๋๋ค.์ฝ๋๊ฐ ๋ ์ง๊ด์ ์ด๊ณ ์ฝ๊ธฐ ์ฌ์ฐ๋ฉฐ, ์ปดํฌ๋ํธ๋ฅผ ์์ฑํ ๋ HTML๊ณผ ์ ์ฌํ ๋ฌธ๋ฒ์ ์ฌ์ฉํ ์ ์๋ค. โก @React.createElement@imp..
2024.08.26 -
- [VS Code] ๋น์ฃผ์ผ ์คํ๋์ค ์ฝ๋(VS Code)์์ JSX ์๋ ์์ฑ ๊ธฐ๋ฅ ์ผ๋ ๋ฐฉ๋ฒ
๋น์ฃผ์ผ ์คํ๋์ค ์ฝ๋(VS Code)์์ JSX ์๋ ์์ฑ ๊ธฐ๋ฅ ์ผ๋ ๋ฐฉ๋ฒ๋ค์ด๊ฐ๋ฉฐ๋น์ฃผ์ผ ์คํ๋์ค ์ฝ๋(VS Code)์์ @return@ ๋ฌธ ์์ JSX๋ฅผ ์์ฑํ ๋, ์๋ ์์ฑ ๊ธฐ๋ฅ(Auto Complete)์ ์ฌ์ฉํ๋ ๋ฐฉ๋ฒ์ ์์๋ณด์. ๋ฐฉ๋ฒ์ด ๋ฐฉ๋ฒ์ ์ํด์๋ VS Code ์ค์ ์ ๋ฐ๋ก ํด์ค์ผ ํ๋ค.์ฐ์ , @Ctrl@(@Cmd@) + @,@๋ฅผ ๋๋ฌ์ VS Code ์ค์ ํ์ด์ง๋ฅผ ์ฐ๋ค. ๊ทธ๋ฆฌ๊ณ ์๋จ์ @[Open Settings (JSON)]@ ์์ด์ฝ์ ํด๋ฆญํ๋ค.๊ทธ๋ฆฌ๊ณ ์๋์ ์ฝ๋๋ฅผ @settings.json@ ์ฝ๋ ์์ ๋ฃ์ด์ค๋ค.{ ... "emmet.includeLanguages": { "javascript": "javascriptreact" }, "emmet.syntaxProfiles"..
2024.05.28