다음 단계에 따라 WebStorm에서 Vue 프로젝트를 만듭니다. WebStorm 및 Vue CLI를 설치합니다. WebStorm에서 Vue 프로젝트 템플릿을 만듭니다. Vue CLI 명령을 사용하여 프로젝트를 만듭니다. 기존 프로젝트를 WebStorm으로 가져옵니다. Vue 프로젝트를 실행하려면 "npm run Serve" 명령을 사용하세요.
![Webstorm에서 vue 프로젝트를 만드는 방법](https://img.php.cn/upload/article/202404/08/2024040812032356673.jpg)
WebStorm에서 Vue 프로젝트를 만드는 방법
1단계: WebStorm 및 Vue CLI 설치
- WebStorm IDE를 설치합니다.
- Vue.js 프로젝트용 명령줄 인터페이스인 Vue CLI를 설치하세요. 터미널 또는 명령 프롬프트에서 다음 명령을 실행합니다.
<code>npm install -g @vue/cli</code>
2단계: Vue 프로젝트 만들기
- WebStorm을 엽니다.
- "WebStorm에 오신 것을 환영합니다" 화면을 클릭하거나 "파일 > 새 프로젝트..."로 이동하세요.
- "새 프로젝트" 대화 상자에서 "Vue.js" 템플릿을 선택하세요.
- "프로젝트 위치" 필드에서 프로젝트 경로를 지정하세요.
- "프로젝트 이름" 필드에 프로젝트 이름을 입력하세요.
- "Vue CLI 사용" 확인란을 선택하세요.
- "만들기" 버튼을 클릭하세요.
3단계: Vue CLI를 사용하여 프로젝트 생성
- WebStorm에서 터미널 탭을 엽니다.
- 프로젝트의 루트 디렉터리로 이동하세요.
- 다음 Vue CLI 명령을 실행하세요:
<code>vue create <project-name></code>
- 기본 옵션을 선택하고 "Enter" 키를 누르세요.
4단계: 기존 프로젝트를 WebStorm으로 가져오기
- Vue CLI를 사용하여 프로젝트를 이미 생성한 경우 WebStorm으로 가져올 수 있습니다.
- "파일 > 열기..."를 클릭합니다.
- 프로젝트의 루트 디렉터리로 이동하세요.
- "package.json" 파일을 선택하고 "열기" 버튼을 클릭하세요.
5단계: Vue 프로젝트 실행
<code>npm run serve</code>
- 이렇게 하면 Vue 프로젝트가 개발 모드에서 시작됩니다.
팁:
- "npm run " 명령을 사용하여 WebStorm에서 다른 npm 스크립트를 실행할 수 있습니다.
- 코드 서식을 지정하려면 "Ctrl + Alt + L"(Windows) 또는 "Cmd + Option + L"(Mac)을 누르세요.
- "Cmd + B"(Mac) 또는 "Ctrl + B"(Windows)를 사용하여 브라우저에서 프로젝트를 봅니다.
위 내용은 Webstorm에서 vue 프로젝트를 만드는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!