小程序项目结构介绍
3.1小程序项目的要素
再来说说项目结构。整个项目由几个部分组成:
App.js主要是js方法声明和调用全局公开的文件,是小程序的脚本代码。在这个文件中,我们可以监控和处理applet的生命周期函数,并声明全局变量。正是js的功能把程序从骨架变成了血肉。Js做一些动态的事情,比如请求数据,控制元素上下移动,判断用户输入的密码是否安全等等。
App.json是整个小程序的全局配置。的所有页面都必须在这里注册,否则不允许访问。在这个文件中,我们可以配置小程序由哪些页面组成,配置小程序的窗口背景颜色,配置导航栏样式,以及配置默认标题。
App.wxss是小程序的全局css文件,也是整个小程序的通用样式表。我们可以直接在页面组件的class属性上使用app.wxss中声明的样式规则。
Pages对应所有页面,每个页面都可以添加上述三种类型的文件。还有wxml类型文件。Wxml是一种类似xml的结构化文本,它描述了applet页面的元素。比如一篇文章需要标题、作者、时间、正文,但并不在乎这些元素是如何排列的。
Utils是我们的公共js存放的地方,因为微信小程序要求每个js文件中的方法不能直接引用或者调用,必须通过module.exports方法导出,这样就把。pages下的js文件可以调用我们在这里编写的js方法。
附件存储图片等资源文件(单个文件小于1M)。
3.2如何编写js文件?
那么上面最复杂的语法规则就是js文件。让我们关注js文件。
3.2.1 app.js文件
App.js是整个小程序的入口文件,也是控制整个小程序生命周期的文件。App.js使用App()注册整个程序,同时App()还实现了小程序生命周期的监控功能:
当用户点击左上角关闭,或按下设备Home键离开微信时,小程序不直接销毁,而是进入后台;当你再次进入微信或再次打开小程序时,你将从后台进入前台。只有小程序进入后台一定时间,或者系统资源过高,才会真正被破坏。简单来说,前台就是你在操作一个小程序的时候;后台是当你离开小程序打开其他手机服务时,那么小程序就隐藏在后台了。
3.2.2索引. js文件
小程序中的每个页面都可以放在一个文件夹中,该文件夹通常包括四个文件:js,JSON,wxml和。wxss。官方建议这四个文件的名字要和文件夹的名字一致,这样便于框架的自动搜索。
每一页都需要注册。index.js用page()函数注册一个页面。它接受一个对象参数,用于指定页面的初始数据、生命周期函数和事件处理函数。第()页内部参数描述:
如何查看软件开发云上的小程序代码?
小程序的代码写好后,我们需要检查js文件的静态代码,检查语法和逻辑是否有错误。下面是如何在软件开发云上检查小程序的代码。
4.1创建代码托管仓库
在软件开发云的“Configuration Management”服务中创建一个代码仓库,使用git工具将小程序代码上传到云端进行安全可靠的版本管理。
4.2创建代码检查任务
在软件开发云的“代码检查”服务中创建一个代码检查任务,选择“JS”检查规则。新建成功后点击“开始检查”。
件开发云上检查小程序代码(图4)" />4.3 查看代码检查结果
检查完毕,可以看到,检查结果包括了详尽的代码出错定位、问题描述、修改建议。
4.4 定位并修改代码行
回到微信开发者工具编辑区查看源码,定位出问题的代码行完成修改。
结语
静态代码检查是开发工作中不可缺少的一环,毕竟对于程序化的工作人的眼睛是不可靠的,更何况是自己的眼睛看自己的代码。即使最后的运行结果通过,但可能存在一些未定义的变量、定义了但最后没用过的变量、分号有没有加以及其他的问题。
华为软件开发云提供精准、全面、高效的的代码检查服务,为微信小程序开发保驾护航。