我们之前文章中简单介绍了一下微信小程序的项目结构和配置,现在我们来详细介绍一下具体每个文件和文件夹的作用、使用方法、注意事项等!
我再自动生成的项目中加了一下新的文件夹,分别存放不同类型的文件,让项目看起来更清晰,更方便管理。
components:存放我们自己开发的自定义组件,属性Vue和Angular 5开发的小伙伴,也会发现我们会开发很多自定义的组件,微信小程序也是一样的,自定义组件会让我们的程序更简洁,维护性更高,后续文章中我将带着大家写一些自定义组件
images:存放项目使用到的图片,如果你项目中使用的图片较多,也可以在images文件夹下新增不同文件夹来区分处理
pages:存放项目中使用到的JSON,WXML,WXSS,JS文件,每个页面一个文件夹,文件夹下面会默认有这四个文件:
JSON文件是这个页面的配置,如允许该页面进行“上拉加载”等;
WXML文件是类似HTML的作用,当然它也有一些自己的一些特殊标签,如;
WXSS文件是一个样式文件,这个文件主要来写一些css样式,这些样式只会针对该文件夹下的WXML文件有作用;
JS文件是主要的业务逻辑类,包括这个页面所有的业务逻辑的实现
项目最外层的三个文件相信大家可能已经猜到了,app.js、app.json、app.wxss它们分别是全局的业务逻辑处理、全局配置、全局样式,这是一般框架都会存在的一部分,同时如果我们能好好利用全局配置文件,大大减少重复代码的编写,对项目本身来说是非常有利的,作为程序猿我们在开发的过程中也应该多想想文件应该怎么放,对我们是非常又帮助的,后续我会有一个系列的文章是设计模式专题系列,那时你就会更明白其中的好处了。project.config.json文件则是项目的全局的配置信息,如appId、微信版本、项目描述等