Permalink
Browse files

Initial commit

  • Loading branch information...
0 parents commit 883bdbcf212981c80d341685216d84dca33c9345 @bebraw bebraw committed Apr 27, 2016
Showing with 322 additions and 0 deletions.
  1. +14 −0 .babelrc
  2. +3 −0 .gitignore
  3. +7 −0 app/index.jsx
  4. +2 −0 app/main.css
  5. +166 −0 lib/parts.js
  6. +39 −0 package.json
  7. +91 −0 webpack.config.js
@@ -0,0 +1,14 @@
+{
+ "presets": [
+ "es2015",
+ "react",
+ "survivejs-kanban"
+ ],
+ "env": {
+ "start": {
+ "presets": [
+ "react-hmre"
+ ]
+ }
+ }
+}
@@ -0,0 +1,3 @@
+node_modules/
+build/
+
@@ -0,0 +1,7 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+
+ReactDOM.render(
+ <div>Hello world!</div>,
+ document.getElementById('app')
+);
@@ -0,0 +1,2 @@
+/* Add application CSS here */
+
@@ -0,0 +1,166 @@
+const webpack = require('webpack');
+const CleanWebpackPlugin = require('clean-webpack-plugin');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const NpmInstallPlugin = require('npm-install-webpack-plugin');
+
+exports.indexTemplate = function(options) {
+ return {
+ plugins: [
+ new HtmlWebpackPlugin({
+ template: 'node_modules/html-webpack-template/index.ejs',
+ title: options.title,
+ appMountId: options.appMountId,
+ inject: false
+ })
+ ]
+ };
+}
+
+exports.loadJSX = function(include) {
+ return {
+ module: {
+ loaders: [
+ {
+ test: /\.(js|jsx)$/,
+ // Enable caching for extra performance
+ loaders: ['babel?cacheDirectory'],
+ include: include
+ }
+ ]
+ }
+ };
+}
+
+exports.devServer = function(options) {
+ return {
+ devServer: {
+ // Enable history API fallback so HTML5 History API based
+ // routing works. This is a good default that will come
+ // in handy in more complicated setups.
+ historyApiFallback: true,
+
+ // Unlike the cli flag, this doesn't set
+ // HotModuleReplacementPlugin!
+ hot: true,
+ inline: true,
+ progress: true,
+
+ // Display only errors to reduce the amount of output.
+ stats: 'errors-only',
+
+ // Parse host and port from env to allow customization.
+ //
+ // If you use Vagrant or Cloud9, set
+ // host: options.host || '0.0.0.0';
+ //
+ // 0.0.0.0 is available to all network devices
+ // unlike default `localhost`.
+ host: options.host, // Defaults to `localhost`
+ port: options.port // Defaults to 8080
+ },
+ plugins: [
+ // Enable multi-pass compilation for enhanced performance
+ // in larger projects. Good default.
+ new webpack.HotModuleReplacementPlugin({
+ multiStep: true
+ })
+ ]
+ };
+}
+
+exports.setupCSS = function(paths) {
+ return {
+ module: {
+ loaders: [
+ {
+ test: /\.css$/,
+ loaders: ['style', 'css'],
+ include: paths
+ }
+ ]
+ }
+ };
+}
+
+exports.minify = function() {
+ return {
+ plugins: [
+ new webpack.optimize.UglifyJsPlugin({
+ compress: {
+ warnings: false
+ }
+ })
+ ]
+ };
+}
+
+exports.setFreeVariable = function(key, value) {
+ const env = {};
+ env[key] = JSON.stringify(value);
+
+ return {
+ plugins: [
+ new webpack.DefinePlugin(env)
+ ]
+ };
+}
+
+exports.extractBundle = function(options) {
+ const entry = {};
+ entry[options.name] = options.entries;
+
+ return {
+ // Define an entry point needed for splitting.
+ entry: entry,
+ plugins: [
+ // Extract bundle and manifest files. Manifest is
+ // needed for reliable caching.
+ new webpack.optimize.CommonsChunkPlugin({
+ names: [options.name, 'manifest'],
+
+ // options.name modules only
+ minChunks: Infinity
+ })
+ ]
+ };
+}
+
+exports.clean = function(path) {
+ return {
+ plugins: [
+ new CleanWebpackPlugin([path], {
+ root: process.cwd()
+ })
+ ]
+ };
+}
+
+exports.extractCSS = function(paths) {
+ return {
+ module: {
+ loaders: [
+ // Extract CSS during build
+ {
+ test: /\.css$/,
+ loader: ExtractTextPlugin.extract('style', 'css'),
+ include: paths
+ }
+ ]
+ },
+ plugins: [
+ // Output extracted CSS to a file
+ new ExtractTextPlugin('[name].[chunkhash].css')
+ ]
+ };
+}
+
+exports.npmInstall = function(options) {
+ options = options || {};
+
+ return {
+ plugins: [
+ new NpmInstallPlugin(options)
+ ]
+ };
+}
@@ -0,0 +1,39 @@
+{
+ "name": "react-boilerplate",
+ "private": true,
+ "version": "0.0.0",
+ "description": "Boilerplate for [SurviveJS - React](http://survivejs.com/react/introduction/)",
+ "scripts": {
+ "stats": "webpack --profile --json > stats.json",
+ "start": "webpack-dev-server",
+ "deploy": "gh-pages -d build",
+ "build": "webpack"
+ },
+ "keywords": [],
+ "author": "",
+ "license": "MIT",
+ "devDependencies": {
+ "babel-core": "^6.7.7",
+ "babel-loader": "^6.2.4",
+ "babel-preset-es2015": "^6.6.0",
+ "babel-preset-react": "^6.5.0",
+ "babel-preset-react-hmre": "^1.1.1",
+ "babel-preset-survivejs-kanban": "^0.3.3",
+ "clean-webpack-plugin": "^0.1.8",
+ "css-loader": "^0.23.1",
+ "extract-text-webpack-plugin": "^1.0.1",
+ "gh-pages": "^0.11.0",
+ "html-webpack-plugin": "^2.15.0",
+ "html-webpack-template": "^4.0.0",
+ "npm-install-webpack-plugin": "^3.1.0",
+ "style-loader": "^0.13.1",
+ "webpack": "^1.12.14",
+ "webpack-dev-server": "^1.14.1",
+ "webpack-merge": "^0.8.4",
+ "webpack-validator": "^1.0.2"
+ },
+ "dependencies": {
+ "react": "^15.0.1",
+ "react-dom": "^15.0.1"
+ }
+}
@@ -0,0 +1,91 @@
+const path = require('path');
+const merge = require('webpack-merge');
+const validate = require('webpack-validator');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+
+const parts = require('./lib/parts');
+
+const PATHS = {
+ app: path.join(__dirname, 'app'),
+ style: [
+ path.join(__dirname, 'app/main.css')
+ ],
+ build: path.join(__dirname, 'build')
+};
+
+const common = merge({
+ // Entry accepts a path or an object of entries.
+ // We'll be using the latter form given it's
+ // convenient with more complex configurations.
+ entry: {
+ style: PATHS.style,
+ app: PATHS.app
+ },
+ output: {
+ path: PATHS.build,
+ filename: '[name].js'
+ },
+ resolve: {
+ extensions: ['', '.js', '.jsx']
+ }
+ },
+ parts.indexTemplate({
+ title: 'Kanban demo',
+ appMountId: 'app'
+ }),
+ parts.loadJSX(PATHS.app)
+);
+
+var config;
+
+// Detect how npm is run and branch based on that
+switch(process.env.npm_lifecycle_event) {
+ case 'build':
+ case 'stats':
+ config = merge(
+ common,
+ {
+ devtool: 'source-map',
+ output: {
+ path: PATHS.build,
+ filename: '[name].[chunkhash].js',
+ chunkFilename: '[chunkhash].js'
+ }
+ },
+ parts.clean(PATHS.build),
+ parts.setFreeVariable(
+ 'process.env.NODE_ENV',
+ 'production'
+ ),
+ parts.extractBundle({
+ name: 'vendor',
+ entries: ['react', 'react-dom']
+ }),
+ parts.minify(),
+ parts.extractCSS(PATHS.style),
+ parts.purifyCSS([PATHS.app])
+ );
+ break;
+ default:
+ config = merge(
+ common,
+ {
+ devtool: 'eval-source-map'
+ },
+ parts.setupCSS(PATHS.style),
+ parts.devServer({
+ // Customize host/port here if needed
+ host: process.env.HOST,
+ port: process.env.PORT
+ })
+ /*
+ XXXXX: broken in v3.1.0
+ https://github.com/ericclemmons/npm-install-webpack-plugin/issues/43
+ ,parts.npmInstall({
+ save: true
+ })
+ */
+ );
+}
+
+module.exports = validate(config);

0 comments on commit 883bdbc

Please sign in to comment.