미니앱
WeChat 미니 프로그램 개발 재정의
변경 로그
minapp 2.0.0이 출시되었습니다. 새 버전은 주로 webpack 4를 사용합니다. v1.x에서 v2.x로의 업그레이드를 확인하세요.
소개하다
minapp은 개발 경험을 향상시키기 위해 WeChat 미니 프로그램을 개발하기 위해 만들어진 도구 세트입니다.
- 프로젝트를 신속하게 생성하고 webpack을 사용하여 생성된 프로젝트를 빌드하는 데 사용할 수 있는 명령줄 도구
@minapp/cli
를 제공합니다. -
@minapp/core
개발 프레임워크를 제공합니다. 이 프레임워크는 기본 애플릿 코드와 완벽하게 호환되며 클래스를 사용한 개발을 지원하고 자동 코드 완성을 지원하며 모든 WeChat API의 자동 완성도 제공합니다. - mobx를 통합하는
@minapp/mobx
프레임워크를 제공합니다. 이 프레임워크는 주로 mobx를 @minapp/core
에 주입하므로 mobx를 사용하여 글로벌 데이터를 쉽게 관리할 수 있습니다. - vscode 플러그인
minapp-vscode
제공 이 플러그인은 주로 소규모 프로그램을 위한 wxml
템플릿 언어로, 모든 구성 요소, 구성 요소 속성, 구성 요소 속성 값 등을 자동으로 완성할 수 있습니다.
참고: minapp을 사용한 후에도 테스트를 위해 WeChat에서 공식적으로 제공하는 "WeChat 개발자 도구"를 사용해야 합니다.
사용
- npm을 사용하여 명령줄 도구 설치:
npm install -g @minapp/cli
- 프로젝트 초기화:
minapp init <你要创建项目的文件夹>
(js 및 ts 프로젝트 동시 생성 지원) - 두 개의 vscode 플러그인 설치: minapp 및 dot-template(선택 사항이지만 권장됨)
특징
- 네이티브 미니 프로그램과 완벽하게 호환되며 모든 네이티브 미니 프로그램 코드를 minapp 환경으로 직접 마이그레이션할 수 있습니다.
- 컴파일을 보장하기 위해 webpack과 webpack-dev-server 통합
- 글로벌 데이터 관리를 용이하게 하기 위해 mobx를 사용하도록 선택할 수 있습니다.
- 모든 언어는 minapp 환경에서 자동 완성이 가능하며, 개발 경험도 매우 훌륭합니다. (아래
功能概览
참조) - 양방향 데이터 바인딩 지원
- setData 성능 최적화
기능 개요(vscode 편집기 아래)
모든 wx 인터페이스에는 인터페이스 매개변수 및 반환 값을 포함한 지능형 알림이 있습니다.
Minapp이 아닌 사용자도 @minapp/wx
설치하여 이 기능을 사용할 수 있습니다. 여기를 참조하세요.
wx와 동일한 wx 인터페이스 wxp의 약속 버전을 제공합니다. 단, 성공/실패/완료의 세 가지 매개변수가 필요한 wx의 모든 기능을 약속한다는 점만 다릅니다.
- wxp는 성공 콜백 사용도 지원합니다.
- wxp는 Promise에 finally 메소드를 추가합니다. 예를 들어
wxp.getUserInfo().finally(() => { /* do something */ })
사용할 수 있습니다.
mobx를 통합하면 전역 데이터를 수정하고 현재 페이지 상태를 자동으로 업데이트하는 것이 매우 편리해졌습니다.
- Store를 주입하려면 appify 함수에 Store 개체만 추가하면 됩니다.
- 저장소 개체는 기본적으로 페이지 및 구성 요소에 주입되어
this.store
사용할 수 있습니다.
wxml 템플릿 언어는 구문 강조, 구성 요소 스마트 프롬프트 및 구성 요소 속성 스마트 프롬프트를 지원합니다(vscode 플러그인 minapp을 설치해야 함).
이 플러그인의 기능에 대한 자세한 내용을 보려면 여기를 클릭하세요.
json 파일은 자동 프롬프트를 지원합니다
새 페이지 폴더 생성시 관련 파일이 자동으로 생성됩니다. (vscode 플러그인 도트 템플릿 설치 필요)
- js/json/wxml/scss를 포함하여 동일한 이름의 관련 파일을 자동으로 생성하고 언제든지 .dtpl 폴더에서 이러한 템플릿 파일을 수정할 수 있습니다.
- 새로 생성된 페이지 경로를 app.json 폴더에 자동으로 삽입합니다.
미니 프로그램 페이지는 자동 기능 프롬프트를 지원합니다.
같은 방식으로 새 구성 요소 폴더를 생성하면 관련 파일도 동시에 생성되며 구성 요소의 라이프 사이클 기능도 자동으로 메시지를 표시합니다.
이 창고 설명 정보
이것은 하나의 프로젝트가 아니라 lerna 개발 도구를 사용하는 여러 프로젝트의 조합입니다. 다른 프로젝트는 패키지 디렉토리에 있습니다. 다음은 몇 가지 주요 프로젝트에 대한 간략한 개요입니다.
- minapp-generator: 이 모듈은 WeChat 공식 문서를 구문 분석하고 다른 모듈에서 사용할 구조화된 데이터를 생성하는 역할을 담당합니다.
- minapp-wx: WeChat의 모든 기본 API에 대한 TypeScript 정의이며 wx 인터페이스의 약속 버전도 제공합니다.
- minapp-core: 개발 프레임워크, minapp-wx에 의존해야 함
- minapp-mobx: mobx를 통합하고 minapp-core에 의존해야 하는 개발 프레임워크
- minapp-cli: 사용자에게 제공되는 명령줄 도구로 새 프로젝트를 빠르게 생성할 수 있습니다.
- minapp-vscode: vscode 플러그인, 구문 강조 표시, wxml에 대한 태그 및 속성 자동 완성 제공
TODO