目錄結構介紹

2018-11-15 16:47 更新
tmt-workflow/
│
├── _tasks                            //Gulp 任務定義
├── package.json
├── .tmtworkflowrc                    //工作流配置文件
└── project                           //項目目錄
    ├── gulpfile.js                   //任務配置,每個項目必需
    ├── dev                           //開發(fā)目錄,由 build_dev 任務自動生成
    │   ├── css
    │   ├── html
    │   ├── img
    │   └── slice
    ├── dist                          //生產目錄(存放最終可發(fā)布上線的文件),由 build_dist 任務自動生成
    │   ├── css
    │   ├── html
    │   ├── img
    │   └── sprite                    //雪碧圖合并自 src/slice,文件名與 css 文件名一致
    │       ├── style-index.png
    │       └── style-index@2x.png
    └── src                           //源文件目錄,此目錄會被監(jiān)聽變化并重新編譯->dev
        ├── css                       //樣式表目錄,使用 Less,只有 style-*.less 的文件名會被編譯
        ├── html
        ├── img
        └── slice                     //圖片素材,雪碧圖合并,同名的 @2x 圖片會被識別并進行合并
            ├── icon-dribbble.png
            ├── icon-dribbble@2x.png

如上,在我們日常開發(fā)當中,把所有項目都統(tǒng)一存放在一個目錄,如可以叫 tmt-workflow, 目錄下固定的有 _tasks 目錄、package.json 和 .tmtworkflowrc,這幾個是工作流必需的。

  • _tasks: 存放 Gulp 代碼的目錄
  • package.json: 模塊依賴文件,用于 npm install 時用
  • .tmtworkflowrc: 工作流全局配置文件,如果想有項目想特殊化,可在項目里面再建一個同名文件覆蓋,更詳細查看 ⒊ 配置文件

接著就是各個項目(project)了,一個標準的項目結構如下:

── project                              //項目目錄
    ├── gulpfile.js                     //任務配置,每個項目必需
    └── src                             //源文件目錄,此目錄會被監(jiān)聽變化并重新編譯->dev
        ├── css                         //樣式表目錄,使用 Less,只有 style-*.less 的文件名會被編譯
        ├── html
        ├── img
        └── slice                       //圖片素材,雪碧圖合并,同名的 @2x 圖片會被識別并進行合并
            ├── icon-dribbble.png
            ├── icon-dribbble@2x.png

注意:標準的項目結構只有如上所示,build_dev 和 build_dist 為程序自動生成。


以上內容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號