๋ทฐ CLI

๋ทฐ CLI๋Š” ๋ทฐ๋กœ ๋น ๋ฅด๊ฒŒ ํ”„๋กœ์ ํŠธ๋ฅผ ๊ตฌ์„ฑํ•˜๊ณ  ํ”„๋กœํ†  ํƒ€์ดํ•‘์„ ํ•˜๊ณ  ์‹ถ์„ ๋•Œ ์‚ฌ์šฉํ•˜๋Š” CLI ๋„๊ตฌ์ž…๋‹ˆ๋‹ค.

์ตœ์‹  ๋ฒ„์ „์€ 3.x์ด๋ฉฐ ์ฑ…์—์„œ๋Š” 2.9 ๋ฒ„์ „์„ ๊ธฐ์ค€์œผ๋กœ ์„ค๋ช…ํ•˜์˜€์Šต๋‹ˆ๋‹ค.

๋ทฐ CLI ์„ค์น˜

๋ทฐ CLI๋ฅผ ์„ค์น˜ํ•˜๊ธฐ ์œ„ํ•ด์„œ๋Š” ๊ธฐ๋ณธ์ ์œผ๋กœ Node.js๋ฅผ ์‹œ์Šคํ…œ์— ์„ค์น˜ํ•ด๋†”์•ผ ํ•ฉ๋‹ˆ๋‹ค. Node.js๋ฅผ ์„ค์น˜ํ•˜๊ณ  ๋‚˜๋ฉด ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋Š” NPM(Node Package Manager)์„ ์ด์šฉํ•˜์—ฌ ๋ทฐ CLI๋ฅผ ์„ค์น˜ํ•ฉ๋‹ˆ๋‹ค.

๋ฒ„์ „ 3.x
npm install -g @vue/cli

๋ฒ„์ „ 2.9
npm install vue-cli

๋ทฐ CLI๋กœ ํ”„๋กœ์ ํŠธ ์ƒ์„ฑํ•˜๊ธฐ

ํ”„๋กœ์ ํŠธ๋ฅผ ์ƒ์„ฑํ•˜๋Š” ๋ช…๋ น์–ด๋Š” ์•„๋ž˜์™€ ๊ฐ™์Šต๋‹ˆ๋‹ค.

๋ฒ„์ „ 3.x
vue create helloworld
๋ฒ„์ „ 2.9
vue init webpack-simple ํŒŒ์ผ ๊ฒฝ๋กœ

๋ทฐ CLI 3.0๊ณผ CLI 2.9์™€ ์ฐจ์ด์ 

๊ธฐ์กด ๋ทฐ CLI 2.9์˜ ํ”„๋กœ์ ํŠธ ์ƒ์„ฑ ๋ฐฉ์‹์€ ๊นƒํ—™ ๋ฆฌํฌ์ง€ํ† ๋ฆฌ์— ๋“ฑ๋ก๋œ ํด๋”์™€ ํŒŒ์ผ์„ ๊ทธ๋Œ€๋กœ ๋‹ค์šด๋กœ๋“œ ๋ฐ›๋Š” ๊ฒƒ์ด์—ˆ์Šต๋‹ˆ๋‹ค. ๊ทธ์— ๋ฐ˜ํ•ด ๋ทฐ CLI 3.0์€ ๋ทฐ ํ”Œ๋Ÿฌ๊ทธ์ธ์„ ์ด์šฉํ•˜์—ฌ ํ•„์š”ํ•œ ๊ธฐ๋Šฅ๋“ค์„ ์ถ”๊ฐ€ํ•ด ๋‚˜๊ฐ€๋Š” ํ˜•์‹์ž…๋‹ˆ๋‹ค.

๊ทธ๋ฆฌ๊ณ  ์ฐจ์ด์ ์€ ํฌ๊ฒŒ ์•„๋ž˜์™€ ๊ฐ™์ด ์ •๋ฆฌ๋ฉ๋‹ˆ๋‹ค.

Vue CLI 3.0 Vue CLI 2.9
์–ธ์–ด ES6 ๊ธฐ์ค€ ES5 ๊ธฐ์ค€ (ES6 ์„ ํƒ ๊ฐ€๋Šฅ)
์›นํŒฉ ์›นํŒฉ ์„ค์ • ํŒŒ์ผ์ด ์ˆจ๊ฒจ์ ธ ์žˆ์Œ (ํ•„์š”ํ•œ ์„ค์ •์€ ์ถ”๊ฐ€ํ•˜๋Š” ํ˜•์‹) ์›นํŒฉ ์„ค์ • ํŒŒ์ผ์—์„œ ๋ฐ”๋กœ ์ˆ˜์ • ๊ฐ€๋Šฅ
GUI GUI ํˆด ์ œ๊ณต (vue ui) X
๊ตฌ์„ฑ ๋ทฐ ํ”Œ๋Ÿฌ๊ทธ์ธ ํ˜•์‹ ํ”„๋กœ์ ํŠธ ํ…œํ”Œ๋ฆฟ์„ ๊นƒํ—™์—์„œ ๋‹ค์šด๋กœ๋“œ
๋ช…๋ น์–ด vue create 'ํ”„๋กœ์ ํŠธ ์ด๋ฆ„' vue init 'ํ”„๋กœ์ ํŠธ ํ…œํ”Œ๋ฆฟ ์ด๋ฆ„' 'ํ”„๋กœ์ ํŠธ ํด๋” ๊ฒฝ๋กœ'