이 글은 Vue 패키징을 사용할 때 Vendor 파일이 너무 크거나 app.js 파일이 너무 큰 문제에 대한 해결책을 주로 소개합니다. 매우 좋고 필요한 친구들이 참고할 수 있습니다.
최초 사용자 vue2.0 개발에는 이전에 angle1.x를 사용했습니다. vue-cli 스캐폴딩(UI용 Element-ui)을 사용하여 패키징한 후 벤더 파일이 거의 1M에 달하는 매우 큰 것을 발견했습니다. . 나중에 정보를 읽은 후 webpack이 모든 라이브러리를 함께 패키지하여 파일이 매우 크다는 것을 깨달았습니다.내 솔루션:
1. 자주 변경되지 않는 라이브러리를 index.html에 넣고 다음과 같이 cdn을 통해 가져옵니다.externals: { 'vue': 'Vue', 'vue-router': 'VueRouter', 'element-ui': 'ELEMENT', },에 추가하면 webpack이 vue.js, vue-router, element-ui 라이브러리를 패키징하지 않습니다. main.js에서 요소의 도입부를 삭제했다고 선언하겠습니다. 그렇지 않으면 패키지된 app.css가 여전히 요소의 CSS를 패키지하고 삭제 후에 사라질 것이라는 것을 알았습니다. 그러면 패키징을 해보면 Vendor 파일이 훨씬 작다는 것을 알 수 있습니다~아직 만족하지 못하셨다면 계속 읽어주세요... 2. vue 라우팅의 지연 로딩(특정 기능에 대해서는 공식 홈페이지는 여기입니다. 소개할 내용이 많지 않습니다.) 처음에는 다음과 같이 라우팅을 사용할 수 있습니다(router.js). 그러면 페이지에 진입할 때 모든 라우팅 리소스가 로드됩니다. 프로젝트가 클 경우 많은 콘텐츠가 로드되고 대기 시간이 발생합니다. 페이지가 길어져서 사용자 경험이 나빠질 수 있습니다.
vue 프로젝트를 패키징할 때 빈 페이지 문제를 해결하는 방법
HBulider를 통한 Vue 웹앱 프로젝트 패키징 네이티브 앱 소개
위 내용은 Vue 패키징 사용시 벤더 파일이 너무 크거나 app.js 파일이 너무 큰 문제를 해결하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!