프로그래밍/VueJS

mac 맥 환경에서 Vue.js 설치하기

재우니 2017. 8. 2. 00:29


Vue.js 설치하는 방법은 매우 쉽습니다. 

https://kr.vuejs.org/v2/guide/installation.html


mac 에 NPM 이 설치되어 있어야 하며, 설치 이후에 아래와 같은 순서대로 설치를 하면 됩니다.

제가 직접 MAC 환경에서 터미널화면을 통해 실행해 보겠습니다.


sim-ui-MacBook-Air:vueJS shimjaewoon$ npm install vue

npm WARN saveError ENOENT: no such file or directory, open '/Users/shimjaewoon/vueJS/package.json'

npm notice created a lockfile as package-lock.json. You should commit this file.

npm WARN enoent ENOENT: no such file or directory, open '/Users/shimjaewoon/vueJS/package.json'

npm WARN vueJS No description

npm WARN vueJS No repository field.

npm WARN vueJS No README data

npm WARN vueJS No license field.


+ vue@2.4.2

added 1 package in 2.741s

sim-ui-MacBook-Air:vueJS shimjaewoon$ npm install --global vue-cli

/Users/shimjaewoon/.nvm/versions/node/v7.9.0/bin/vue -> /Users/shimjaewoon/.nvm/versions/node/v7.9.0/lib/node_modules/vue-cli/bin/vue

/Users/shimjaewoon/.nvm/versions/node/v7.9.0/bin/vue-init -> /Users/shimjaewoon/.nvm/versions/node/v7.9.0/lib/node_modules/vue-cli/bin/vue-init

/Users/shimjaewoon/.nvm/versions/node/v7.9.0/bin/vue-list -> /Users/shimjaewoon/.nvm/versions/node/v7.9.0/lib/node_modules/vue-cli/bin/vue-list

/Users/shimjaewoon/.nvm/versions/node/v7.9.0/bin/vue-build -> /Users/shimjaewoon/.nvm/versions/node/v7.9.0/lib/node_modules/vue-cli/bin/vue-build


> fsevents@1.1.2 install /Users/shimjaewoon/.nvm/versions/node/v7.9.0/lib/node_modules/vue-cli/node_modules/fsevents

> node install


[fsevents] Success: "/Users/shimjaewoon/.nvm/versions/node/v7.9.0/lib/node_modules/vue-cli/node_modules/fsevents/lib/binding/Release/node-v51-darwin-x64/fse.node" is installed via remote

+ vue-cli@2.8.2

added 968 packages in 52.491s

sim-ui-MacBook-Air:vueJS shimjaewoon$ vue init webpack vue-project


? Project name vuejs-paginator

? Project description A Vue.js plugin to easily integrate pagination.

? Author shimpark <shimpark@gmail.com>

? Vue build standalone

? Install vue-router? Yes

? Use ESLint to lint your code? Yes

? Pick an ESLint preset none

? Setup unit tests with Karma + Mocha? No

? Setup e2e tests with Nightwatch? No


   vue-cli · Generated "vue-project".


   To get started:

   

     cd vue-project

     npm install

     npm run dev

   

   Documentation can be found at https://vuejs-templates.github.io/webpack


sim-ui-MacBook-Air:vueJS shimjaewoon$ cd vue-project

sim-ui-MacBook-Air:vue-project shimjaewoon$ npm install


> fsevents@1.1.2 install /Users/shimjaewoon/vueJS/vue-project/node_modules/fsevents

> node install


[fsevents] Success: "/Users/shimjaewoon/vueJS/vue-project/node_modules/fsevents/lib/binding/Release/node-v51-darwin-x64/fse.node" is installed via remote

npm notice created a lockfile as package-lock.json. You should commit this file.

added 1025 packages in 46.917s

sim-ui-MacBook-Air:vue-project shimjaewoon$ npm run dev


> vuejs-paginator@1.0.0 dev /Users/shimjaewoon/vueJS/vue-project

> node build/dev-server.js


> Starting dev server...



 DONE  Compiled successfully in 5631ms                                                                    23:59:33


> Listening at http://localhost:8080


직접 사파리 브라우저가 뜨면서 실행화면을 보여 줍니다.