A simple boilerplate for web apps with React, Bublé and Rollup.
The aim of this project is to provide a simple boilerplate to get started with React bundled as an ES2015 module via Rollup, compiled by Bublé.
To sum up and give an overview of what can be achieved like a breath of fresh air:
// Import React, ReactDOM and the DummyComponent.
import React from 'react'
import ReactDOM from 'react-dom'
import { DummyComponent } from './components/dummy-component.jsx'
// Define the root element.
const root = document.querySelector('main')
// Append the DummyComponent instance to the root element.
ReactDOM.render(<DummyComponent />, root)Rollup will magically includes only what you need in your bundle depending on the imports!
The easiest way to go is to use nvm and to install one of the recent NodeJS versions bundled with npm 3 by default (i.e. NodeJS >= 5.0.0).
Via npm into a fresh project:
npm i buble-react-rollup-starterOr using Git:
git clone https://github.com/yamafaktory/buble-react-rollup-starter.git
cd buble-react-rollup-starter
npm iFor a faster installation, use yarn instead of npm.
A basic workflow involving Browsersync is already implemented. Running the following command will open your default browser pointing to the html/index-dev.html file. Any modification of one of the files included in the src directory will trigger a new development build and refresh your browser:
npm startYou can also generate a development build by running the following command:
npm run build:devFirst run the following command:
npm run buildThen open the html/index.html file in your browser.
The Rollup production configuration file switch the NodeJS environment to production and minifies the code with UglifyJS.
The code quality is checked by the JavaScript Standard Style.
Released under the MIT license by Davy Duperron.