SuperCell is my current build system for Node, Moble and ES6+ React apps. This build system replaces jlGulp and renames the build to reflect that it is no longer tied to any particular technology but will adapt over time as new and better technologies emerge.
Since this is used for my own projects I am currently not accepting public pull requests on this repo. Other then that please feel free to use it however you like.
After cloning the project to your computer run the following command in your terminal to install all required node packages.
sudo npm install
gulp
The first time you run gulp the build may take a little longer as it compiles and builds out the "public/css" and "public/js" folders and files.
- ES6+ with Babel. Use all the new niffty ES6+ features and transpile down to ES5.
- Browserify: JSX transforms, ES6 modules.
- React Ready!
- Uglify: minification.
- BrowserSync.
- Sass / flexbox ready (IE10+), layout for everygreen browsers.
Precompiled JS and SCSS files are in the src folder and compile to public. All other files including HTML, image etc. are in public. BrowserSync runs from public and serves as the "Dist" folder for client-side apps.
- src/.eslintrc: This file is a eslint config file for proper ES6+ sublimeText linting. This file is not required and in the future will be removed.
- Express, browser-sync integration.
- Research webpack as alternative for Gulp to improve build speed and optimization.
- add NODE_ENV environment variable to production for better React performance.
- Additional testing.
If you would like to remove React from the build just follow the steps below.
-
In terminal remove react packages.
sudo npm uninstall react react-dom --save-dev
-
In gulpfile.js
Remove lines:
var react = require('react'); var reactDOM = require('react-dom');
-
In file src/index.js:
Remove all React code.
import React from 'react'; import ReactDOM from 'react-dom'; import HelloWorld from './demoReact.jsx'; ReactDOM.render( <HelloWorld phrase="ES6"/>, document.querySelector('#reactApp') );
-
In folder: src/ remove any react components.