微信小程序之--认识小程序目录

初识小程序云开发目录

---------ok，书接上文，我们建立了一个自己的小程序了。看着这个界面，有同学会懵一下，这都是什么啊。（这里提一句，你们刚刚建立的一个项目，大概率会有一个报错，这是正常的，因为我们是云开发的环境，但是我们还没有开通我们的云环境，开通方式在最上方有个按钮，写着云开发三个字 在那里就可以开通了，因为我进来就有个云环境了，所以我也不好给你们演示，你们辛苦点百度 一下哈，很容易的）
---------最左面是工作区，这里存放我们项目的文件夹和文件，方便我们快速寻找文件然后编辑（市面上大多编辑器都长这样），最右面是我们小程序的预览界面（你可以把它理解为手机模拟器，可以模拟小程序在手机上运行时的效果）下面是调试器，和vscode的调试器很像，不仅如此，这个东西和浏览器的控制台长得都一毛一样。
重点来了，我们来讲一下我们我们的文件目录，看看都是些什么。
最外面一共有四项内容
1、cloudFunction（云函数）：这里的文件都是一些云函数（这不是废话嘛），我们打开来看看，

有四个云函数，不过都是编辑器个你创建的例子，挺有用的例子，但是我没什么耐心慢慢看完它，到现在我都没看过这些东西，通常我直接把这四个文件夹删除（这是可以的，不影响你任何开发，它不过是官方给你的例子而已，不用慌，删掉不会有任何问题，当然，如果你删掉了，后面还要再删掉点东西，我一会就回说到了）
来，让我们看看云函数长什么样子

话说，也不是特别好看哈。这里其他两项都是些配置文件，你们还用不到这些，你们最主要用到的是index.js这个文件。这里就是我们写后端代码的地方。
对了，我给你们解释一下云函数是干嘛的。云函数就是我们编写一些代码然后上传至我们云服务器上（当然，这是小程序给我们提供的免费服务器），然后在我们小程序前段就可以调用这个云函数（也可以说是接口，和我们理解的后端api没有任何差别）做一些我们期望的服务交互。关于云，目前我还不想讲很多，我会从前端开始，从组件，讲到api，最后在谈这个云服务。
不过既然讲到这了，我们来看看index.js内部长什么样子的吧。

当我们新建一个云函数，它就长这个样子，第四行以及之前的代码是引入了个api的包然后云端初始化（这里真的暂时不用你们理解）后面写着云函数入口函数那个，就像人家写的那样，程序会从哪里执行（浅显的理解，因为在这之前的代码也执行，我更愿意理解为，这个东西是我们在模块化开发的时候导出接口的地方，和module.exports或者expor.defult一样）。好啦，云这里我们就先了解这么多。
2、miniprogram(小程序)：这里就是我们项目的前端主要的存放文件夹了

第一个文件夹：components----组件:是我们写自定义组件的地方。小程序就是一个组件化开发的东西，我们在开发的时候，前期最好就养成组件化、模块化开发的习惯。用的久了你就会发现，太舒服了。舒服的地方在于，思维逻辑一目了然，如果不封装，在前期练习时候没有问题，但是工作之后，一个函数下来两百多行，直接写下来，你会头疼的（两百行已经是小数了）。总之，这里放一些自定义组件，我们前期以原生组件（就是小程序给我们封装好的组件）为主。
第二个目录是pages----页:这个东西就很关键了，这是我们的小程序所有页面的存放根目录，神奇的事是当我们在这里新建一个页面时，在系统他会给你直接做相应的路由配置（比vue和react香一些）。配置的地方就是app.json这个文件啦。
先不管app.json,在paegs中，我建议你新建页面的时候，先建立一个页面存放的文件夹。在文件夹中建立一个新的page级页面（这么说下来你们脑海里面应该也没画面，后面我会带你们实操一波）。
然后是app.js,是全局的js文件。你可以把它当作个预处理的文件，暂时不是我们需要学习的东西。app.json是全局的配置文件，会陪我们从学习的开始，到学习的最后，蛮重要的，用好了，可以省下我们很多事的。
app.wxss是全局样式，你可以理解为，这是我们在学习html+css时候的reset.css(样式重制表)。
ps：在小程序中，html文件，变为了wxml文件，css文件，变为了wxss，js还没变，不过还有个wxs的东西。有空我带你们了解下。
忽略sitemap.json
最外围还有project.config.json:这个大哥更是全局配置文件，比app.json管的还宽，不过正因为如此，它比较宏观，真正开发时对他的设置并不是特别多，但是请认真对待它的每一条设置，因为有可能会改变你项目的实现方式。
最后的README.MD,这是一个项目说明文件，说白了，里面的东西和项目没有任何关系，不过，你可以在里面随便写写一些内容，给自己一个提示也好，给别人一个说明也罢，看着不顺眼就删掉。
好啦，目录就介绍完成了，接下里在下一篇帖子中，我们来做个开发吧
对了差点忘了点事儿：对于整个项目的初始化（也就是删掉写没有用的文件及内容）
1、删掉云函数中所有的内容（couldFunction这个最外层的留着就好）
2、删掉pages里所有页面（同样保留pages文件夹）
3、删掉style文件夹（这个我昨晚就删掉了，忘记是不是在最外层了这个连style这个文件夹也删掉）
4、删掉images文件夹，与style同等对待
5、删掉app.json里面pages项中除了第一条的内容。 说不太明白，直接看图吧

这样就成了
6、在pages里面新建个index文件夹，在文件夹中新建一个index页（因为项目至少要保留一个页面，在5中保留的唯一一条就是为了这个新建的页面保留的路由配置）具体操作。。。算了贴出来吧
在pages上右键，新建文件夹，名字叫index

然后在index上右键，新建page，名字是index（然后就会给你生成个新的page页面，里面有四个文件）。 我就直接介绍了吧
第一个是index.js就是我们的逻辑成代码，说的通俗点就是，js代码写在这
第二个就是index.json,这是页面级别的配置文件，对于这个页面来说，优先级高于全局配置，类似于你在内联样式中的css会优先级高于内部或外联样式表。
第三个是index.wxml,记得我说过的吗？这个就是html文件的变种。不过有一些区别，后面聊
第四个就是index.wxss,和css及其相似，绝大部分代码都适用（是绝大部分，不是全部）
好啦就这样，下篇文章见。

上一篇；开发环境配置                                               下一篇：认识微信开放文档