유니앱, 미니프로그램 하청계약 방법을 차근차근 가르쳐드립니다. (사진 및 글)

이 글에서는 uniapp크로스 도메인 관련 지식을 제공합니다. 유니앱 및 미니 프로그램의 하도급과 관련된 문제를 소개합니다. 하도급을 사용하는 각 미니 프로그램에는 메인 패키지가 포함되어 있어야 합니다. 소위 메인 패키지는 기본 시작 페이지/TabBar 페이지와 모든 하위 패키지가 사용해야 하는 일부 공용 리소스/JS 스크립트가 있는 곳입니다. 하위 패키지는 개발자의 구성에 따라 구분됩니다. 모두에게 도움이 될 것입니다.

추천: "uniapp 튜토리얼"

1. 미니 프로그램 하위 패키징

하위 패키징을 사용하는 각 미니 프로그램에는 메인 패키지가 포함되어 있어야 합니다. 소위 메인 패키지는 기본 시작 페이지/TabBar 페이지가 배치되는 곳이며 모든 하위 패키지에는 일부 공개 리소스/JS 스크립트가 필요하며 하위 패키지는 개발자의 구성에 따라 구분됩니다.

미니 프로그램이 시작되면 기본적으로 메인 패키지가 다운로드되고, 사용자가 하위 패키지의 페이지에 들어가면 클라이언트가 해당 하위 패키지를 다운로드하고 메인 패키지에 포함된 페이지가 실행됩니다. 다운로드 완료 후 표시

현재 미니 프로그램의 하위 패키지 크기에는 다음과 같은 제한이 있습니다.

• 전체 미니 프로그램의 모든 하위 패키지 크기는 20M를 초과할 수 없습니다
• 단일 하위 크기 -패키지/메인 패키지는 2M을 초과할 수 없습니다

미니 프로그램을 하도급하면 미니 프로그램 다운로드의 첫 시작 시간을 최적화할 수 있으며, 여러 팀이 함께 개발할 때 협업을 더 효과적으로 분리할 수 있습니다.

여기를 클릭하시면 이해하기 쉬운 공식 하도급 튜토리얼을 보실 수 있습니다.

두 번째, 유니앱 하도급 애플릿

앱은 전체 패키지가 기본값입니다. 미니 프로그램의 하도급 구성과 호환됩니다. 그 목적은 다운로드 속도를 높이는 것이 아니라 홈페이지가 vue일 때 시작 속도를 높이는 것입니다.

애플릿을 하청 계약한 후의 디렉토리 구조입니다

• 컴포넌트: 공용 구성 요소(메인 패키지에서 참조용)
• page_ 뒤에 병음이 오는 것은 모두 하청 계약입니다.
• 하위 패키지의 구성 요소는 단일 구성 요소입니다. 자체 구성 요소 디렉터리 및 하청 계약된 vue 페이지에 대한 참조는 자체 page_zhaoshang 하청 디렉터리에서만 참조될 수 있습니다.
• pages는 시작 페이지/TabBar 페이지를 포함하는 기본 패키지입니다.
• static에는 공개 정적 리소스가 포함되어 있습니다

.

하도급 단계:

1. 매니페스트.json 구성

"mp-weixin": {

"optimization":{"subPackages":true}

}

최적화 하도급:

해당 플랫폼(manifest.json) 구성 아래에 "optimization" 추가:{"subPackages": true}하위 패키지 최적화 활성화"optimization":{"subPackages":true}开启分包优化

目前只支持mp-weixin、mp-qq、mp-baidu的分包优化

• 静态文件：分包下支持 static 等静态资源拷贝，即分包目录内放置的静态资源不会被打包到主包中，也不可在主包中使用
• js文件：当某个 js 仅被一个分包引用时，该 js 会被打包到该分包内，否则仍打到主包（即被主包引用，或被超过 1 个分包引用）
• 自定义组件：若某个自定义组件仅被一个分包引用时，且未放入到分包内，编译时会输出提示信息

2.配置pages.json

在pages.json中新建数组"subPackages"，数组中包含两个参数：1.root：为子包的根目录，2.pages：子包由哪些页面组成，参数同pages；

注意：主包和分包是不能再同一目录下，在构建uniapp项目时，可以考虑一下目录结构，以便后期进行分包；

3.分包预载配置（preloadRule）

做这一步主要为了优化速度，不想优化速度的可以跳过这个配置

配置preloadRule后，在进入小程序某个页面时，由框架自动预下载可能需要的分包，提升进入后续分包页面时的启动速度

preloadRule 中，key 是页面路径，value

현재 mp-weixin, mp-qq, mp-baidu의 하도급 최적화만 지원합니다. 정적 파일: 하도급 하에서 정적과 같은 정적 리소스 복사를 지원합니다. 즉, 하도급 디렉터리에 있는 정적 리소스는 메인 패키지에 패키징되지 않으며 메인 패키지 js 파일에서도 사용할 수 없습니다. js는 하나의 하위 패키지에서만 참조되며, js는 하위 패키지에 패키지됩니다. 그렇지 않으면 여전히 기본 패키지에 패키지됩니다(예: 기본 패키지에서 참조되거나 2개 이상의 하위 패키지에서 참조). 사용자 정의 구성 요소: 사용자 정의 구성 요소가 하나의 하위 패키지에서만 참조되고 하위 패키지에 배치되지 않은 경우 컴파일 중에 프롬프트 메시지가 출력됩니다참고: 메인 패키지와 하위 패키지는 같은 디렉터리에 있을 수 없습니다. uniapp 프로젝트를 빌드할 때 나중에 하청 계약을 위한 디렉터리 구조를 고려할 수 있습니다. 3. 사전 로드 구성 하도급(preloadRule)이 단계는 주로 다음을 수행합니다. 속도를 최적화하고 싶지 않다면 이 구성을 건너뛸 수 있습니다preloadRule을 구성한 후 미니 프로그램의 특정 페이지에 들어가면 프레임워크가 자동으로 필요할 수 있는 하위 패키지를 사전 다운로드합니다. 후속 하위 패키지 페이지preloadRule에 들어갈 때 시작 속도를 향상시킵니다. key는 페이지 경로이고, value는 이를 입력하기 위해 사전 다운로드된 구성입니다. 각 구성에는 다음 항목이 있습니다.

			2. Pages.json을 구성합니다	새 항목을 만듭니다. Pages.json 배열 "subPackages"에서 배열에는 두 개의 매개변수가 포함되어 있습니다. 1. 루트: 하위 패키지의 루트 디렉터리, 2. 페이지: 하위 패키지가 구성되는 페이지, 매개변수는 페이지와 동일합니다.
Field	Type	필수	기본값	Description

🎜🎜packages🎜🎜StringArray🎜🎜은 🎜🎜None🎜🎜루트 또는 이름 페이지에 들어간 후 사전 다운로드된 하위 패키지의 __APP__은 기본 패키지를 나타냅니다. 🎜🎜🎜🎜network🎜🎜String🎜🎜No🎜🎜wifi🎜🎜지정된 네트워크에서 사전 다운로드, 선택적 값은 다음과 같습니다: all(네트워크에 국한되지 않음), wifi(wifi에서만 사전 다운로드)🎜🎜 🎜🎜

앱 하도급도 preloadRule을 지원하지만 네트워크 규칙이 유효하지 않습니다.

예:

마지막으로 uniapp 공식 문서에 들어가 구성 항목을 보려면 클릭하세요.

권장: "uniapp tutorial"

위 내용은 유니앱, 미니프로그램 하청계약 방법을 차근차근 가르쳐드립니다. (사진 및 글)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!