generator-lego-win

generator-lego-win 基于gulp的前端工作流

目录

• 快速开始
• 文件结构
• 环境准备
• 任务说明
• Demo
• 已知问题
• License

快速开始 [⬆]

* `npm install -g generator-lego-win`
* 在空目录执行 `yo lego` 初始化项目

文件结构 [⬆]

generator-lego-win 初始化和执行任务涉及的文件结构：

yourProj/
│
├── package.json                // 项目依赖定义
├── gulp.js                     // 配置任务
│
├── node_modules    			  // `npm install` 拉取依赖包
│
├── src/                        // 开发目录
│    ├── css/                   
│    │   └── global.css         // 经过sass编译后的出口css文件
│    ├── sass/                  // sass源文件
│    ├── img/                   // 仅 Copy 不做操作
│    ├── js/                    // 仅 Copy 不做操作
│    └── index.html             
│    
└── dest/                       // 发布目录，执行 `gulp release` 生成
    ├── css/                    
    │   └── global.css
    ├── img/                   
    ├── js/                     
    └── index.html               

环境准备 [⬆]

1. Node 环境：默认此步骤已完成
2. Yeoman环境：npm install -g yo
3. Gulp 环境：npm install -g gulp
4. sass 编译环境：
   • gem: 下载地址
   • ruby-sass: gem install sass
5. 图片编辑环境：
   • Graphics Magick(gm)，下载地址
   • PhantomJS，下载地址

任务说明 [⬆]

初始化项目

• 执行yo lego，初始化PC类的项目。
• 或者，执行yo lego:mobi，初始化移动类型的项目。

开发

• gulp 创建一个链接，自动检测src文件夹下的静态文件，自动刷新。支持sass编译。

发布

• gulp release 将静态文件压缩到 dest/。

打包

• gulp zip ，替换发布代码资源路径为线上路径，将源码和发布代码压缩成一个zip包。

Demo [⬆]

已知问题 [⬆]

License [⬆]

Released under MIT LICENSE

---