javascript - gulp+webpack+vue에서 패밀리 버킷을 만들고 싶어합니다. 소개나 기사 예제 코드가 있나요?

Question

Vue 공식 웹사이트에는 vue-cli 스캐폴딩과 함께 제공되는 webpack 패키징이 있는데, gulp를 컴파일하고 webpack 패키징하고 싶습니다. Vue는 프레임워크로 Family Bucket 스캐폴딩 프로젝트를 어떻게 시작해야 할지 모르겠습니다. 전문가의 조언을 구합니다!

Answer 1

먼저 왜 Gulp를 사용하여 컴파일할까요? Webpack에 대해 처음 알았을 때 응답자는 Gulp + Webpack의 워크플로도 구현했습니다. 작동하고 유지 관리할 수 있지만 실제로는 불필요한 복잡성을 가져옵니다. 실제로 빌드 시스템에는 Gulp를 사용해야 하는 작업이 없습니다. Gulp + Webpack 프로젝트에서는 100줄 수준의 패키징 구성 두 세트를 유지해야 하는데, 이는 실제로 사용하기 불편합니다. Gulp의 기능은 현재 추세이기도 한 NPM 스크립트로 완전히 대체될 수 있습니다. 기술 스택에 대한 기존 지식을 유지하고 Gulp를 도입하고 싶은 것은 이해할 수 있지만 필수는 아닙니다.

vue-cli의 Webpack 구성에 대한 이해를 전제로 코드를 간소화하고 vue + webpack의 구성 템플릿을 구현하는 것이 좋습니다. 답변자의 관행은 중형(10,000줄) Vue 프로젝트의 크기 요구 사항을 충족할 수 있는 Webpack 템플릿을 하나의 config.js만으로 작성할 수 있으며 webpack.dev.js와 webpack.dev.js를 구별할 필요조차 없다는 것입니다. webpack.prod.js.

참고로 위에서 언급한 100라인 수준의 Vue 중규모 프로젝트 템플릿입니다. 100라인 이내의 구성으로 HMR, 전처리기, 종속성 추출, 인라인 이미지, CSS 추출, HTML 생성, 역방향 프록시 등에 대한 공통 지원을 구현합니다. . 프론트엔드 엔지니어링 기능:
https://github.com/doodlewind...

이것은 Gulp + Webpack 프로젝트의 Gulpfile 템플릿입니다:
https://github.com/doodlewind...