npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

es6-gulp-boilerplate

v0.7.3

Published

Prebuilt gulp environment for ES6 web app boilerplate. (I need to find a better name, I know.)

Downloads

14

Readme

es6-gulp-boilerplate

[DEPRECATED]: please use the new gladius-forge package.

Prebuilt Gulp environment for ES6+ web app boilerplates.

It comes with an ES6+ (ES7 async/await are there) to ES3-ish (as IE8 compatible as possible, but you may have to import polyfills, shims and shams accordingly) compilation process, together with a Browserify bundling and Uglifyjs compression.

Plus a CSS compilation task, to choose from one of the following:

  • LESS
  • Sass
  • SCSS + Compass
  • Myth
  • Stylus

as well as an Autoprefixer, post compilation, process (bye bye vendor prefixes).

Also, templates precompilation process, to choose from one of the following:

  • Handlebars
  • Dust
  • Dot.js
  • Jade

the task compiles templates in JST format, namespaces them under an R.templates globally accessible variable and serves it to you in the form of a template.js module inside your static scripts folder.

You can also rely on a Karma tests runner, with PhantomJS and Google Chrome engines (bring your own karma.config.js file, though), plus JSHint code check and JSValidate safety checks on critical tasks.

It also gives you the possibility to serve your own instance of a Node.js server, plus watchers and livereloading for, well, everything really.

Bonus: version bumping and git tagging/pushing tasks.

TODO:

  • Find a better name. (found! it's gladius-forge)
  • Split compiled templates on a per-page basis (base folder separation).
  • Introduce a super light static page server (now it relies on the final user to feed it one)

Usage

Copy the gulpfile-sample.js in your app folder and configure it the way you like. The configuration is pretty straightforward and the comments will help you out on every bits of it.

You can also take a look at the gladius-draft's gulpfile.js to see how you can extend default tasks, add your own tasks or watchers, etc.

By default, the boilerplate will come with the following tasks, which you can extend or override as you please:

DEFAULTS

production: it will run the basic compilation + compression tasks, without tests other than the JSValidate one to make sure everything worked fine.

development: it will run compilation tasks (no compression) with sourcemaps support, plus it will run watchers to recompile and livereload everything as soon as you make some changes, plus Karma in watch mode.

test: it will just run the tests without watchers (useful for CI engines).

release, feature and patch are special tasks that handle the bump of the version on the package.json as well as the bower.json if present, plus the tagging on your git repo, and the push to master of the newly generated tag.

TODO

  • List all the other tasks

Notes

The boilerplate comes with a very basic set of dependencies installed via NPM. The remaining modules needed by each task will be lazily installed during the pre-process phase of each default task.

This way makes it possible to have the smallest amount of dependencies needed to be installed for the production task, that reflects on an massive reduction of the installation footprint on production environment.

Thanks

This boilerplate of mine is just a combination of great tools put together to achieve higher goals (using cutting edge technologies today, greatly simplifying a developer's workflow, etc), and if it weren't for the people who built those tools, I wouldn't have made this little thing so far.

So, thanks goes to:

  • esnext developers and contributors, that are giving us the possibility to use ES6 syntax today, in the most lightweight way possible.
  • Facebook developers working on the Regenerator compiler, that are giving ES6 generators to us, today (also async and await statements <3).
  • The Gulp developers. Keep up the good work, looking forward for the v4.0.
  • People behind Browserify, because CommonJS is the right thing!
  • Karma, JSHint and gulp-jsvalidate developers, keeping our code safe.
  • All the great guys that brought to us those awesome gulp plugins, the list is long, so thank you all.