zoukankan      html  css  js  c++  java
  • 基于requireJS和Gulp可快速搭建前端项目的脚手架

    基于requireJS和Gulp可快速搭建前端项目的脚手架。

    项目地址

    1. git clone git@github.com:perfectSymphony/Gulp-cli.git

    项目目录

    1. ├── README.md # 项目说明
    2. |—— bin # (在gulpfile文件中使用到)解析layout中的模板html,将完整的html产出到src/html中
    3. ├── dist # 打包生成的项目文件
    4. |—— logs # 监听编译less文件时,打印报错信息,
    5. ├── gulpfile.js # gulp配置文件
    6. ├── package.json # 依赖包
    7. |
    8. ├── src # 项目文件夹
    9. ├── conf # 配置文件目录
    10. ├── data # 模拟数据
    11. |—— public # 第三方库
    12. |—— css # 由less文件生成的的css文件
    13. │── images # 图库
    14. │── js # 组件化脚本文件
    15. │── less # less
    16. |── layout # 页面
    17. └── widget # 公共页面

    项目中使用到的部分技术如下:

    1. - require:实现模块化开发;
    2. - mock:实现本地模拟服务器端返回数据;
    3. - art-template:渲染数据;
    4. - layuiUI框架;
    5. - browsersync:启动项目;

    跨域问题:

    开发环境:proxy; 生产环境:根据自己公司的实际情况选择;

    如何使用

    1、下载项目:

    1. git clone git@github.com:perfectSymphony/Gulp-cli.git

    2、安装依赖:

    1. $ cd Gulp-cli && npm install

    3、启动项目

    1. $ npm run start

    4、项目打包

    1. npm run build

    项目启动命令

    1. 单独编译: npm run build
    2. 单独启动: npm run dev
    3. 编译并启动: npm run start

    自动化部署功能

    1. Gulpfile.js中实现了项目自动化部署功能。需要用到自动化部署,可以在Gulpfile.js中配置一下` 'deployFile','execSSH' `就可以用了

    如果该项目有帮助到你,请动动你的手指,给一个Star。

    微信公众号:

    指尖下的精灵

    备注

    • 本脚手架提供了基本的技术支持,可以根据自己的需求,修改。

    • 如有设计不合理地方,可以提出,也可以到我的微信公众号里面提出改进问题。

    • 项目地址 如对你有帮助,希望给个Star(* ̄︶ ̄)。

  • 相关阅读:
    第二次实验课总结
    第一次实验课总结
    文件操作
    事件监听 计算器界面
    个人信息
    学生成绩管理
    银行管理
    类的抽象与封装
    求最大公约数和最小公倍数
    阶乘
  • 原文地址:https://www.cnblogs.com/myprogramer/p/10556153.html
Copyright © 2011-2022 走看看