Home > Article > WeChat Applet > A small and beautiful mini program scaffolding that allows you to develop mini programs more smoothly and quickly
Today I recommend to you a small program development scaffolding developed by myself. It has been used for nearly a year and is relatively stable. It will continue to be updated in the future. Welcome to use it and star.
Compared to the current Among the various cross-end solutions on the market, this development process is purer, does not introduce any new development difficulties, and completely improves development efficiency based on native mini programs~
pandora-boierpalte -wechat is a small and beautiful WeChat mini program development scaffolding. We have not introduced any new complexity and have 100% ability to use mini programs, but we have supplemented the mini program developer tools compared to normal The shortcomings of web development make it easier for you to develop WeChat applets.
We support the following enhanced capabilities:
Less pre-compiled writing style, automatically converted to wxss
Automatically introduce async/ await dependency
dev/test/pre/prod multi-environment configuration
npm dependency, use npm package like a normal web project, the rest Just leave it to the scaffolding
Module alias, no longer need to use relative paths to introduce js modules
icon font font file, small The icon uses the font file directly. We can go to the IconFont
site to download the svg file we like.
We have integrated the vant-weapp## provided by Youzan by default. # Come to the mini program component library, just
pa i f3fc15c0228dc320ab4107d8220f2b42 we can install the required components and their dependencies into the project
pandora-cli to develop WeChat mini programs.
Less Use
Automatically introduce async/await dependencies
Multiple environment configuration
appId: 'wxxxxxxxxx' appName: 'test-pandora' version: '1.0.0' development: env: 'development' host: 'https://api.dev.com' test: env: 'test' host: 'https://api.test.com' preproduction: env: 'preproduction' host: 'https://api.pre.com' production: env: 'production' host: 'https://api.prod.com'After the project is started, that is, after pa start, automatic compilation will be triggered every time the app.yaml file is updated and modifiedIn the js file that needs to be used, use the following method to introduce it
import config from 'config'The config object is the configuration file we built through different environments For example, after pa start starts, we get the configuration The object is as follows:
{ appId: 'wxxxxxxxxx', appName: 'test-pandora', version: '1.0.0', env: 'development', host: 'https://api.dev.com' }Use pa build --env test, and the configuration object obtained is as follows:
{ appId: 'wxxxxxxxxx', appName: 'test-pandora', version: '1.0.0', env: 'test', host: 'https://api.test.com' }npm dependencyThis scaffolding is not built using the npm official provided by the mini program Ability, the reasons are as follows:
pa i <pkg> --npm 或者 npm i <pkg>Both of the above two methods can install the latest version of the corresponding pkg into the project node_modules
Component library
pa i dialogThis command will automatically install only the dialog component and its dependencies from the vant-weapp library into the project src/compnents.
Module alias
icon font support
<text class="icon-font icon-font_wechat"></text>where icon -font is required. The second type consists of icon-font_b2354c84525a4625614aa52786726a22Of course we can add other styles to this element
样板文件创建
创建组件
pa c component demo 或者 pa create component demo
创建好的文件会自动位于项目 src/components 中
创建页面
pa c page demo 或者 pa create page demo
创建好的文件为自动位于项目 src/pages 中
CICD支持
在项目根目录下执行以下命令可以自动发布项目到小程序后台
pa release <version-type> -m '<comments>'
其中 version-type
为 major, minor, patch 可以参考 npm version 语义化版本
comments
为此次发布的描述,必填。
这里需要注意的是,pa release 使用的是小程序开发者工具的 HTTP 接口,所以务必保证小程序开发者工具启动,并且 设置 -> 安全 -> 安全(服务端口)开启
推荐教程:《微信小程序》
The above is the detailed content of A small and beautiful mini program scaffolding that allows you to develop mini programs more smoothly and quickly. For more information, please follow other related articles on the PHP Chinese website!