Nanobot: Polygonal Mascot
    Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »



    The contemporary front-end stack and build pipeline is a very opinionated place, with lots of choices for a lot of different setups.

    Bates is a build config as a dependency, to help automate a specific set of choices for React front-end projects.

    Quick start

    Bates needs node >= 5 and npm >= 3.3

    # check the versions
    $ node -v && npm -v
    # update if necessary
    # use nvm to help you manage node versions
    $ nvm i node # update node
    $ npm i npm -g # update npm

    Create a new project

    $ mkdir my-project # create project folder 
    cd my-project # get into folder 
    $ npm init # setup npm for the project 

    Install and run Bates

    $ npm i bates -S # install and save bates 
    $ npm run bates -- template # create base files 
    $ npm start # start dev server. 
    # The dev server hot reloads the components, run tests and lint on change. 
    # Hit `ctrl+c` to close. 

    Base files:

    • Site entry point is on src/main.js, theme and routes are defined there.
    • Entry component loaded by the template route is on src/Home.js.
    • Package entry point for when releasing projects as npm modules is on src/index.js.
    • Bates uses Stijl for the UI components of his template.

    When you want to deploy the site run:

    npm run bates -- deploy
    # follow the prompt, choose your domain 
    # the site will be available at 

    For information on setting up Travis continuous deploy/releases see: travis setup

    Folder Structure

      dist/ # site files go here 
        bundle.js # bundle is generated by webpack 
      lib/ # transpiled files from src, for releasing project as a npm pckg 
        index.js # npm pckg entry point 
        main.js # site entry point 
        *.test.js # colocated tests 


    Bates adds its script to the package.json file. So that from the project folder he can be executed as npm run bates -- <args>.
    Pay attention to the space after the double dash.


    npm run bates -- template
    If missing, add some base files to your project.

    npm run bates -- start
    Prune and update your dependencies.
    Start a hot-reloaded, babel transpiled, server at localhost:3000.
    Run tests and lint on change.
    Tell you about your outdated packages, your last release and what have changed until now.
    Alias: npm start.

    npm run bates -- server
    Run just the server from the start command.
    The server defaults to port 3000, when the port is not available it uses the next one.
    A PORT env var can also be passed. Eg: PORT=8080 npm run bates -- server

    npm run bates -- test
    Test and lint your /src. Test files need to be named *.test.js.
    Alias: npm test.

    npm run bates -- testWatch
    Same as above, but for every time the source changes.

    npm run bates -- cov
    Run the test coverage and open a browser with the results.

    Site deployment and package releases

    npm run bates -- bundle
    Generate a bundle file from /src/main.js on the /dist folder, for when you want to deploy your code as a website.

    npm run bates -- deploy
    Generate a bundle file from /src/main.js on the /dist folder and deploy that folder to
    If you add a CNAME file, you don't need to fill any prompts here.

    npm run bates -- bundleSize
    Generate an analysis of the bundle size.

    npm run bates -- lib
    Transpile the code from /src to /lib, for when you want to release the code as a npm package.

    npm run bates -- release
    This command is aimed at automating releases on a CI server.
    Using your git commit messages, check for the changes since your last release and suggest a new version. If approved, bump the package and push a new tag.

    npm run bates -- githubRelease
    This command should be used on TravisCI, after a release. Create release notes since your last release, using your git commit messages. Do a release on your github project.
    Travis need to have a GIT_TOKEN environment variable set up with your project token.

    npm run bates -- clean
    Delete all build and transpiled files.




    npm i bates

    Downloadslast 7 days







    last publish


    • avatar