【Nuxt.js】Vue CLI로 어플리케이션 병아리를 만들 때까지

2770 단어 Vue.jsnuxt.jsNode.js


언어화하기 위해 기사에서 일어났습니다.
다재다능한 스타터 템플릿으로 병아리를 만들 때까지 간략하게 기록합니다.

사전 준비



①Node.js 도입
②Yarn 도입
③direnv 도입

①, ② 함께 Nuxt.js로 개발하는데 필수가 되므로 도입한다(여기에서는 이러한 도입 방법에 대해서는 생략합니다).

③은 터미널의 current 디렉토리에서 환경 변수를 자동으로 설정해 주는 툴. 환경 변수의 설정을 잊어 버리는 것을 방지하기 위해 도입하는 것이 좋습니다.

1



터미널
npm i -g @vue/cli @vue/cli-init

위의 명령으로 Vue 명령을 추가합니다. "Vue -V"로 버전 확인.

터미널
$ vue -V
  @vue/cli 4.5.9

2



1에 의해, 「vue init」명령으로 프로젝트 작성 가능.
이번은 초학자나 커스터마이즈 해 이용하고 싶은 분에게 추천하는 템플릿인 「my-first-nuxt-app」를 이용한다.

desktop
$ vue init nuxt-community/starter-template my-first-nuxt-app

설치 중 몇 가지 질문은 모두 Enter에서 OK.
작성 후,

터미널
$ cd my-first-nuxt-app #ディレクトリに移動
$ yarn #パッケージをインストール
$ yarn dev # 開発モードでプロジェクトを起動

OPEN http://localhost:3000
라고 표시 후, 상기 URL에 액세스한다.

3





이러한 표시가 나오면 완료입니다!

좋은 웹페이지 즐겨찾기