다음을 통해 공유


Linux용 Windows 하위 시스템에 Vue.js 설치

WSL(Windows 하위 시스템)에 Vue.js 웹 프레임워크를 설치하여 Windows에서 Vue.js 개발 환경을 설정하는 데 도움이 되는 가이드입니다. Vue.js 개요 페이지에서 자세히 알아보세요.

Vue는 Windows 또는 WSL에서 직접 설치할 수 있습니다. 일반적으로 WSL에 설치하는 것을 권장합니다. NodeJS 백엔드와 상호 작용하려 하거나, Linux 프로덕션 서버와 유사한 환경을 원하거나, Bash 명령어를 활용하는 자습서를 따르려는 경우에 그렇습니다. Vue.js대신 Vite를 대안으로 고려해볼 수도 있습니다.

필수 조건

  • Linux 배포판(예: Ubuntu)을 포함하여 WSL(Linux용 Windows 하위 시스템)설치하고 WSL 2 모드에서 실행 중인지 확인합니다. PowerShell을 열고 wsl -l -v를 입력하여 확인할 수 있습니다.
  • WSL 2에 Node.js 설치: 여기에는 버전 관리자, 패키지 관리자, Visual Studio Code 및 원격 개발 확장이 포함됩니다. 노드 패키지 관리자(npm)는 Vue.js설치하는 데 사용됩니다.

중요합니다

WSL에 Linux 배포를 설치하면 파일을 저장할 수 있는 디렉터리가 생성됩니다(\\wsl\Ubuntu-20.04)(Ubuntu-20.04를 사용 중인 Linux 배포로 대체). Windows 파일 탐색기에서 이 디렉터리를 열려면 WSL 명령줄을 열고, 홈 디렉터리를 사용하여 cd ~선택한 다음, 탑재된 C 드라이브(explorer.exe .)에서 작업할 파일을 설치하거나 저장하지 않도록 주의하는 명령을 /mnt/c/Users/yourname$ 입력합니다. 이렇게 하면 설치 및 빌드 시간이 크게 느려집니다.

설치 Vue.js

WSL에 Vue.js 설치하려면 다음을 수행합니다.

  1. WSL 명령줄을 엽니다(예: Ubuntu).

  2. 새 프로젝트 폴더를 만들고(mkdir VueProjects) 해당 디렉터리를 입력합니다(cd VueProjects).

  3. 노드 패키지 관리자(npm)를 사용하여 Vue.js 설치:

npm install vue

다음 명령을 vue --version사용하여 설치한 버전 번호를 확인합니다.

비고

NPM이 아닌 CDN을 사용하여 Vue.js 설치하려면 Vue.js 설치 문서를 참조하세요.

Vue CLI 설치

Vue CLI는 터미널/명령줄에서 Vue를 사용하기 위한 도구 키트입니다. 이를 통해 새 프로젝트를 신속하게 구축하고(vue create), 새로운 아이디어를 프로토타입하며(vue serve), 그래픽 사용자 인터페이스를 사용하여(vue ui) 프로젝트를 관리할 수 있습니다. Vue CLI는 빌드 복잡성(예: Babel 또는 Webpack 사용)을 처리하는 전역적으로 설치된 npm 패키지입니다. 새 단일 페이지 앱을 빌드하지 않는 경우 Vue CLI가 필요하거나 원하지 않을 수 있습니다.

Vue CLI를 설치하려면 npm을 사용합니다. 업그레이드하려면 플래그를 -g 사용하여 전역적으로 설치해야 합니다(vue upgrade --next

npm install -g @vue/cli

추가할 수 있는 플러그인(예: GraphQL 통합을 위한 Apollo 또는 Linting)에 대해 자세히 알아보려면 Vue CLI 문서의 Vue CLI 플러그인을 방문하세요.

추가 리소스