Cycle.js Browserify Boilerplate

March 16, 2016 · View on GitHub

While this boilerplate is heavily inspired by cycle-webpack-boilerplate it is currently a simpler setup. So far it is not implementing hot module reloading.

It does provide a nice development environment with live reloading JavaScript and CSS, testing with zuul and linting with eslint.

The main dependencies for this boilerplate are:

Usage

First clone this repo and install the dependencies.

git clone https://github.com/kahlil/cycle-browserify-boilerplate.git && npm install

Then change the project name, repository link and description in your package.json and change the remote URL for your Git repo.

git remote set-url origin master [YOUR GIT URL HERE]

Or just download the ZIP and initialize a fresh Git repo with git init.

Then npm install.

npm scripts Documentation

These are all the npm scripts tasks that come with this boilerplate.

The npm commands in bold letters are the ones you might use the most.

npm CommandDescription
npm startBuild everything, start all watch tasks and serve the index.html file.
npm testRun browser tests in zuul.
npm run lintLint your files.
npm run lint:fixLint your files and try to automatically fix errors.
npm run cleanDeletes the build folder.
npm run budoStarts a development server, compiles and watches JavaScript and watches other assets.
npm run browserifyBuilds the JavaScript app, creates source maps.
npm run uglifyMinifies the JavaScript app, creates source maps.
npm run build:js:prodBuilds JavaScript for production with browserify and Uglify, generates external source maps.
npm run build:cssCompiles the Sass files to CSS.
npm run build:css:prodCompiles the Sass files to CSS for production.
npm run watch:scssBuild and watch the Sass files with node-sass and chokidar.

License

MIT © Kahlil Lechelt