PhpStorm, Node.js 프로젝트 임포트하기

개요

PhpStorm은 PHP와 Node.js 개발환경을 지원하는 막강한 IDE이다. (소개 글 링크) 이번 글에서는 PhpStorm에서 Node.js 프로젝트를 작성하는 방법을 소개하고자 한다.

프로젝트 임포트

GitHub에 공개된 hapi 기반의 간단한 Node.js 프로젝트를 예로 이미 작성된 프로젝트 임포트 방법을 알아보자.

# GitHub 저장소에서 프로젝트를 로컬로 복제하고 종속된 라이브러리를 설치한다.
> git clone https://github.com/rjmreis/hapi-api.git
> cd hapi-api
> npm install

# PhpStorm를 실행한다.
> phpstorm64 .

• 모든 Node.js 기반 프로젝트는 루트 디렉토리에 ‘package.json` 파일이 존재한다. PhpStorm에서 해당 디렉토리를 오픈하면 프로젝트가 로드된다.

프로젝트 환경설정

프로젝트를 본격적으로 실행하기에 앞서 각 프로젝트의 성격에 맞는 환경설정이 필요하다.

• Node.js 프로젝트는 NodeJS 플러그인을 요구하는데 PhpStorm은 이미 내장되어 있어 따로 설치할 필요가 없다.
• 다음으로 중요한 것은 Node.js Core Library를 활성화하는 것이다. 아래 순서대로 활성화한다.

File → Settings → Languages & Frameworks
→ Node.js and NPM
→ Coding Assistance
→ Node.js Core library is enabled.: Disable → Enable → OK

• 마지막으로 JavaScript의 버전을 프로젝트에 맞게 선택할 수 있다. 프로젝트가 ECMAScript 6로 작성되었다면 아래와 같이 ECMAScript 6로 선택한다. 버전이 맞지 않을 경우 오류가 발생한다.

File → Settings → Languages & Frameworks
→ JavaScript 
→ JavaScript language version: ECMAScript 5.1 → ECMAScript 6 → OK

프로젝트 실행

이제 프로젝트를 실행할 차례이다. PhpStorm은 사용자의 입맛대로 개별 실행환경을 설정할 수 있다.

Run → Edit Configuration → +
→ Add New Configuration: Node.js
→ Name: hapi-project
→ Working directory: .../hapi-project
→ JavaScript file: server.js

• 이제 SHIFT + F10 단축키를 실행하면 프로젝트를 실행할 수 있다.

참고 문서

• https://confluence.jetbrains.com/display/PhpStorm/Getting+Started+with+Node.js+in+PhpStorm
• https://www.jetbrains.com/help/phpstorm/2017.1/running-and-debugging-node-js.html