Git Product home page Git Product logo

gulp-cli's Introduction

📦 gulp-cli

项目介绍:

目前的SPA应用基本都有框架自带的一套脚手架工具自动生成,但是对于非SPA应用这种构建工具就很稀缺, 就算有的那些个人感觉并不好用,主要是对 ES6/7语法/模块化 的支持程度并不好,无法使用原生的ES6和 import静态编译。针对这一现状,我写了一套 gulp + webpack 自动构建工具,主要针对那些非 SPA的 应用构建。

功能介绍:

  1. 将 gulp 任务流以配置文件的形式提取出来,尽量最大范围实现灵活可配置性。
  2. 相比于网上别的开源 gulp 脚手架,实现了对 ES6 写法的全面支持,无论是 语法、API 还是 import模块化引用,目前可能并未支持ES7,后面可以加上,包括ESlint检查工具 和单元测试,后面也可以加上。
  3. 由于实现了ES6模块静态编译,所有libs全是从node_modules里找的,所以不需要用到bower。
  4. 所有js的入口文件在webpack文件里配置完成以后,不需要在 html 页面里声明,webpack会自动inject
  5. 样式文件目前仅支持sass写法,如果需要支持别的类型,目前需要手动修改源码,这块后期会完善
  6. autoPrefixer自动补全样式前缀。
  7. 样式文件、脚本文件等静态资源均通过md5重命名,防止浏览器缓存
  8. 更方便的 link-href img-src background-imageURL 等路径地址配置,只要在项目中写资源名称,例如 index.css logo.jpg 脚手架会根据配置文件自动补全路径,如果是网络资源,正常写 http:// 开头的绝对路径即可。

尚未解决的问题 / bug

  1. 由于原生 gulp.watch 不监听新增 / 修改文件,所以在向项目中新增 / 删除文件的时候(所有文件),需要重启 dev 打包【没错,这个锅一定要甩给 gulp ... (:зゝ∠)
  2. 报错系统还不是很完善

Getting started

  1. Clone the repository
git clone https://github.com/CRONWMMM/gulp-cli.git
cd gulp-cli
  1. Install with npm
npm install
  1. Run dev
npm run dev
  1. Run build
npm run build

gulp-cli's People

Contributors

cronwmmm avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.