
如何设计微信小程序?
方法/步骤
1.构建系统由于微信小程序本身对工程化几乎没有任何的支持,所以动手搭建一份:wxapp-redux-starter。使用gulp进行编译构建,主要功能包括:✦ 集成了Redux,数据管理更方便✦ 开发过程中,使用xml取代wxml,对开发工具更友好✦ 开发过程中,使用less取代wxss,功能更强大✦ 引入es-promise,以便可以创建并使用Promise✦ 添加promisify工具函数,可以便捷的将官方Api转换成Pormise模式✦ 引入normalizr,可以将数据扁平化,更方便进行数据管理✦ 引入babel自动进行ES2015特性转换✦ 对wxml/wxss/js/img压缩,相对开发者工具提供的压缩,会减小一丢丢体积。小程序工程目录✦ dist目录:构建输出的文件存放到这个目录。✦ src目录:开发模式的文件,包括app、页面、组件、图片等静态资源、辅助函数库、Redux数据管理器、第三方工具库。✦ gulpfile.js:不用多说,gulp构建任务的入口文件。✦ package.json:不用多说,管理者构建任务的依赖。✦ thirdPlugins:由于小程序并不支持直接使用npm,我们可以自主拉取构建,然后拷贝到vendors里,有时候需要简单修改。构建系统会将src目录下的代码,编译处理后输出到dist目录,小程序开发工具只需要引入dist目录即可。引入Redux直接在 thirdPlugins目录 运行 yarn add redux / npm install redux,等redux安装好了之后,将 dist目录 的 redux.js/redux.min.js 拷贝到vendors目录中。需要进行简单的修改才能使用,将压缩版208行代码 (i) 改成 (i || {})即可。