Vue 프로젝트 - 코드 구조
webpack 템플릿vue-cli가 설치되어 있으면 프로젝트 루트가 있는 디렉터리에서 아래 명령을 실행하십시오.vue init webpack my-project
설치
vue-cli가 없으면 위 명령을 실행하기 전에 아래 명령을 실행할 수 있습니다.npm install --global vue-cli
기본 코드 구조
README.md - 프로젝트 설명 파일package.json - 이 프로젝트에 필요한 각종 모듈과 프로젝트의 설정 정보(예를 들어 이름, 버전, 허가증 등 메타데이터)를 정의했다.package-lock.json---npm에 자동으로 node 수정modules 트리나 그 어떠한 조작으로 패키지를 생성합니다.jsonLICENSE---소스 오픈 프로토콜index.html---프로젝트 기본 첫 페이지 템플릿.postcssrc.js---postcss에 대한 설정 항목.gitignore---git 제출 무시 파일 목록.eslintrc.js---안에 일부 코드의 규범이 설정되어 있습니다. 규범에 따라 쓰지 않으면 오류를 알릴 수 있습니다..eslintignore---eslint 문법에 따라 코드를 쓸 필요가 없는 파일 목록을 지정.editorconfig---편집기의 일부 설정 항목.babelrc---문법 해석기를 지정하여 우리의 코드를 브라우저가 식별하는 문법static---정적 자원 파일 저장 위치node_modules---항목에 의존하는 일부 제3자 패키지로 변환합니다.main.js---전체 프로젝트의 입구 파일App.vue---루트 구성 요소router/index.js---루트 관리 프로필components---프로젝트 중의 일부 구성 요소assets/---프로젝트에 사용된 이미지 자원config/---프로젝트의 구성 파일, 기초 정보index.js에 놓고, 개발 환경 설정 정보dev.env.js,온라인 환경 설정 정보prod.env.jsbuild/---프로젝트 패키지용 설정 항목구조조정: 첫째,
/compontents 디렉터리를 삭제하고 디렉터리 구조/pages를 추가한 다음에 한 페이지를 개발할 때, 예를 들어 home 페이지는 /pages/home/Home.vue와 /pages/home/compontents를 만들어서 개발한다. compontents 디렉터리는 home 페이지의 구성 요소, 예를 들어 Header.vue 등이다.2.
/src/common 디렉터리를 만들고 그 안에 공공 구성 요소를 넣는다. 예를 들어 갤러리 구성 요소는 /src/common/gallary/Gallary.vue와 /src/common/gallary/compontents를 만들어서 개발한다. compontents 디렉터리에 놓인 것은 gallary의 구성 요소이다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.