[Vue.js] nuxi란? nuxt dev와 nuxi dev 명령어 차이

nuxi란?

nuxi는 Nuxt.js 프레임워크에서 제공하는 CLI(Command Line Interface) 도구로, Nuxt 3 프로젝트를 생성하고 관리하는 데 사용됩니다. Nuxt.js는 Vue.js 기반의 서버 사이드 렌더링(SSR) 및 정적 사이트 생성(SSG)을 지원하는 프레임워크이며, Nuxt 3부터 nuxi라는 CLI 도구가 도입되었습니다.

nuxt dev와 nuxi dev 명령어 차이

nuxt dev와 nuxi dev는 Nuxt.js 프로젝트에서 개발 서버를 실행하는 명령어들이지만, 두 명령어는 Nuxt 버전에 따라 다르게 사용됩니다.

1. nuxt dev

• Nuxt 2에서 사용되는 명령어입니다.
• Nuxt 2.x 버전의 프로젝트에서 개발 서버를 실행하려면 nuxt dev를 사용합니다.
• nuxt 명령어는 Nuxt.js의 기본 CLI(Command Line Interface) 도구로, Nuxt 프로젝트에서 개발 서버 실행, 빌드, 정적 사이트 생성 등의 작업을 수행할 수 있습니다.

2. nuxi dev

• Nuxt 3에서 도입된 명령어입니다.
• Nuxt 3 프로젝트에서는 더 이상 nuxt CLI를 사용하지 않고, nuxi라는 새로운 CLI 도구를 사용합니다.
• nuxi dev는 Nuxt 3 프로젝트에서 개발 서버를 실행하는 데 사용되며, Nuxt 3의 최신 기능과 구조에 맞춘 CLI 명령어입니다.

차이점 요약

• nuxt dev는 Nuxt 2에서 사용되고, nuxi dev는 Nuxt 3에서 사용됩니다.
• Nuxt 3부터는 새로운 CLI인 nuxi로 대체되었으며, Nuxt 2에서는 여전히 nuxt CLI를 사용합니다.

따라서, Nuxt 2와 Nuxt 3의 차이에 따라 각각 적절한 명령어를 사용해야 합니다.

참고) Nuxt 3 프로젝트에서 package.json에 dev scripts에 nuxt dev로 작성되어 있는 이유

Nuxt 3 프로젝트에서 package.json에 nuxt dev로 작성되어 있는 이유는 Nuxt 3에서도 여전히 nuxt 명령어가 동작하기 때문입니다. Nuxt 3에서는 기본적으로 nuxi라는 새로운 CLI 도구를 도입했지만, nuxt 명령어는 여전히 Nuxt 3 프로젝트에서도 사용 가능합니다.

이유

1. nuxi와 nuxt는 함께 사용 가능
   Nuxt 3에서는 nuxi가 Nuxt CLI의 기본 실행 도구가 되었지만, nuxt는 여전히 Nuxt 2와 Nuxt 3 모두에서 사용할 수 있는 명령어입니다. 즉, nuxi dev는 Nuxt 3의 명령어이지만, 내부적으로는 nuxt 명령어와 동일한 역할을 하며, 프로젝트 실행에 사용됩니다.
2. 역방향 호환성
   Nuxt 2에서 Nuxt 3으로 마이그레이션하는 사용자들이 많기 때문에, Nuxt 2에서 익숙한 nuxt 명령어를 계속 사용할 수 있도록 지원하는 방식입니다. nuxt 명령어를 그대로 두면, 사용자는 Nuxt 2에서 Nuxt 3으로 넘어가는 과정에서 혼란을 줄일 수 있습니다.
3. 자동 연결
   Nuxt 3 프로젝트에서 nuxi 명령어가 프로젝트 초기화 및 개발 서버 실행을 관리하지만, 프로젝트 내부에서는 nuxt 패키지가 설치되며, 이 패키지가 실제 실행을 담당합니다. 따라서 package.json의 스크립트에서 nuxt dev로 정의되어 있어도, Nuxt 3 환경에서는 nuxi dev와 동일하게 동작합니다.

요약

• Nuxt 3에서는 nuxi가 새로운 CLI이지만, nuxt dev 명령어도 여전히 작동합니다.
• Nuxt 2와의 호환성을 유지하기 위한 조치로, nuxt 명령어는 Nuxt 3에서도 계속 사용 가능합니다.
• 따라서 package.json에 nuxt dev가 작성되어 있어도, Nuxt 3에서 정상적으로 작동합니다.

 

 

Reference

• https://nuxt.com/docs/api/commands/dev