小程序目录结构

更新时间 2024-07-24 02:58:49
收藏
我的收藏
抖音小程序以 MVVM(Model–view–viewmodel) 的方式进行开发,通过状态变更来更新视图。​

目录结构​

小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。​
text
复制
.
├── app.js # 小程序逻辑
├── app.json # 小程序公共配置
├── app.ttss # 小程序公共样式表
├── project.config.json # 项目配置
└── pages # 页面
└── pageA # 页面 A
├── pageA.ttss # 页面 A 样式表
├── pageA.js # 页面 A 逻辑
├── pageA.json # 页面 A 配置
└── pageA.ttml # 页面 A 结构

根目录​

一个小程序主体部分由 1 个项目配置文件和 3 个全局配置文件组成,必须放在项目的根目录下。​
文件
必需
作用
是​
小程序逻辑​
是​
小程序公共配置​
否​
小程序公共样式表​
是​
项目配置​

页面​

上述目录结构中的 pages/ 可以根据项目结构灵活调整,仅需要保证其与 app.json 文件内 pages 字段的配置对应。​
一个小程序页面由 4 个文件组成:​
文件类型
必需
作用
.js
是​
页面逻辑​
是​
页面结构​
否​
页面配置​
否​
页面样式表​
注意
为了方便开发者减少配置项,描述页面的 4 个文件必须具有相同的路径与文件名。

允许上传的文件​

在项目目录中,以下文件会经过编译,因此上传之后无法直接访问.js.json.ttml.ttss(其中 .ttml.ttss 文件仅针对在 app.json 中配置了的页面)。​
除此之外,只有后缀名在白名单内的文件可以被上传,不在白名单列表内的文件在开发工具能被访问,但无法被上传。具体白名单列表如下:​
注意:后缀名在白名单内的文件和 .js 文件无论是否被引用都会被打包,.json、.ttml 和 .ttss 文件只有被引用时才会被打包。
    png
    jpg
    jpeg
    gif
    svg
    cer
    mp3
    aac
    m4a
    mp4
    ttf
    otf
    eot
    woff