티스토리 뷰
개요
Nuxt.js
는 Vue.js 기반의 프론트엔드 프레임워크이다. 상당히 많은 부분을 추상화, 자동화하여 개발자가 개발 자체에 집중할 수 있게 해주는 유용한 프레임워크이다.
Node.js, npm 사전 설치
- 먼저 시스템에
Node.js
와npm
을 설치해야 한다. 여기에서 다운로드 후 설치한다.
### Node.js 설치 확인
$ node -v
v10.16.0
### npm 설치 확인
$ npm -v
6.9.0
Nuxt.js 기본 프로젝트 생성
- 아래와 같이 Nuxt.js 기본 프로젝트를 생성한다.
$ npm init nuxt-app hello-nuxt
Generating Nuxt.js project in hello-nuxt
? Project name: hello-nuxt
? Project description
? Author name
? Choose the package manager: Npm
? Choose UI framework: Element
? Choose custom server framework: None (Recommended)
? Choose Nuxt.js modules: Axios
? Choose linting tools: ESLint, Prettier
? Choose rendering mode: Single Page App
- 생성을 완료하면 hello-nuxt라는 이름의 프로젝트 디렉토리가 생성된다.
프로젝트 실행
- 생성된 프로젝트의 실행 방법은 아래와 같다.
### 프로젝트 디렉토리로 이동
$ cd hello-nuxt
### 개발 환경을 실행, http://localhost:3000 주소로 브라우저 접속이 가능
$ npm run dev
### 프러덕션 배포를 위한 빌드 실행
$ npm run build
$ npm run start
### Intellij IDEA 실행
$ idea64 .
npm run dev
명령을 실행하면 개발 환경이 실행되어http://localhost:3000
주소로 리스닝을 시작한다. 프로젝트에 변경점이 발생할 경우 재시작할 필요 없이 자동으로 인지하며 오류 메시지 또한 상세하게 출력해준다./pages
디렉토리(또는 하위 디렉토리)에 .vue 파일을 작성할 때마다 Nuxt.js는 자동으로 vue-router 설정 파일을 생성해준다. 초기 시작 파일은 /pages/index.vue이다.
댓글
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- jsp
- jpa
- 자전거
- bootstrap
- 구동계
- jstl
- 로드 바이크
- Spring MVC 3
- java
- Eclipse
- spring
- 평속
- CentOS
- Spring Boot
- Kendo UI
- MySQL
- chrome
- Docker
- JavaScript
- JHipster
- DynamoDB
- graylog
- Kendo UI Web Grid
- maven
- Tomcat
- node.js
- 알뜰폰
- 태그를 입력해 주세요.
- kotlin
- 로드바이크
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
31 |
글 보관함