微信小程序——項(xiàng)目基本組成結(jié)構(gòu)

一奕塑、小程序項(xiàng)目的基本組成

1.pages 用來存放所有小程序的頁面

2.utils 用來存放工具模塊憔购,如時間格式化工具自定義模塊等

3.app.js/app.ts 小程序項(xiàng)目的入口

4.app.json 小程序項(xiàng)目的全局配置文件

5.app.wxss 小程序項(xiàng)目的全局樣式文件

6.project.config.json 項(xiàng)目的配置文件

7.sitemap.json 用來配置小程序及其頁面是否允許被微信索引

項(xiàng)目結(jié)構(gòu)圖

二岗仑、小程序頁面的組成部分

官方建議把小程序所有的頁面都存放在pages目錄下,以單獨(dú)的文件夾存在

1. js/ts 頁面的腳本文件画株,存放頁面的數(shù)據(jù)谦铃、事件處理函數(shù)等

2. json 當(dāng)前頁面的配置文件,可以配置窗口的外觀赞厕、表現(xiàn)等

3. wxml 頁面的模板結(jié)構(gòu)文件

4. wxss文件 當(dāng)前頁面的樣式表文件

頁面組成圖

三艳狐、json配置文件的作用

json是一種數(shù)據(jù)格式,實(shí)際開發(fā)中經(jīng)常以配置文件的形式出現(xiàn)皿桑。小程序項(xiàng)目中通過不同的json配置文件毫目,可以對小程序項(xiàng)目進(jìn)行不同級別的配置。

小程序項(xiàng)目中有4種json配置文件唁毒,分別是:

1.項(xiàng)目根目錄下的app.json配置文件

2.項(xiàng)目根目錄下的project.config.json配置文件

3.項(xiàng)目根目錄下的sitemap.json配置文件

4.每個頁面文件夾中的 .json配置文件

四蒜茴、app.json文件

app.json是當(dāng)前小程序的全局配置,包括了小程序的所有頁面路徑浆西、窗口外觀粉私、頁面表現(xiàn)、底部tab等。新建的小程序默認(rèn)的app.json文件如下:

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

其中包含了4個配置項(xiàng)

  1. pages 用來記錄當(dāng)前小程序所有頁面的路徑

  2. window 全局定義小程序所有的頁面背景色、字體顏色等

  3. style 全局定義小程序組件所使用的樣式版本

  4. sitemapLocation 用來指明 sitemap.json 的位置

五漂佩、project.config.json文件

project.config.json是項(xiàng)目配置文件,包括我們對小程序開發(fā)工具所做的配置窖杀。如:

  1. setting中保存了編譯相關(guān)的配置

  2. projectname中保存項(xiàng)目名稱

  3. appid保存的是小程序的賬號ID

六、sitemap.json文件

微信開放了小程序內(nèi)搜索裙士,sitemap.json文件用來配置小程序頁面是否允許微信索引入客。

當(dāng)開發(fā)者允許微信索引時,微信會通過爬蟲的形式腿椎,為小程序當(dāng)前頁面建立索引桌硫,當(dāng)用戶的搜索關(guān)鍵字和當(dāng)前頁面的索引匹配成功的時候,小程序的頁面將可能顯示在搜索結(jié)果中

七啃炸、頁面中的 .json文件

小程序中的每個頁面铆隘,可以使用 .json文件來對本頁面的窗口外觀進(jìn)行配置,當(dāng)頁面的配置和全局的配置沖突時南用,頁面的配置項(xiàng)會覆蓋app.json的window中配置項(xiàng)膀钠。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末掏湾,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子肿嘲,更是在濱河造成了極大的恐慌融击,老刑警劉巖,帶你破解...
    沈念sama閱讀 221,406評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件雳窟,死亡現(xiàn)場離奇詭異砚嘴,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)涩拙,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,395評論 3 398
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來耸采,“玉大人兴泥,你說我怎么就攤上這事∠河睿” “怎么了搓彻?”我有些...
    開封第一講書人閱讀 167,815評論 0 360
  • 文/不壞的土叔 我叫張陵,是天一觀的道長嘱朽。 經(jīng)常有香客問我旭贬,道長,這世上最難降的妖魔是什么搪泳? 我笑而不...
    開封第一講書人閱讀 59,537評論 1 296
  • 正文 為了忘掉前任稀轨,我火速辦了婚禮,結(jié)果婚禮上岸军,老公的妹妹穿的比我還像新娘奋刽。我一直安慰自己,他們只是感情好艰赞,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,536評論 6 397
  • 文/花漫 我一把揭開白布佣谐。 她就那樣靜靜地躺著,像睡著了一般方妖。 火紅的嫁衣襯著肌膚如雪狭魂。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,184評論 1 308
  • 那天党觅,我揣著相機(jī)與錄音雌澄,去河邊找鬼。 笑死仔役,一個胖子當(dāng)著我的面吹牛掷伙,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播又兵,決...
    沈念sama閱讀 40,776評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼任柜,長吁一口氣:“原來是場噩夢啊……” “哼卒废!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起宙地,我...
    開封第一講書人閱讀 39,668評論 0 276
  • 序言:老撾萬榮一對情侶失蹤摔认,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后宅粥,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體参袱,經(jīng)...
    沈念sama閱讀 46,212評論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,299評論 3 340
  • 正文 我和宋清朗相戀三年秽梅,在試婚紗的時候發(fā)現(xiàn)自己被綠了抹蚀。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,438評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡企垦,死狀恐怖环壤,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情钞诡,我是刑警寧澤郑现,帶...
    沈念sama閱讀 36,128評論 5 349
  • 正文 年R本政府宣布,位于F島的核電站荧降,受9級特大地震影響接箫,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜朵诫,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,807評論 3 333
  • 文/蒙蒙 一辛友、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧拗窃,春花似錦瞎领、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,279評論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至宾毒,卻和暖如春驼修,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背诈铛。 一陣腳步聲響...
    開封第一講書人閱讀 33,395評論 1 272
  • 我被黑心中介騙來泰國打工乙各, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人幢竹。 一個月前我還...
    沈念sama閱讀 48,827評論 3 376
  • 正文 我出身青樓耳峦,卻偏偏與公主長得像,于是被迫代替她去往敵國和親焕毫。 傳聞我的和親對象是個殘疾皇子蹲坷,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,446評論 2 359

推薦閱讀更多精彩內(nèi)容