## 前言 项目开始阶段，一个最重要的工作就是创建工程化标准目录并且初始化文件。我们基于gulp给大家拟定了一个简单的方式来初始化。 ### 标准化目录 * 根据我们目前的项目架构以及业务，我们将初步的前端工程化目录调整为下面的结构，其中三级目录根据自己的需求灵活增删。  ### 初始化目录结构 * 前提你的gulp的准备工作已经完善，并且项目根目录下有对应的模块依赖载入。那么你可以进行目录的初始化了。如果前端团队内已经搭建好了基本的项目结构，可以把这个发布为模块，以供其他项目引入这个核心模块，完成基本的配置。 * 需要的工具模块 ~~~ var mkdirp = require('mkdirp'); var fs = require('fs'); ~~~ * 可能的初始化目录以及文件 ~~~ var moduledir={ srcPages:'./src/pages/', srcJS : './src/js/', //JS生产目录 srcLess : './src/less/', //less源文件目录 srcCss :'./src/css/', //less源文件目录 srcCSSbase : './src/less/base', //less源文件目录 srcCSScomp : './src/less/components', //less源文件目录 srcCSScomp : './src/less/components', //less源文件目录 srcCSSmixin : './src/less/base/mixin', //less源文件目录 srcFont : './src/fonts/', //字体图标源文件目录 srcImage : './src/img/', //图片源文件目录 libs :'./libs', //生产目录 test : './test', //生产目录 doc : './doc', //生产目录doc dest : './dist' //生产目录 } var files={ srcCSSbutton : './src/less/components/button.less', //less源 srcCSSinput : './src/less/components/input.less', //less源文件 srcCSScombine : './src/less/style.less', //less源文件目录 srcCSSvars : './src/less/base/variables.less', //less源文件目录 srcCSSreset : './src/less/base/reset.less', //less源文件目录 srcCSSglobal : './src/less/base/global.less', //less源文件目录 srcCSSgrid : './src/less/base/grid.less', //less源文件目录 readme : './README.md',//生产目录 //bowermodule="./dist/lib" //依赖资源文档的目录 bowermoduleFile : "./.bowerrc", gitignore : './.gitignore' //生产目录 } ~~~ * 建立文件任务 ~~~ //初始化目录结构 gulp.task('initdir', function () { for (let p in moduledir) { mkdirp(moduledir[p], function (err) { if (err) console.error(err); else console.log(moduledir[p] + " was created!"); }); } }) // 初始化基本的文件，根据不同的文件初始化需求去写入内容或者加载内容 gulp.task('initfiles',function(){ for (let p in files) { var initStr; switch(files[p]) { case "./.gitignore": initStr = "node_modules"; break; case "./.bowerrc": initStr = '{"directory" : "libs"}'; break; default: initStr = ""; break } fs.writeFile(files[p], initStr, function(err) { if(err) { return console.log(err); } else console.log(files[p] + " was saved!"); }) } }) gulp.task('initFileSys',['initdir','initfiles'],function(){ console.log('初始化项目目录完成') }) ~~~