>  기사  >  웹 프론트엔드  >  소포를 사용하여 vue 스캐폴딩을 구성하는 방법(자세한 튜토리얼)

소포를 사용하여 vue 스캐폴딩을 구성하는 방법(자세한 튜토리얼)

亚连
亚连원래의
2018-06-12 14:49:131515검색

parcel-vue는 Parcel 패키징 도구를 기반으로 하는 VueJS 신속 개발 스캐폴딩 솔루션으로 node8.0 이상을 사용하는 것이 좋습니다. 이 기사에서는 새로운 패키징 도구인 소포 제로 구성 Vue 개발 스캐폴딩에 대한 관련 지식을 소개합니다. 관심 있는 친구들은 꼭 살펴보세요.

parcel-vue는 Parcel 패키징 도구를 기반으로 하는 VueJS 신속 개발 스캐폴딩 솔루션입니다. node8.0 이상을 사용하는 것이 좋습니다

프로젝트 주소: https://github.com/w3c-king/parcel-vue

초기화 프로젝트

$ git clone https://github.com/w3c -king/parcel-vue.git

설치 종속성

$ cd parce-vue
$ npm install

그 중 Parcel-Bundler는 vue로 끝나는 단일 파일의 경우 파일 형식을 별도로 처리해야 합니다. 플러그인은 vueify를 통해 해당 코드를 생성하고, 소포는 자동으로 소포 플러그인부터 시작하는 종속성을 로드합니다.

개발 환경을 실행하고 브라우저 http://localhost:1234를 열어 프로젝트를 확인하세요

$ npm run dev

패키징 및 컴파일

$ npm run build

Development

디렉토리 구조

src
├── router
 ├── index.js
├── assets
 ├── logo.png
├── components
 ├── Hello
 ├── index.js
 ├── index.js
├── views
 ├── HelloWorld
  ├── images
   ├── logo.png
  ├── HelloWorld.vue
├── styles
 ├── common.css
├── store
 ├── global
  ├── global.js
  ├── index.js
 ├── index.js
├── app.vue
├── index.js

실행만npm run dev npm run build 하면 됩니다. 개발하고 구축하세요.

위 내용은 모두를 위해 제가 정리한 내용입니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

vue-cli에서 webpack2 프로젝트 패키징 최적화를 구현하는 방법

es6에서 내보내기와 내보내기 기본값의 차이점은 무엇입니까?

Vue에서 Swiper를 캡슐화하여 그림 캐러셀을 구현하는 방법

vue에서 ztree를 사용하는 방법(자세한 튜토리얼)

JS를 사용하여 폭포 흐름 플러그인을 구현하는 방법

위 내용은 소포를 사용하여 vue 스캐폴딩을 구성하는 방법(자세한 튜토리얼)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.