다음을 통해 공유


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

WSL(Linux용 Windows 하위 시스템)에서 Vue.js 개발 환경을 설정하는 가이드입니다. 배경은 Vue.js 개요를 참조하세요.

Vue는 Windows 또는 WSL에서 직접 설치할 수 있습니다. Node.js 백 엔드와 상호 작용하거나, Linux 서버에 배포하거나, Bash 명령을 사용하는 자습서를 수행하려는 경우 WSL을 사용하는 것이 좋습니다.

필수 조건

  • WSL 2 모드에서 실행되는 Linux 배포판(예: Ubuntu)을 포함하여 WSL(Linux용 Windows 하위 시스템)을 설치합니다. 다음으로 확인: wsl -l -v
  • WSL 2에 Node.js 설치: 여기에는 버전 관리자, 패키지 관리자, Visual Studio Code 및 원격 개발 확장이 포함됩니다.

중요합니다

탑재된 Windows 드라이브()가 아닌 WSL 파일 시스템 내에 ~/projects/mnt/c/프로젝트 파일을 저장합니다. 파일 시스템 경계를 넘어 작업하면 설치 및 빌드 시간이 크게 느려집니다.

Vue 프로젝트 만들기

새 Vue 3 프로젝트를 npm create vue@latest시작하는 권장 방법은 공식 Vite 기반 스캐폴딩 도구 인 create-vue 를 사용하는 것입니다.

  1. WSL 터미널(예: Ubuntu)을 엽니다.

  2. 프로젝트 디렉터리로 이동합니다.

    mkdir -p ~/projects
    cd ~/projects
    
  3. 새 Vue 프로젝트를 만듭니다.

    npm create vue@latest
    

    설치 관리자가 프로젝트 이름을 지정하고 선택적 기능(TypeScript, JSX 지원, Vue 라우터, 피니아 상태 관리, Vitest, ESLint)을 선택하라는 메시지를 표시합니다.

  4. 프로젝트 폴더로 이동하고, 종속성을 설치하고, 개발 서버를 시작합니다.

    cd <your-project-name>
    npm install
    npm run dev
    

    앱은 http://localhost:5173에서 사용할 수 있습니다.

추가 리소스