[TOC] ## 快速创建新页面[​](https://docs.taro.zone/docs/cli#%E5%BF%AB%E9%80%9F%E5%88%9B%E5%BB%BA%E6%96%B0%E9%A1%B5%E9%9D%A2 "快速创建新页面的直接链接") 假设当前当前跟路径为`/project/root`。 执行下面命令创建主包页面： ``` taro create newPage --dir pages/mydir ``` 那么会在`/project/root/src/pages/mydir`目录下生成新的页面，并且在`app.config.js`中自动补齐`pages`字段。 执行下面命令创建分包页面： ``` taro create newPage --subpkg mysubpages ``` 那么会在`/project/root/src/mysubpages`目录下生成新的页面，并且在`app.config.js`中自动补齐`subPackages`字段。 ## 配置环境 开发模式 ``` taro build --type weapp --watch ``` 生成模式 ``` taro build --type weapp ``` 添加 `.env` ``` .env.development # 在 development 模式时被载入 .env.production # 在 production 模式时被载入 ``` 创建变量 ``` TARO_APP_API="https://api.tarojs.com" ``` 可在所有 taro 插件、 config/index.ts配置文件 以及 src 目录下面的项目文件中使用, 例如： ``` // src/service/request.ts const request = axios.create({ baseURL: process.env.TARO_APP_API }; export default request ``` ### 格式变量小程序 TARO_APP_ID TARO_APP_ID 是专门针对小程序的 appid 设计的，在构建输出 dist/project.config.json 文件前， 会将 dist/project.config.json 文件中的 appid 字段，修改为 TARO_APP_ID 的值 ## 设计稿及尺寸单位 - 在 Taro 中尺寸单位建议使用 px、 百分比 % - Taro 默认会对所有单位进行转换。在 Taro 中书写尺寸按照 1:1 的关系来进行书写，即从设计稿上量的长度 100px，那么尺寸书写就是 100px，当转成微信小程序的时候，尺寸将默认转换为 100rpx，当转成 H5 时将默认转换为以 rem 为单位的值 - Taro 默认以 750px 作为换算尺寸标准，如果设计稿不是以 750px 为标准，则需要在项目配置 config/index.js 中进行设置，例如设计稿尺寸是 640px，则需要修改项目配置 config/index.js 中的 designWidth 配置为 640 ``` const config = { projectName: 'myProject', date: '2018-4-18', designWidth: 640, .... } ``` ## 多端开发 ``` /** 源码（React JSX） */ <View> {process.env.TARO_ENV === 'weapp' && <ScrollViewWeapp />} {process.env.TARO_ENV === 'h5' && <ScrollViewH5 />} </View> /** 编译后（微信小程序）*/ <View> {true && <ScrollViewWeapp />} </View> /** 编译后（H5）*/ <View> {true && <ScrollViewH5 />} </View> ```