Switch to webpack for easier development

fkling · Nov 21, 2015 · 89db32f · 89db32f
1 parent 58bde51
commit 89db32f
Show file tree

Hide file tree

Showing 17 changed files with 278 additions and 228 deletions.
diff --git a/package.json b/package.json
@@ -10,17 +10,13 @@
   "license": "MIT",
   "devDependencies": {
     "babel-eslint": "^4.1.4",
-    "babelify": "^6.1.3",
-    "brfs": "^1.1.1",
-    "browserify": "^12.0.0",
+    "babel-loader": "^5.4.0",
     "eslint": "^1.9.0",
     "eslint-plugin-react": "^3.8.0",
     "http-server": "^0.8.0",
-    "partition-bundle": "^2.0.0",
-    "reactify": "^1.0.0",
-    "uglify-js": "^2.4.16",
-    "uglifyify": "^3.0.1",
-    "watchify": "^3.3.1"
+    "json-loader": "^0.5.3",
+    "raw-loader": "^0.5.1",
+    "webpack": "^1.12.8"
   },
   "dependencies": {
     "acorn": "^2.3.0",
@@ -48,25 +44,10 @@
     "shift-parser": "^3.0.4",
     "typescript": "^1.6.2"
   },
-  "browserify": {
-    "transform": [
-      [
-        "babelify",
-        {
-          "stage": 0,
-          "optional": [
-            "runtime"
-          ],
-          "sourceMaps": "inline"
-        }
-      ],
-      "brfs"
-    ]
-  },
   "scripts": {
     "start": "http-server",
-    "build": "NODE_ENV=production browserify -p [partition-bundle --map partition.json --output ./ --main ./src/app] -g [uglifyify --ignore '**/node_modules/babel*/**/plugin.js']",
-    "watch": "watchify --debug -p [partition-bundle --map partition.json --output ./ --main ./src/app] -g [uglifyify -c drop_debugger=false --no-mangle] -o /dev/null -v",
+    "build": "NODE_ENV=production webpack --optimize-occurence-order",
+    "watch": "webpack -dw",
     "push": "./scripts/push-site.sh"
   }
 }
diff --git a/partition.json b/partition.json
diff --git a/src/app.js b/src/app.js
@@ -12,13 +12,10 @@ import SettingsDialog from './SettingsDialog';
 import * as LocalStorage from './LocalStorage';
 
 import getFocusPath from './getFocusPath';
-import {keypress} from 'keypress';
+import keypress from 'keypress';
 import {getTransformerByID} from './transformers';
 import {getDefaultParser, getParser} from './parsers';
-
-var fs = require('fs');
-
-var defaultCode = fs.readFileSync(__dirname + '/codeExample.txt', 'utf8');
+import defaultCode from './codeExample.txt';
 
 function updateHashWithIDAndRevision(id, rev) {
   global.location.hash = '/' + id + (rev && rev !== 0 ? '/' + rev : '');

diff --git a/src/parsers/acorn.js b/src/parsers/acorn.js
@@ -1,6 +1,5 @@
 import React from 'react';
 import pkg from 'acorn/package.json';
-import loadAndExectue from './utils/loadAndExecute';
 import * as LocalStorage from '../LocalStorage';
 import SettingsRenderer from './utils/SettingsRenderer';
 
@@ -21,10 +20,16 @@ export default {
   homepage: pkg.homepage,
 
   parse(code) {
-    return loadAndExectue(
-      ['acorn'],
-      parser => parser.parse(code, options)
-    );
+    return new Promise((resolve, reject) => {
+      require.ensure(['acorn'], require => {
+        let acorn = require('acorn');
+        try {
+          resolve(acorn.parse(code, options));
+        } catch (err) {
+          reject(err);
+        }
+      });
+    });
   },
 
   nodeToRange(node) {

diff --git a/src/parsers/babel-eslint.js b/src/parsers/babel-eslint.js
@@ -1,5 +1,4 @@
 import pkg from 'acorn-to-esprima/package.json';
-import loadAndExecute from './utils/loadAndExecute';
 
 const ID = 'acorn-to-esprima';
 const name = 'babel-eslint';
@@ -11,33 +10,38 @@ export default {
   homepage: pkg.homepage,
 
   parse(code) {
-    return loadAndExecute(
-      ['acorn-to-esprima', 'babel-core'],
-      (acornToEsprima, {acorn, traverse, parse}) => {
-        const opts = {
-          locations: true,
-          ranges: true,
-        };
-
-        const comments = opts.onComment = [];
-        const tokens = opts.onToken = [];
-
-        let ast;
+    return new Promise((resolve, reject) => {
+      require.ensure(['acorn-to-esprima', 'babel-core'], require => {
         try {
-          ast = parse(code, opts);
-        } catch (err) {
-          throw err;
+          const acornToEsprima = require('acorn-to-esprima');
+          const {acorn, traverse, parse} = require('babel-core');
+          const opts = {
+            locations: true,
+            ranges: true,
+          };
+
+          const comments = opts.onComment = [];
+          const tokens = opts.onToken = [];
+
+          let ast;
+          try {
+            ast = parse(code, opts);
+          } catch (err) {
+            throw err;
+          }
+
+          ast.tokens = acornToEsprima.toTokens(tokens, acorn.tokTypes);
+          acornToEsprima.convertComments(comments);
+          ast.comments = comments;
+          acornToEsprima.attachComments(ast, comments, ast.tokens);
+          acornToEsprima.toAST(ast, traverse);
+
+          resolve(ast);
+        } catch(err) {
+          reject(err);
         }
-
-        ast.tokens = acornToEsprima.toTokens(tokens, acorn.tokTypes);
-        acornToEsprima.convertComments(comments);
-        ast.comments = comments;
-        acornToEsprima.attachComments(ast, comments, ast.tokens);
-        acornToEsprima.toAST(ast, traverse);
-
-        return ast;
-      }
-    );
+      });
+    });
   },
 
   nodeToRange(node) {

diff --git a/src/parsers/babylon.js b/src/parsers/babylon.js
@@ -1,6 +1,5 @@
 import React from 'react';
 import pkg from 'babylon/package.json';
-import loadAndExectue from './utils/loadAndExecute';
 import * as LocalStorage from '../LocalStorage';
 import SettingsRenderer from './utils/SettingsRenderer';
 
@@ -30,10 +29,16 @@ export default {
   homepage: pkg.homepage,
 
   parse(code) {
-    return loadAndExectue(
-      ['babylon'],
-      parser => parser.parse(code, options)
-    );
+    return new Promise((resolve, reject) => {
+      require.ensure(['babylon'], require => {
+        try {
+          const babylon = require('babylon');
+          resolve(babylon.parse(code, options));
+        } catch(err) {
+          reject(err);
+        }
+      });
+    });
   },
 
   nodeToRange(node) {

diff --git a/src/parsers/babylon6.js b/src/parsers/babylon6.js
@@ -1,6 +1,5 @@
 import React from 'react';
 import pkg from 'babylon6/node_modules/babylon/package.json';
-import loadAndExectue from './utils/loadAndExecute';
 import * as LocalStorage from '../LocalStorage';
 import SettingsRenderer from './utils/SettingsRenderer';
 
@@ -37,10 +36,16 @@ export default {
   homepage: pkg.homepage,
 
   parse(code) {
-    return loadAndExectue(
-      ['babylon6'],
-      parser => parser.parse(code, options)
-    );
+    return new Promise((resolve, reject) => {
+      require.ensure(['babylon6'], require => {
+        try {
+          const babylon = require('babylon6');
+          resolve(babylon.parse(code, options));
+        } catch(err) {
+          reject(err);
+        }
+      });
+    });
   },
 
   nodeToRange(node) {

diff --git a/src/parsers/espree.js b/src/parsers/espree.js
@@ -1,6 +1,5 @@
 import React from 'react';
 import pkg from 'espree/package.json';
-import loadAndExectue from './utils/loadAndExecute';
 import * as LocalStorage from '../LocalStorage';
 import SettingsRenderer from './utils/SettingsRenderer';
 
@@ -51,10 +50,16 @@ export default {
   homepage: pkg.homepage,
 
   parse(code) {
-    return loadAndExectue(
-      ['espree'],
-      parser => parser.parse(code, options)
-    );
+    return new Promise((resolve, reject) => {
+      require.ensure(['espree'], require => {
+        try {
+          const espree = require('espree');
+          resolve(espree.parse(code, options));
+        } catch(err) {
+          reject(err);
+        }
+      });
+    });
   },
 
   nodeToRange(node) {

diff --git a/src/parsers/esprima.js b/src/parsers/esprima.js
@@ -1,6 +1,5 @@
 import React from 'react'; // eslint-disable-line no-unused-vars
 import pkg from 'esprima/package.json';
-import loadAndExectue from './utils/loadAndExecute';
 import SettingsRenderer from './utils/SettingsRenderer';
 import * as LocalStorage from '../LocalStorage';
 
@@ -35,10 +34,16 @@ export default {
   homepage: pkg.homepage,
 
   parse(code) {
-    return loadAndExectue(
-      ['esprima'],
-      parser => parser.parse(code, options)
-    );
+    return new Promise((resolve, reject) => {
+      require.ensure(['esprima'], require => {
+        try {
+          const esprima = require('esprima');
+          resolve(esprima.parse(code, options));
+        } catch(err) {
+          reject(err);
+        }
+      });
+    });
   },
 
   nodeToRange(node) {

diff --git a/src/parsers/recast.js b/src/parsers/recast.js
@@ -1,6 +1,5 @@
 import React from 'react'; // eslint-disable-line no-unused-vars
 import pkg from 'recast/package.json';
-import loadAndExectue from './utils/loadAndExecute';
 import SettingsRenderer from './utils/SettingsRenderer';
 import * as LocalStorage from '../LocalStorage';
 
@@ -27,21 +26,28 @@ export default {
   homepage: pkg.homepage,
 
   parse(code) {
-    let modules = ['recast'];
-    if (options.parser !== 'esprima-fb') {
-      modules[1] = options.parser;
-    }
-    return loadAndExectue(
-      modules,
-      (recast, parser) => {
-        let localOptions = {...options};
-        delete localOptions.parser;
-        if (parser) {
-          localOptions.esprima = parser;
+    return new Promise((resolve, reject) => {
+      require.ensure(
+        ['recast', 'esprima', 'babel-core'],
+        require => {
+          try {
+            const recast = require('recast');
+            const parsers = {
+              esprima: require('esprima'),
+              'babel-core': require('babel-core'),
+            };
+            let localOptions = {...options};
+            delete localOptions.parser;
+            if (options !== 'esprima-fb') {
+              localOptions.esprima = parsers[options.parser];
+            }
+            resolve(recast.parse(code, localOptions));
+          } catch(err) {
+            reject(err);
+          }
         }
-        return recast.parse(code, localOptions);
-      }
-    );
+      );
+    });
   },
 
   nodeToRange(node) {

diff --git a/src/parsers/shift.js b/src/parsers/shift.js
@@ -1,6 +1,5 @@
 import React from 'react'; // eslint-disable-line no-unused-vars
 import pkg from 'shift-parser/package.json';
-import loadAndExecute from './utils/loadAndExecute';
 import SettingsRenderer from './utils/SettingsRenderer';
 import * as LocalStorage from '../LocalStorage';
 
@@ -27,16 +26,20 @@ export default {
   homepage: pkg.homepage,
 
   parse(code) {
-    return loadAndExecute(
-      ['shift-parser'],
-      parser => {
-        if (options.sourceType === 'module') {
-          return parser.parseModule(code, options);
-        } else {
-          return parser.parseScript(code, options);
+    return new Promise((resolve, reject) => {
+      require.ensure(['shift-parser'], require => {
+        try {
+          const shift = require('shift-parser');
+          if (options.sourceType === 'module') {
+            resolve(shift.parseModule(code, options));
+          } else {
+            resolve(shift.parseScript(code, options));
+          }
+        } catch(err) {
+          reject(err);
         }
-      }
-    );
+      });
+    });
   },
 
   nodeToRange(node) {