Learn a copy of Baidu's project directory structure specification

Introduction to the project directory structure specification The main design goal of the document is that the directory structure of the project development is consistent, making it easy to understand and easy to build and manage. Compiled Li Yu North, Erik, Huang, breeder, Zhanglili, Lei, Chen Wan, Jacky Lau China. This document is published by the front-end technical team of the business operations system. Requirements in this document, the keywords used in Chinese + brackets include the keywords in English: Must (must). Keywords ' must ', ' must not ', ' REQUIRED ', ' shall ', ' shall not ', ' should ', ' should not ', ' RECOMMENDED ', ' may ', and ' OPTIONAL ' are defined in R The fc2119. The specifications are stipulated in the following specification document: The project contains, but is not limited to, business projects and package projects. ${root} represents the root directory of the project. Resource classification resources are divided into two categories: source code resources: The source code written by the developer, including JS, HTML, CSS, template and so on. Content resources: Refers to the resources that you want to provide to visitors, including pictures, fonts, Flash, PDFs, and so on. The directory naming principle is concise. Words that have a habitual abbreviation must (must) be abbreviated with an easy-to-understand abbreviation. For example: source code directory using SRC, do not use source. Here are more examples: img: images. Do not allow (must not) to use image, images, IMGs, and so on. Js:javascript script. Do not allow (must not) to use script, scripts, and so on. CSS: Style sheet. Do not allow (must not) to use style, styles, and so on. Swf:flash. Do not allow (must not) to use flash and so on. SRC: Source file directory. Do not allow (must not) to use source and so on. DEP: Introduced third-party dependency package catalogs. Do not allow (must not) to use LIB, library, dependency and so on. Do not allow (must not) to use the plural form. such as: IMGs, Docs is not allowed. Directory ${root} directory structure under ${root}, the directory structure must (must) be divided by function, not allow (must not) to place a directory of resource type or business logic directly under ${root}. Commonly used catalogs are SRC, doc, DEP, Test, and so on. For more details, please refer to ${root}/src/test/doc/dep/... Business Project directory Structure Division of Business Items ${root} directory structure classification follows ${root}Directory Structure Division. Project code The Business Project can (should) start a code name for the project. The code name must (must) be a word, not too long. Example: Beidou project codenamed Triones, Columbus Project codenamed CLB, Baidu Kam SAC project codenamed JN. The project designator helps to differentiate between different projects, leaving an extended posterior for reuse between future projects. When developing a project, the following loader configuration is typically used to point the project designator to SRC. {baseUrl: ' ${docroot} ', paths: {' triones ': ' src '}} According to the business logic, the SRC directory structure Business Project's SRC directory, the vast majority of cases should (should) be divided according to business logic Directory structure. The sub-directories (such as the BIZ1 in the example) we call the business directory. SRC must (must) contain only the business directory and the common directory. The business public resource must (must) be named Common. The common directory is a directory of business public resources and is also considered a business directory. ${root}/src/common/biz1/subbiz1/subbiz2/biz2/Smaller business items (such as the delivery side), the SRC directory allows Business directory, the directory structure is divided directly according to the Business Directory Division principle. ${root}/Src/foo.js Business Directory Division principle JS resource does not allow (must not) to divide the directory by resource type, and must (must) divide the directory by business logic. JS resources should be placed directly under the business directory. That is, the JS directory is not allowed under the business directory. In addition to the JS resource source file resources, when the number of resources, for the convenience of management, allow (should) by resource type directory. That is, the CSS and TPL directories are allowed under the business directory. Content resources allow (should) to divide the directory by resource type. That is: IMG, SWF, and font directories are allowed under the business directory. In the business directory, if the file is too much to manage and needs to be partitioned, it must (must) continue to adhere to the principle of division of business logic, the demarcation of the business. such as: SUBBIZ1 in the example below. Typically, for a business directory, encourage (should) to place business-related source file resources directly under the Business directory. Biz1/img/add_button.png add.js add.tpl.html add.css Business directory under the source fileWhen the number of sources is large, our first instinct should be: is the business division not thin enough? Should the sub-business be divided and the sub-business directory established? Biz2/subbiz1/list.js list.tpl.html List.css subbiz2/Encounter is indeed a business as a whole, can not be divided into sub-business, allow (May) non-JS resources by resource type Partition the directory for management. Biz1/css/add.css edit.css remove.css img/add_button.png tpl/add.ht ML edit.html remove.html add.js edit.js remove.js source file resources and content resources, please refer to the Resource Classification section, Common Resources directory, please refer to the Resources Directory section, common Business directory please refer to the Business Directory chapter Section. Business Project Directory Partitioning example ${root}/src/common/img/sprites.png logo.png Co Nf.js layout.css biz1/img/add_button.png add.js add.tp                l.html add.less biz2/subbiz1/list.js list.tpl.html            List.css subbiz2/dep/er/src/test/esui/src/ Test/test/doc/index.html main.html ... Package project directory structure partition package project ${root} directory Structure Division compliance${root} directory Structure division. The package project SRC directory structure package is a code set that implements an independent function that has a reusable value. According to the usual understanding, a package project should not be particularly complex. Therefore, the package is visible as a less complex business, and its SRC division principle is consistent with the Business Directory Division principle of the Business project.            ${root}/src/css/img/sprites.png table.css Button.css    Select.css main.js control.js inputcontrol.js button.js table.js select.js Test/doc/package.json ... A directory that is used directly under ${root} for a directory-level directory is called a first-level directory. The first-level directory must have some functional attribute (must). In addition to some of the common directories listed below, ${root} can also place some files related to project publishing, such as Build.sh,build.xml,makefile,gruntfile and so on. The SRCSRC directory is used to store development-time source files and must be published ( Must) is removed. The DEPDEP directory is used to hold a third-party package that the project introduces. Content under this directory is managed by the platform tools, and project developers do not allow (must not) to change any content of third-party packages under the DEP directory. When the project needs to modify the introduction of the third-party code, the third-party package should be directly placed in the ${ROOT}/SRC directory, rules see the provisions of the directory. For more information about packages, refer to the package Structure specification Tooltool directory for tools used in the development or build phase. The directory must be deleted (must) when it is published. The Testtest directory is used to store simulation data for test cases and development phases. The directory must be deleted (must) when it is published. The Docdoc directory is used to store project documents. The project document may be a document that is maintained by the developer, or it may be a tool-generated document. The Entryentry directory is used to store the project's page entry file, usually a static page that can be accessed directly after it is online. RIA projects typically contain fewer page entry files, often main.html, which can be placed (should) directly under the ${root} directory.      ${root}/src/  Common/conf.js card/gold/message/index.html main.html ... A multi-page project usually has a large number of page entry files, which can be (should) uniformly placed in the entry directory and named by business logic.        ${root}/Src/common/conf.js card/gold/message/entry/card.html Gold.html message.html ... When the project is published, the build tool can parse and compile the portal file for entry. After the RIA project has been compiled by the build tool, the directory structure might look like this: output/asset/js/css/tpl/img/index.html main.html multi-page project        After the build tool compiles, the directory structure might look like this: output/card/asset/js/css/img/index.html gold/ The Asset/js/css/img/index.htmlassetasset directory is used to hold static resources for online access. The build tool typically parses, merges, and compresses resources in the SRC directory and the DEP directory, and generates it into the asset directory. So this directory avoids manual management as much as possible. The following is an example of a build tool's asset directory: ${root}/asset/js/loader.js build.js Css/commo N.css img/tpl/build.tpl.html img/... A directory of resource directories named by resource type is called a resource directory. The Resource directory does notAllow (must not) to be placed directly under ${root}. The JSJS directory can be used to store JS resource files (including languages such as coffeescript that can be compiled into JS). JS file suffix name must (must) for. js,coffeescript file suffix name must (must) be. Coffee. JS directory must (must) storage JS resource files, but JS resource files may not be stored in the JS directory: for the SRC directory, JS resource file is not allowed (must not) stored in the JS directory. For the asset directory, the JS resource file (should) can be stored in the JS directory, depending on the construction behavior. For other first level directory, JS resource file (should) can not be stored in the JS directory. The CSSCSS directory can be used to store CSS resource files (including dynamic style sheet languages such as Less,sass). The CSS file suffix name must (must) be. css,less file suffix name must (must) to. Less. CSS resource files must be (must) stored within the directory, but the CSS resource files are not necessarily stored in the CSS directory: for the SRC directory, the CSS resource file (should) can be stored in the business directory or (should) in the CSS directory. For the asset directory, the CSS resource file can (should) be stored in the CSS directory, depending on the build behavior. For other first-level directories, CSS resource files can (should) not be stored in the CSS directory. For a description of the location of the CSS reference picture, refer to the IMG section. The imgimg directory can be used to store picture resource files. Includes a page directly referencing the picture with the CSS reference picture. The common picture resources have gif/jpg/png/svg/bmp and so on. For a CSS-referenced picture, it must be placed (must) in the./img directory, which represents the directory where the current CSS resource resides. For images that are directly referenced by a page: images that are referenced by multiple pages should (should) be placed in the ${root}/src/common/img directory. A single-page-referenced picture should (should) be placed in the./img directory, which represents the directory where the current page resides. The TPLTPL directory can be used to store template resource files. The template resource file suffix name can (should) be. html or. TPL. Typically, for RIA systems, the template resource file takes the. html suffix so that it can be loaded by XHR. The Fontfont directory can be used to store font resource files. Common font resources are tff/woff/svg and so on. swfswfDirectories can be used to store flash resource files. The flash resource file does not allow (must not) to be placed in the IMG directory. The Business Directory Commoncommon directory is the business common directory for business public files that hold business items. Therefore, the business logic naming is not allowed (must not) to common when the directory structure is partitioned according to business logic. FAQ Why isn't there a resource type directory under Biz? If you continue to partition the resource directory under Biz, the structure of the code may be this: ${root}/src/biz1/js/list.js when we need to use list.js, we must write the following generations Code: Require (".. /biz1/js/list "), but logically, a more reasonable formulation should be require (". /biz1/list "). Therefore we do not recommend to be in the biz under the source code resource partition directory.

　　

Learn a copy of Baidu's project directory structure specification