慕课网-微信小程序入门与实战-常用组件API开发技巧项目实战-第3章从一个简单的"欢迎"页面开始小程序之旅-应用程序级别文件

应用程序级别文件

1.app.js、app.json、app.wxss 这三个文件是应用程序的文件，与 pages下的页面目录下的文件进行对比，应用程序页面是不包含wxml文件的，应用程序的文件作用与pages目录下的文件作用一样的，应用程序是唯一，不可能有多个。

2.就近原则，页面的文件如果没有设置的代码，如果应用级别的页面有，则会读取应用级别的页面，否则会读取对应目录下文件设置的代码，如下例

3.修改 app.wxss 文件，让小程序里的text的颜色都是蓝色，由于app.wxss是应用程序的文件，它所设置的是全局的

/*原代码*/
/**app.wxss**/
.container {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 200rpx 0;
  box-sizing: border-box;
}


/*修改后*/
/**app.wxss**/
.container {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 200rpx 0;
  box-sizing: border-box;
}

text{
    color:blue;
}　

index页面文字原来颜色是黑色的

修改了文件app.wxss之后，index页面文字颜色变成了蓝色 

4.修改 pages/index/index.wxss 文件，效果又是如何呢？

/*原代码*/
/**index.wxss**/
.userinfo {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.userinfo-avatar {
  width: 128rpx;
  height: 128rpx;
  margin: 20rpx;
  border-radius: 50%;
}

.userinfo-nickname {
  color: #aaa;
}

.usermotto {
  margin-top: 200px;
}


/*修改后*/
/**index.wxss**/
.userinfo {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.userinfo-avatar {
  width: 128rpx;
  height: 128rpx;
  margin: 20rpx;
  border-radius: 50%;
}

.userinfo-nickname {
  color: #aaa;
}

.usermotto {
  margin-top: 200px;
}

text{
  color:red;    
}

5.修改后，index文字变成红色

6.在项目下还有一个文件 project.config.json

只是自动生成的文件，一般不需要我们i需改的，叫项目配置文件

7.在项目下还有一个目录 util，下面有一个util.js

是一个帮助类的文件

8.小程序有目录自由性，不要墨守成规，小程序给了什么目录结构就按小程序的目录结构来写，由于现在小程序越来越复杂，我们需要根据我们项目的情况新增目录或文件