Skip to content
This repository has been archived by the owner on Oct 6, 2021. It is now read-only.

Babel ES2015+ Module boilerplate with testing/coverage, using AVA, NYC, Coveralls and Semaphore.

License

Notifications You must be signed in to change notification settings

DanCouper/es6-module-starter

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

32 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

ES6 Module Starter

Boilerplate for ES6 modules (with support down to stage 0 features), using Babel. Test framework is AVA. Coverage via NYC. Linting via ESLint.

Build Status

Coverage Status

Notes/Todos

  • This [natch] has breaking changes from the pre-v1.0.0 es6-module-starter: the test framework and coverage tool have been changed. The API is near-identical, but be aware of this.
  • On OSx, I had permissions issues when trying to run AVA. Fixed by sudo chowning the file AVA writes to in my user root .config/ folder; not sure if this is just my setup or not, but be aware.
  • ESLint has not been given many config options; this means it will throw up errors (for example, if Plato is run on the example code, 3 violations are shown, none of which are actually violations). Add sensible defaults.

Prior Art

Originally based on a clone of https://github.com/vinniegarcia/es6-module-starter; I use Semaphore for continuous integration (so no .travis.yml/similar).

Usage

  1. Install node and npm.
  2. Clone this repo: git clone https://github.com/DanCouper/es6-module-starter.
  3. Install dependencies: npm i.
  4. Edit info in package.json.*
  5. Reinitialize git, commit, then hub create && git push origin master.
  6. Add the repo to your Coveralls account.
  7. Add the repo to your Semaphore account: you need to manually add the coveralls key to the settings for that repo.
  8. Hack away!

Reinitialising using the reset_repo.sh script

NOTE this is WIP, be very careful with it. It will irrevocably wipe out anything there previously, and there is no error handling, so be aware it may completely fry the repo. It currently wrecks package.json if you're not careful re. which characters you enter. MORE WORK NEEDED (probably using a node script instead, or writing it in Perl or Python)

There is a (WIP) bash script to clean the package.json and change relevant fields, and reinitialise as a new git repo.

To run it, clone the repo, giving it the name of the project (as above), npm install the deps, then run the script. For example:

> git clone https://github.com/DanCouper/es6-module-starter my-awesome-project
> cd my-awesome-project
> npm i
> chmod 755 reset_repo.sh
> ./reset_repo.sh
# advised:
> rm reset_repo.sh

It will take you through the necessary steps.

Modules used/included

  • babel - compiles ES6 source to ES5. The babel-preset-latest plugin is included, which gives ES2015/16/17 presets, as well as babel-cli.
  • babel-preset-env - Autoprefixer for Babel. Given a list of browsers to support, only transpiles code that needs to be transpiled.
  • ava for simple, effective testing with built in ES2015 support. The interface is very similar to tape, but tests are run concurrently and in seperate Node processes. Note that AVA does not transpile modules automatically, so you must import 'babel-core/register' at the top of your test files before importing whatever it is you're testing.
  • eslint (with babel-eslint to cover ES2015+ features) to analyze your code for stylistic issues.
  • nyc for code coverage. AVA spawns the test files, so istanbul cannot be used directly: however, NYC runs Istanbul under-the-hood.
  • plato to analyze the complexity of your source code. Note that a fork of Plato with native support for ES2015 is present to avoid having to compile to a build folder before generating reports.

These are just defaults. Feel free to swap out eslint for jshint, or ava for mocha, or whatever you use for CI instead of coveralls.

Layout

  • src/ - Your ES6 source code goes here.
  • tests/ - Your ES6 tests go here.
  • coverage/ - Code coverage reports are output here.
  • dist/ - Your generated ES5 source is output here. This directory is under gitignore.
  • .gitignore - a sensible .gitignore file to prevent you from checking in generated source.
  • package.json - Customize this to publish your own module.
  • README.md - Delete all this and write your own.

npm scripts

These scripts are the main way to interact with your module as you develop it.

Command Description
npm run ava Test your code. Note that simply running ava also works, this alias is present for consistency.
npm run clean Remove the coverage and dist directories.
npm run compile Run babel to compile source to ES5. Files compiled to dist/ with source maps.
npn run coverage Run NYC on your code to report coverage. Reports output in HTML to coverage/.
npm run coveralls Run coveralls, using NYC's lcov report as input.
npm run lint Runs ESLint on your ES6 source and reports any style errors.
npm run plato Run plato on your source, generating a complexity report in coverage/.
npm test Run AVA, NYC, and coveralls, then delete coverage/.

About

Babel ES2015+ Module boilerplate with testing/coverage, using AVA, NYC, Coveralls and Semaphore.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published