“认识小程序项目的基本组成结构”的版本间的差异

来自姬鸿昌的知识库
跳到导航 跳到搜索
 
（未显示同一用户的8个中间版本）
第16行： 第16行：
  
 
⑥ project.config.json 项目的配置文件
 
⑥ project.config.json 项目的配置文件
 +
 +
⑦ sitemap.json 用来配置小程序及其页面是否允许被微信索引
 +
 +
 +
 +
==== 小程序页面的组成部分 ====
 +
小程序官方建议把所有小程序的页面，都存放在 pages 目录中，以单独的文件夹存在
 +
 +
其中，每个页面由 4个基本文件组成，它们分别是：
 +
 +
① .js 文件（页面的脚本文件，存放页面的数据、事件处理函数等）
 +
 +
② .json 文件（当前页面的配置文件，配置窗口的外观、表现等）
 +
 +
③ .wxml 文件（页面的模板结构文件）
 +
 +
④ .wxss 文件（当前页面的样式表文件）
 +
 +
 +
=== JSON 配置文件 ===
 +
 +
==== JSON 配置文件的作用 ====
 +
JSON 是一种数据格式，在实际开发中，JSON 总是以配置文件的形式出现。
 +
 +
小程序项目中也不例外：通过不同的 .json 配置文件，可以对小程序项目进行不同级别的配置。
 +
 +
小程序项目中有 4 种 json 配置文件，分别是：
 +
 +
① 项目根目录中的 app.json 配置文件
 +
 +
② 项目根目录中的 project.config.json 配置文件
 +
 +
③ 项目根目录中的 sitemap.json 配置文件
 +
 +
④ 每个页面文件夹中的 .json 配置文件
 +
 +
 +
==== app.json 文件 ====
 +
app.json 是当前小程序的全局配置，包括了小程序的所有页面路径、窗口外观、界面表现、底部 tab 等。<syntaxhighlight lang="json">
 +
{
 +
  "pages":[
 +
    "pages/index/index",
 +
    "pages/logs/logs"
 +
  ],
 +
  "window":{
 +
    "backgroundTextStyle":"light",
 +
    "navigationBarBackgroundColor": "#fff",
 +
    "navigationBarTitleText": "Weixin",
 +
    "navigationBarTextStyle":"black"
 +
  },
 +
  "style": "v2",
 +
  "sitemapLocation": "sitemap.json"
 +
}
 +
</syntaxhighlight>① pages：用来记录当前小程序所有页面的路径
 +
 +
② windows：全局定义小程序所有页面的背景色、文字颜色等
 +
 +
③ style：全局定义小程序组件所使用的样式版本
 +
 +
④ sitemapLocation：用来指明 sitemap.json 的位置

2023年5月29日 (一) 08:48的最新版本

https://www.bilibili.com/video/BV1834y1676P/?p=5

项目结构

了解项目的基本组成结构

① pages 用来存放所有小程序的页面

② utils 用来存放工具性质的模块（例如：格式化时间的自定义模块）

③ app.js 小程序项目的入口文件

④ app.json 小程序项目的全局配置文件

⑤ app.wxss 小程序项目的全局样式文件

⑥ project.config.json 项目的配置文件

⑦ sitemap.json 用来配置小程序及其页面是否允许被微信索引


小程序页面的组成部分

小程序官方建议把所有小程序的页面，都存放在 pages 目录中，以单独的文件夹存在

其中，每个页面由 4个基本文件组成，它们分别是：

① .js 文件（页面的脚本文件，存放页面的数据、事件处理函数等）

② .json 文件（当前页面的配置文件，配置窗口的外观、表现等）

③ .wxml 文件（页面的模板结构文件）

④ .wxss 文件（当前页面的样式表文件）


JSON 配置文件

JSON 配置文件的作用

JSON 是一种数据格式，在实际开发中，JSON 总是以配置文件的形式出现。

小程序项目中也不例外：通过不同的 .json 配置文件，可以对小程序项目进行不同级别的配置。

小程序项目中有 4 种 json 配置文件，分别是：

① 项目根目录中的 app.json 配置文件

② 项目根目录中的 project.config.json 配置文件

③ 项目根目录中的 sitemap.json 配置文件

④ 每个页面文件夹中的 .json 配置文件


app.json 文件

app.json 是当前小程序的全局配置，包括了小程序的所有页面路径、窗口外观、界面表现、底部 tab 等。

{
  "pages":[
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "Weixin",
    "navigationBarTextStyle":"black"
  },
  "style": "v2",
  "sitemapLocation": "sitemap.json"
}

① pages：用来记录当前小程序所有页面的路径

② windows：全局定义小程序所有页面的背景色、文字颜色等

③ style：全局定义小程序组件所使用的样式版本

④ sitemapLocation：用来指明 sitemap.json 的位置

取自“https://www.jihongchang.top/index.php?title=认识小程序项目的基本组成结构&oldid=6900”