From 31c160d3ea1c06935a95adbe6afb29fba34dcb27 Mon Sep 17 00:00:00 2001 From: Ryan Florence Date: Mon, 10 Nov 2014 11:44:25 -0700 Subject: [PATCH] switch to web pack dev server for examples --- CONTRIBUTING.md | 8 +++--- examples/basic/index.html | 5 ++-- package.json | 9 ++++--- script/build-examples | 6 ----- script/dev-examples | 3 +++ webpack.config.js | 52 +++++++++++++++++++++++++++++++++++++++ 6 files changed, 68 insertions(+), 15 deletions(-) delete mode 100755 script/build-examples create mode 100755 script/dev-examples create mode 100644 webpack.config.js diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index e859fc56..94995bd7 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -28,10 +28,10 @@ always be in sync. ### Development -- `script/test` will fire up a karma runner and watch for changes in the - specs directory. -- `npm test` will do the same but doesn't watch, just runs the tests. -- `script/build-examples` does exactly that. +- `npm start` runs the dev server to run/develop examples +- `npm test` will run the test. +- `script/test` same as `npm test` but keeps karma running and watches + for changes ### Build diff --git a/examples/basic/index.html b/examples/basic/index.html index b6b5dc97..8ccdb073 100644 --- a/examples/basic/index.html +++ b/examples/basic/index.html @@ -4,5 +4,6 @@
- - + + + diff --git a/package.json b/package.json index 21438486..803629b1 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,8 @@ "example": "examples" }, "scripts": { - "test": "script/test --browsers Firefox --single-run" + "test": "script/test --browsers Firefox --single-run", + "start": "script/dev-examples" }, "authors": [ "Ryan Florence" @@ -24,6 +25,7 @@ "browserify-shim": "3.6.0", "envify": "1.2.0", "expect": "0.1.1", + "jsx-loader": "0.11.2", "karma": "0.12.16", "karma-browserify": "^0.2.1", "karma-chrome-launcher": "0.1.4", @@ -35,7 +37,8 @@ "react-tap-event-plugin": "git://github.com/appsforartists/react-tap-event-plugin", "reactify": "^0.14.0", "rf-release": "0.3.1", - "uglify-js": "2.4.15" + "uglify-js": "2.4.15", + "webpack-dev-server": "1.6.5" }, "peerDependencies": { "react": ">=0.11.0" @@ -55,4 +58,4 @@ "browserify-shim": { "react": "global:React" } -} \ No newline at end of file +} diff --git a/script/build-examples b/script/build-examples deleted file mode 100755 index 417e1420..00000000 --- a/script/build-examples +++ /dev/null @@ -1,6 +0,0 @@ -#!/bin/sh -BROWSERIFY="node_modules/.bin/browserify --detect-globals false" -BUNDLE_EXAMPLE="$BROWSERIFY -t reactify -t envify -x react -x react-modal" -NODE_ENV=development $BROWSERIFY -t reactify -t envify -r react -r ./lib:react-modal > examples/global-bundle.js - -$BUNDLE_EXAMPLE examples/basic/app.js > examples/basic/app-bundle.js diff --git a/script/dev-examples b/script/dev-examples new file mode 100755 index 00000000..fb83b319 --- /dev/null +++ b/script/dev-examples @@ -0,0 +1,3 @@ +#!/bin/sh +node_modules/.bin/webpack-dev-server --inline --content-base examples/ + diff --git a/webpack.config.js b/webpack.config.js new file mode 100644 index 00000000..b0f344f1 --- /dev/null +++ b/webpack.config.js @@ -0,0 +1,52 @@ +var fs = require('fs'); +var path = require('path'); +var webpack = require('webpack'); + +var EXAMPLES_DIR = path.resolve(__dirname, 'examples'); + +function isDirectory(dir) { + return fs.lstatSync(dir).isDirectory(); +} + +function buildEntries() { + return fs.readdirSync(EXAMPLES_DIR).reduce(function (entries, dir) { + if (dir === 'build') + return entries; + + var isDraft = dir.charAt(0) === '_'; + + if (!isDraft && isDirectory(path.join(EXAMPLES_DIR, dir))) + entries[dir] = path.join(EXAMPLES_DIR, dir, 'app.js'); + + return entries; + }, {}); +} + +module.exports = { + + entry: buildEntries(), + + output: { + filename: '[name].js', + chunkFilename: '[id].chunk.js', + path: 'examples/__build__', + publicPath: '/__build__/' + }, + + module: { + loaders: [ + { test: /\.js$/, loader: 'jsx-loader?harmony' } + ] + }, + + resolve: { + alias: { + 'react-router': '../../modules/index' + } + }, + + plugins: [ + new webpack.optimize.CommonsChunkPlugin('shared.js') + ] + +};