Taro+dva构建小程序开发环境

每次，百度都要再花半天时间记录

Taro启动良好项目

npm安装--保存@tarojs/async等待

cnpm安装--保存redux@tarojs/redux@tarojs/redux-h5 redux-thunk redux记录器

npm i dva核心dva加载--保存

在utils下创建dva配置文件dva.js

从“dva-core”导入｛create｝；

从“redux logger”导入｛createLogger｝；

从“dva加载”导入createLoading；

letapp；

出租存储；

出租调度；

函数createApp（opt）{

//重做日志

//选择。onAction=[创建日志（）]；

app=创建（opt）；

app.use（createLoading（｛｝））；

如果（！global.registered）opt.models。forEach（模型=>app.model（模型））；

全球的注册=真；

app.start（）；

商店=app百货商店

app。getStore=（）=>存储；

dispatch=store.dispatch；

app。dispatch=调度；

返回app；

}

导出默认值{

创建app，

获取调度（）{

返回app.dispatch；

}

}

app。js引入dva

导入“@tarojs/async await”

从“@tarojs/Taro”导入Taro，｛组件｝

从“./pages/Index”导入索引

从“./pages/Test”导入测试

从'./utils/dva'导入dva；

从“./models”导入模型；

从“@tarojs/redux”导入｛Provider｝；

导入“./app.scss”

const dvaApp=dva.createApp({

initialState:｛｝，

模型：模型，

});

常量存储=dvaApp.getStore（）；

//如果需要在h5环境中启用React Devtools

//取消对以下内容的注释：

//如果（process.env.NODE_env！==“生产”&&process.ev.TARO_env==“h5”）{

//require（“服务开发工具”）

// }

类app扩展组件{

配置={

页码：[

'页面/测试/索引'，

'页面/索引/索引'

],

窗口：{

backgroundTextStyle:'浅'，

navigationBarBackgroundColor:“#fff”，

navigationBarTitleText:'微信'，

navigationBarTextStyle:“黑色”

}

}

组件DidMount（）｛｝

componentDidShow（）｛｝

componentDidHide（）｛｝

componentDidCatchError（）｛｝

//App类中的render（）函数没有实际效果

//请勿修改此功能

渲染（）{

返回(

<提供程序存储=｛存储｝>

<测试/>

)

}

}

芋头。渲染（，document.getElementById（'App'））

模型.js

从“../pages/index/model”导入索引；

从“../pages/test/model”导入测试；

导出默认值[索引，测试]；

使用模板命令创建页面。手动创建也是如此

/**

*页面模板快速生成脚本并执行命令npm run tep`filename`

*/

const fs=要求（'fs'）；

const dirName=进程.argv[2]；

如果（！dirName）{

安慰log（'文件夹名称不能为空！'）；

安慰日志（“示例：npm运行步骤测试”）；

process.exit（0）；

}

//页面模板

const indexTep=`import Taro，｛Component｝from'@tarojs/Taro'；

从“@tarojs/components”导入｛视图｝；

从“@tarojs/redux”导入｛connect｝；

导入“./index.scss”；

@连接（（｛$｛dirName｝｝）=>({

…$｛dirName｝，

}))

导出默认类${titleCase（dirName）}扩展组件{

配置={

navigationBarTitleText:“$｛dirName｝”，

};

componentDidMount=（）=>{

};

渲染器（）{

返回(

$｛目录名｝

)

}

}

`;

//Scss文件模板

常量scssTep=`

.$｛dirName｝-页面{

}

`;

//模型文件模板

const-modelTep=`import*作为${dirName}Api从