一瞒津、 項目結(jié)構(gòu)
├── app.js
├── app.json
├── app.wxss
├── assets (項目資源文件存放文件夾)
│ └── images(項目本地圖片存放文件夾)
│
├── components (自定義組件存放文件夾)
│ ├── custom-button
│ ├── ...
│ └── custom-navigation
│
├── pages (頁面文件存放文件夾)
│ ├── home
│ ├── ...
│ └── mine
│
├── requests (項目所有網(wǎng)絡(luò)請求存放文件夾)
│ └── index.js
│
├── statics (項目通用文件夾谈飒,方便直接在多個新的項目中使用)
│ ├── config (項目配置)
│ │ └── index.js
│ │
│ ├── crypto (項目AES加解密和MD5加密)
│ │ ├── AES.js (外部使用的加解密)
│ │ └── crypto.js
│ │
│ ├── fonts (項目引入的第三方字體)
│ │ └── font.wxss
│ │
│ ├── judgement (封裝常用判斷,手機號、姓名卿捎、身份證...)
│ │ └── index.js
│ │
│ ├── request (封裝常用判斷,手機號径密、姓名午阵、身份證...)
│ │ ├── index.js (主要網(wǎng)絡(luò)請求封裝)
│ │ ├── params.js(網(wǎng)絡(luò)請求參數(shù)封裝)
│ │ └── wxLogin.js (微信登錄相關(guān))
│ │
│ ├── router(常用的頁面跳轉(zhuǎn))
│ │ └── index.js
│ │
│ ├── storage (本地數(shù)據(jù)緩存的key和相關(guān)的方法)
│ │ └── index.js
│ │
│ ├── toast(網(wǎng)絡(luò)請求提示和彈窗提示文字等方法)
│ │ └── index.js
│ │
│ ├── utils(常用的工具類方法)
│ │ └── util.js
│ │
│ └── wxs (小程序腳本語言文件,這里主要處理了價格)
│ └── price.wxs
│
└── utils (系統(tǒng)默認(rèn)創(chuàng)建的當(dāng)前項目工具類文件)
└── util.js
二享扔、 代碼規(guī)范(重點)
自定義組件(components)
文件夾名字統(tǒng)一用小寫字母;
文件夾多個單詞之間用“-”來連接底桂,如:custom-navigation; 文件名稱與文件夾名稱一致,如:custom-navigation.js; 多個地方使用可以考慮直接配置到app.json中的“usingComponents”里面惧眠。
頁面文件(pages)
文件夾第一個單詞使用小寫籽懦,如:home;
多個單詞使用駝峰命名,如:orderDetail;
文件名稱統(tǒng)一使用index.js氛魁。
工具類文件和其他(statics或utils)
文件夾第一個單詞使用 小寫暮顺,如:home;
多個單詞使用駝峰命名,`如:orderDetail;
文件名稱統(tǒng)一使用index.js秀存。
CSS規(guī)范
css布局統(tǒng)一使用flex布局
尺寸單位統(tǒng)一使用rpx
命名采用“-”(雙擊不可復(fù)制)或者“_”(雙擊直接復(fù)制)來連接都可以捶码。如: header-wraper, header_wraper.
JS規(guī)范
js 的命名采用駝峰命名法;
js語句無需寫 ;來結(jié)尾或链;
js中一致使用 單引號''或者 反引號``,不是使用 雙引號""惫恼;
在wxml、css澳盐、json 中均使用雙引號 ""祈纯;
點擊事件名稱on+事件名稱或者業(yè)務(wù)名稱,能有知名思議的效果洞就。如:onSelectTitle()
函數(shù)
在pages的頁面文件中盆繁,系統(tǒng)方法仍使用默認(rèn)的方式,如: onLoad: function () {}, 自定義的方法統(tǒng)一使用如:函數(shù)名() {}
其他js文件使用const 函數(shù)名 = () => {} (不建議使用到pages的頁面文件中避免this指向問題), 或者 函數(shù)名(){}
異步回調(diào)函數(shù) 統(tǒng)一使用 Promise
文件的導(dǎo)入和導(dǎo)出
1.文件導(dǎo)入:
1)使用微信引入模塊的方式旬蟋,即 require(path) 相當(dāng)于整個模塊導(dǎo)入;
2)ES6方式導(dǎo)入油昂,import xx from path 按需導(dǎo)入。
文件導(dǎo)出
1)使用module.exports = {}方式模塊導(dǎo)出;
2)使用 export單個導(dǎo)出 或者 export default {}導(dǎo)出多個