aranja / gulp-base Goto Github PK

View Code? Open in Web Editor NEW

8.0 17.0 2.0 103 KB

A base for projects using gulp

CSS 0.68% JavaScript 93.99% HTML 5.32%

gulp-base's Introduction

Gulp Base

Gulp Build system
LESS for CSS preprocessing.
Jade templating engine.
Browserify for module loading JavaScript.
Image minification.
BrowserSync server.

Usage

Getting started is done in a few steps.

1. Clone the Repo:

$ git clone https://github.com/aranja/gulp-base.git

2. Install dependencies:

$ [sudo] npm i

The server can always be booted up by the gulp server and for a production build, simply pass the flag --prod.

Note: When a server is not a necessity, just run gulp --prod to build a production ready version of the app.

The MIT License (MIT)

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

gulp-base's People

Contributors

Stargazers

Watchers

Forkers

kristjanmik hugolopes45

gulp-base's Issues

Add a linter task

Add a css linter

Convert into a yeoman generator

yo aranja-webapp?

Use placeholders for project name across the base
If there are different ways to setup the base, they should be added as generator options (e.g. should there be a server task)
Should install and --save newest versions of all the plugins IMHO

Add .editorconfig specifying our code conventions for editors

Minify js bundle

We seem to be missing uglify or general minification of js.

Less process crashes on error

You have to restart gulp to get it going again

srcWithErrorHandling write after end

gulp-notify writing to a stream which has been closed.

Task to build custom Modernizr

It's used to very good effect in some of our problems. Can be copied straight from newwwness.

Revisit the jshint configurations

Just glancing the file I see a lot of stuff that needs to be changed.

Add support for Sass

You can just create files with the right extension and gulp with build them.

Directly upload images/videos to S3

To avoid Heroku timeouts.

Remove bower

The packages we need are in npm

Regression: Livereload doesn't work

Since gulp-connect is not injecting livereload script anymore.

Extract paths into new paths config file

Or somehow improve task<>watch consistency.

Task to create webm videos

We've used a task in the past to do this. We should improve it and include it here.

Sprites generator

This looks cool! https://github.com/aslansky/css-sprite

Use gulp-minify-css instead of csso

It seems to be a better project overall. I couldn't get gulp-csso to work in the last project.

Add jade html5 boilerplate

https://github.com/dmotz/jade-html5-boilerplate

Find a nice way to pull in layout.jade from the repo

Deploy task

All projects should support a pretty hands-off gulp deploy.

We tend to use app engine to host most static sites, so gulp-base should probably default to that for now.

I think see-further has a pretty good task to base it off.

Use browser sync instead of livereload

Check out BrowserSync.

Less doesn't find normalise

On a fresh install, less can't find normalise

Rename (or alias) tasks by semantic, not by tool

The point is to keep the cli commands the same across projects even though the tools change.

browserify -> scripts
less -> styles
jade -> templates

These are the names I've seen before and like the most, but another option is to name them after the output file type, js, css, html.

They can also be wrappers for other tasks, ie scripts can run scripts-main, scripts-browserify, scripts-vendor etc.

[14:01:10] Starting 'browserify'...
_stream_readable.js:540
    var ret = dest.write(chunk);
                   ^
TypeError: undefined is not a function
    at Producer.ondata (_stream_readable.js:540:20)
    at Producer.emit (events.js:107:17)
    at Producer.Readable.read (_stream_readable.js:373:10)
    at flow (_stream_readable.js:750:26)
    at resume_ (_stream_readable.js:730:3)
    at _stream_readable.js:717:7
    at process._tickCallback (node.js:355:11)

Separate watch and server

Make it possible to bring your own server, such as live-server or python -m "SimpleHTTPServer"

Rename

Gulp might not be the task runner forever. Suggestions (in favorable order):

aranja-origin
aranja-base
aranja-app
aranja-web