小程序开发 之 目录及文件命名规范

1,660 阅读1分钟

自定义组件

根目录下添加components文件夹,存放所有自定义组件。

每一个自定义组件单独用一个文件夹存放,命名方式使用 串式命名法(kebab-case)(各个单词之间通过中横线“-”连接,全小写

不推荐

components
    FixedButton
         FixedButton.js
         FixedButton.json
         FixedButton.wxml
         FixedButton.wxss

推荐

components
    fixed-button
         fixed-button.js
         fixed-button.json
         fixed-button.wxml
         fixed-button.wxss

不推荐

components
    waterfall-layout
         waterfall-item.js
         waterfall-item.json
         waterfall-item.wxml
         waterfall-item.wxss
         waterfall-layout.js
         waterfall-layout.json
         waterfall-layout.wxml
         waterfall-layout.wxss

推荐

components
    waterfall-layout
         waterfall-item
             waterfall-item.js
             waterfall-item.json
             waterfall-item.wxml
             waterfall-item.wxss
         waterfall-layout.js
         waterfall-layout.json
         waterfall-layout.wxml
         waterfall-layout.wxss

images 图片文件

根目录下添加images文件夹,存放所有项目使用的图片。 自定义组件自身相关的图片,可以在组件的目录里面添加images文件夹,存放图片。

文件名称使用蛇形命名法(snake_case),全小写

不推荐

images
    Qrcode.png
    notOpen.png

推荐

images
    qr_code.png
    not_open.png

pages 页面

根目录下添加pages文件夹,存放项目页面。

每一个页面单独使用一个文件夹存放,文件夹名称全小写,尽量一个单词以内。按业务功能区分。

不推荐

pages
    productDetail
        productDetail.wxml
        ...
    productList
        productList.wxml
        ...
    commitOrder
        commitOrder.wxml
        ...

推荐

pages
    product
        detail
            detail.wxml
            ...
        list
            list.wxml
            ...
    order
        commit
            commit.wxml
            ...

js文件

业务功能等js文件命名,命名方式使用 串式命名法(kebab-case)(各个单词之间通过中横线“-”连接,全小写),对应的目录按功能划分,全小写,尽量在一个单词以内。

不推荐

utils
    jwtDecode.js

推荐

utils
    jwt-decode.js