Taro 打包发布
在完成开发后,你就可以将 Taro 项目打包并发布到对应平台了。本篇将带你了解 Taro 项目的打包流程,涵盖多平台打包命令、构建配置、微信小程序与 H5 的发布方法,以及一些常见问题处理,帮助你顺利完成从开发到上线的最后一步。
准备工作
在打包前,请确保你已经完成以下准备:
- 所有功能已开发并测试完毕;
- 项目依赖已正确安装(执行过
npm install
或pnpm install
); config
配置文件(如config/index.js
)中 各平台的构建参数已设置妥当;- 微信小程序开发者工具或其他目标平台工具已安装。
Taro 构建命令
Taro 提供了多个打包构建命令,根据你目标平台的不同,命令略有差异。
1. 小程序打包命令(WeApp)
npm run build:weapp
这个命令会将代码编译成微信小程序格式,输出到 dist/weapp/
目录下。
你也可以在开发环境下运行:
npm run dev:weapp
它会开启监听,方便调试。
2. H5 打包命令
npm run build:h5
输出目录为 dist/h5/
,你可以将这个目录部署到任意 Web 服务器(如 Nginx、GitHub Pages 等)。
3. 其他平台构建命令
平台 | 命令 |
---|---|
支付宝小程序 | npm run build:alipay |
百度小程序 | npm run build:swan |
字节小程序 | npm run build:tt |
QQ 小程序 | npm run build:qq |
React Native | npm run build:rn |
自定义打包配置
你可以在 config/index.ts
中配置不同平台的构建参数,例如:
const config = {
projectName: 'myApp',
outputRoot: `dist/${process.env.TARO_ENV}`,
weapp: {
postcss: {
autoprefixer: { enable: true },
pxtransform: { enable: true }
}
},
h5: {
publicPath: '/',
staticDirectory: 'static'
}
}
通过 process.env.TARO_ENV
,Taro 会自动将编译结果输出到指定平台目录。