Switch to using Rollup for bundling (#1568)

* Implement first working rollup config for main slate pkg * Convert slate-base64-serializer to rollup * Convert slate-dev-logger to rollup * Convert slate-html-serializer to rollup * Convert slate-hyperscript to rollup * Convert slate-plain-serializer to rollup * Convert slate-prop-types to rollup * Convert (mostly) slate-react to rollup * Convert slate-simulator to rollup * Misc cleanup and configuration tweaks/fixes * Convert slate-schema-violations to rollup * Successful rollup build for top-level examples * Add plugin to replace process.env.NODE_ENV * Only rebuild modules and dev examples in watch mode * Enable sourcemaps for development builds * Force debug to use browser version, remove builtins plugin * Remove is-image from example It relies on node `path` and wouldn't work well in-browser anyway * Use browser version of react-dom/server * Move stray require to import * Configure examples to watch child package output * Fix tests * Remove unneeded preferBuiltins from resolve config * Use more precise files array to ensure sourcemaps aren't included * Use lodash instead of lodash.throttle It's pulled in anyway since slate-react needs slate, so using the minipackage actually causes code duplication * Improve naming/fix UMD builds, update UMD doc * Add rollup configs to linting, add a missing dep to package.json * Use longform rollup CLI flags * Add rollup-plugin-auto-external to reduce external module configuration * Combine rollup config into a unioned helper * Centralize to a single rollup configuration * Update dist structure and package field naming for PR feedback * Add comments and address PR feedback on rollup config * i.e. -> e.g. * Add some spacing to the configuration to improve readability * Add a bit more spacing * Remove umd from example Slate unpkg link
2025-08-09 08:46:35 +02:00 · 2018-02-02 18:46:36 -05:00
parent c044d048ad
commit 228b97ff29
25 changed files with 604 additions and 1483 deletions
--- a/.babelrc
+++ b/.babelrc
@@ -1,11 +1,19 @@
 {
+  "presets": [
+    ["env", {
+      "modules": false
+    }],
+    "react",
+    "stage-0"
+  ],
+  plugins: ["external-helpers"],
+  "env": {
+    "test": {
      "presets": [
        "env",
        "react",
        "stage-0"
      ],
-  "env": {
-    "test": {
      "plugins": ["transform-runtime"]
    }
  }
--- a/.gitignore
+++ b/.gitignore
@@ -1,6 +1,7 @@
 # Build files.
 dist
 examples/build.dev.js
+examples/build.dev.js.map
 examples/build.prod.js
 lib

--- a/docs/walkthroughs/using-the-bundled-source.md
+++ b/docs/walkthroughs/using-the-bundled-source.md
@@ -8,7 +8,7 @@ But, if you'd rather install Slate by simply adding a `<script>` tag to your app
 To get a copy of `slate.js`, download the version of slate you want from npm:

 ```
-npm install slate @0.11.12
+npm install slate@latest
 ```

 And then look in the `node_modules` folder for the bundled `slate.js` file:
@@ -43,9 +43,9 @@ Then you can add `slate.js` after those includes:
 To make things easier, for quick prototyping, you can also use the [`unpkg.com`](https://unpkg.com/#/) delivery network that makes working with bundled npm modules easier. In that case, your includes would look like:

 ```html
-<script src="https://unpkg.com/react/dist/react.js"></script>
-<script src="https://unpkg.com/react-dom/dist/react-dom.js"></script>
-<script src="https://unpkg.com/react-dom/dist/react-dom-server.js"></script>
+<script src="https://unpkg.com/react/umd/react.production.min.js"></script>
+<script src="https://unpkg.com/react-dom/umd/react-dom.production.min.js"></script>
+<script src="https://unpkg.com/react-dom/umd/react-dom-server.browser.production.min.js"></script>
 <script src="https://unpkg.com/immutable/dist/immutable.js"></script>
 <script src="https://unpkg.com/slate/dist/slate.js"></script>
 ```
--- a/examples/check-lists/value.json
+++ b/examples/check-lists/value.json
@@ -19,7 +19,7 @@
        "object": "block",
        "type": "check-list-item",
        "data": {
-          "checked": true,
+          "checked": true
        },
        "nodes": [
          {
@@ -36,7 +36,7 @@
        "object": "block",
        "type": "check-list-item",
        "data": {
-          "checked": true,
+          "checked": true
        },
        "nodes": [
          {
@@ -53,7 +53,7 @@
        "object": "block",
        "type": "check-list-item",
        "data": {
-          "checked": false,
+          "checked": false
        },
        "nodes": [
          {
@@ -70,7 +70,7 @@
        "object": "block",
        "type": "check-list-item",
        "data": {
-          "checked": true,
+          "checked": true
        },
        "nodes": [
          {
@@ -87,7 +87,7 @@
        "object": "block",
        "type": "check-list-item",
        "data": {
-          "checked": false,
+          "checked": false
        },
        "nodes": [
          {
@@ -104,7 +104,7 @@
        "object": "block",
        "type": "check-list-item",
        "data": {
-          "checked": false,
+          "checked": false
        },
        "nodes": [
          {
--- a/examples/images/index.js
+++ b/examples/images/index.js
@@ -1,12 +1,24 @@

 import { Editor, getEventRange, getEventTransfer } from 'slate-react'
-import { Block, Value, SchemaViolations } from 'slate'
+import { Block, Value } from 'slate'
+import { LAST_CHILD_TYPE_INVALID } from 'slate-schema-violations'

 import React from 'react'
 import initialValue from './value.json'
-import isImage from 'is-image'
+import imageExtensions from 'image-extensions'
 import isUrl from 'is-url'

+/*
+ * A function to determine whether a URL has an image extension.
+ *
+ * @param {String} url
+ * @return {Boolean}
+ */
+
+function isImage(url) {
+  return !!imageExtensions.find(url.endsWith)
+}
+
 /**
 * A change function to standardize inserting images.
 *
@@ -38,7 +50,7 @@ const schema = {
    last: { types: ['paragraph'] },
    normalize: (change, reason, { node, child }) => {
      switch (reason) {
-        case SchemaViolations.LastChildTypeInvalid: {
+        case LAST_CHILD_TYPE_INVALID: {
          const paragraph = Block.create('paragraph')
          return change.insertNodeByKey(node.key, node.nodes.size, paragraph)
        }
--- a/examples/tables/value.json
+++ b/examples/tables/value.json
@@ -240,7 +240,7 @@
            "object": "text",
            "leaves": [
              {
-                "text": "This table is just a basic example of rendering a table, and it doesn\'t have fancy functionality. But you could augment it to add support for navigating with arrow keys, displaying table headers, adding column and rows, or even formulas if you wanted to get really crazy!"
+                "text": "This table is just a basic example of rendering a table, and it doesn't have fancy functionality. But you could augment it to add support for navigating with arrow keys, displaying table headers, adding column and rows, or even formulas if you wanted to get really crazy!"
              }
            ]
          }
--- a/package.json
+++ b/package.json
@@ -4,21 +4,19 @@
  "workspaces": [
    "packages/*"
  ],
+  "umd": "./examples/build.dev.js",
+  "umdMin": "./examples/build.prod.js",
  "devDependencies": {
-    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.0",
    "babel-eslint": "^8.2.1",
+    "babel-plugin-external-helpers": "^6.22.0",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-preset-env": "^1.6.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "babel-runtime": "^6.26.0",
-    "babelify": "^7.3.0",
-    "browserify": "^13.0.1",
-    "browserify-global-shim": "^1.0.3",
    "chalk": "^1.1.3",
    "disc": "^1.3.2",
-    "envify": "^3.4.1",
    "eslint": "^4.16.0",
    "eslint-plugin-import": "^2.8.0",
    "eslint-plugin-react": "^7.6.0",
@@ -27,12 +25,13 @@
    "fs-promise": "^1.0.0",
    "gh-pages": "^0.11.0",
    "http-server": "^0.9.0",
+    "image-extensions": "^1.1.0",
    "immutable": "^3.8.1",
    "is-hotkey": "^0.1.1",
-    "is-image": "^1.0.1",
    "is-url": "^1.2.2",
    "jsdom": "^11.5.1",
    "lerna": "^2.7.1",
+    "lodash": "^4.17.4",
    "matcha": "^0.7.0",
    "mocha": "^2.5.3",
    "npm-run-all": "^4.1.1",
@@ -46,15 +45,21 @@
    "react-router-dom": "^4.1.1",
    "read-metadata": "^1.0.0",
    "read-yaml-promise": "^1.0.2",
+    "rollup": "^0.55.1",
+    "rollup-plugin-alias": "^1.4.0",
+    "rollup-plugin-babel": "^3.0.3",
+    "rollup-plugin-commonjs": "^8.3.0",
+    "rollup-plugin-json": "^2.3.0",
+    "rollup-plugin-node-resolve": "^3.0.2",
+    "rollup-plugin-replace": "^2.0.0",
+    "rollup-plugin-sourcemaps": "^0.4.2",
+    "rollup-plugin-uglify": "^3.0.0",
    "slate-collapse-on-escape": "^0.5.0",
    "slate-soft-break": "^0.5.0",
    "slate-sugar": "^0.6.1",
    "source-map-support": "^0.4.0",
    "to-camel-case": "^1.0.0",
    "to-title-case": "^1.0.0",
-    "uglify-js": "^2.7.0",
-    "uglifyify": "^3.0.2",
-    "watchify": "^3.7.0",
    "yaml-js": "^0.2.0"
  },
  "peerDependencies": {
@@ -67,21 +72,16 @@
  "scripts": {
    "benchmark": "mkdir -p ./tmp && babel-node ./node_modules/.bin/_matcha --reporter ./support/benchmark-reporter ./packages/*/benchmark/index.js > ./tmp/benchmark-comparison.json && babel-node ./support/benchmark-compare",
    "benchmark:save": "mkdir -p ./tmp && babel-node ./node_modules/.bin/_matcha --reporter ./support/benchmark-reporter ./packages/*/benchmark/index.js > ./tmp/benchmark-baseline.json",
-    "bootstrap": "lerna bootstrap && yarn run build",
-    "build": "yarn run build:packages",
-    "build:examples": "yarn run build:examples:dev && yarn run build:examples:prod",
-    "build:examples:dev": "browserify --debug --transform babelify ./examples/index.js > ./examples/build.dev.js",
-    "build:examples:prod": "NODE_ENV=production browserify --global-transform envify --global-transform uglifyify --transform babelify ./examples/index.js > ./examples/build.prod.js",
-    "build:packages": "lerna run build",
+    "bootstrap": "lerna bootstrap && yarn build",
+    "build": "NODE_ENV=production rollup --config",
    "clean": "lerna run clean && rm -rf ./node_modules ./dist ./examples/build.*.js",
-    "gh-pages": "yarn run build && yarn run build:examples && gh-pages --dist ./examples",
+    "gh-pages": "yarn build && gh-pages --dist ./examples",
    "lint": "eslint packages/*/src packages/*/test examples/*/*.js examples/dev/*/*.js",
    "open": "open http://localhost:8080/dev.html",
-    "release": "yarn run test && yarn run lint && lerna publish && yarn run gh-pages",
+    "release": "yarn test && yarn lint && lerna publish && yarn gh-pages",
    "start": "http-server ./examples",
    "test": "BABEL_ENV=test mocha --require babel-core/register ./packages/*/test/index.js",
-    "watch": "npm-run-all --parallel --print-label watch:examples watch:packages start",
-    "watch:examples": "watchify --debug --transform babelify ./examples/index.js -o ./examples/build.dev.js -v",
-    "watch:packages": "lerna run --parallel watch"
+    "watch": "npm-run-all --parallel --print-label watch:rollup start",
+    "watch:rollup": "rollup --config --watch"
  }
 }
--- a/packages/slate-base64-serializer/package.json
+++ b/packages/slate-base64-serializer/package.json
@@ -4,7 +4,10 @@
  "version": "0.2.21",
  "license": "MIT",
  "repository": "git://github.com/ianstormtaylor/slate.git",
-  "main": "./lib/index.js",
+  "main": "lib/slate-base64-serializer.js",
+  "module": "lib/slate-base64-serializer.es.js",
+  "umd": "dist/slate-base64-serializer.js",
+  "umdMin": "dist/slate-base64-serializer.min.js",
  "files": [
    "dist/",
    "lib/"
@@ -13,24 +16,16 @@
    "slate": "^0.32.1"
  },
  "devDependencies": {
-    "babel-cli": "^6.10.1",
-    "browserify": "^13.0.1",
    "mocha": "^2.5.3",
-    "slate": "^0.32.2",
-    "uglify-js": "^2.7.0"
+    "slate": "^0.32.2"
  },
  "dependencies": {
    "isomorphic-base64": "^1.0.2"
  },
  "scripts": {
-    "build": "babel --out-dir ./lib ./src",
-    "build:max": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --standalone SlateBase64Serializer > ./dist/slate-base64-serializer.js",
-    "build:min": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --transform uglifyify --standalone SlateBase64Serializer | uglifyjs > ./dist/slate-base64-serializer.min.js",
-    "clean": "rm -rf ./dist ./lib ./node_modules",
-    "prepublish": "yarn run build && yarn run build:max && yarn run build:min",
-    "watch": "babel --watch --out-dir ./lib ./src --source-maps inline"
+    "clean": "rm -rf ./dist ./lib ./node_modules"
  },
-  "browserify-global-shim": {
+  "umdGlobals": {
    "slate": "Slate"
  },
  "keywords": [
--- a/packages/slate-dev-logger/package.json
+++ b/packages/slate-dev-logger/package.json
@@ -4,24 +4,19 @@
  "version": "0.1.37",
  "license": "MIT",
  "repository": "git://github.com/ianstormtaylor/slate.git",
-  "main": "./lib/index.js",
+  "main": "lib/slate-dev-logger.js",
+  "module": "lib/slate-dev-logger.es.js",
+  "umd": "dist/slate-dev-logger.js",
+  "umdMin": "dist/slate-dev-logger.min.js",
  "files": [
    "dist/",
    "lib/"
  ],
  "devDependencies": {
-    "babel-cli": "^6.10.1",
-    "browserify": "^13.0.1",
-    "mocha": "^2.5.3",
-    "uglify-js": "^2.7.0"
+    "mocha": "^2.5.3"
  },
  "scripts": {
-    "build": "babel --out-dir ./lib ./src",
-    "build:max": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --standalone SlateDevLogger > ./dist/slate-dev-logger.js",
-    "build:min": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --transform uglifyify --standalone SlateDevLogger | uglifyjs > ./dist/slate-dev-logger.min.js",
-    "clean": "rm -rf ./dist ./lib ./node_modules",
-    "prepublish": "yarn run build && yarn run build:max && yarn run build:min",
-    "watch": "babel --watch --out-dir ./lib ./src --source-maps inline"
+    "clean": "rm -rf ./dist ./lib ./node_modules"
  },
  "keywords": [
    "slate"
--- a/packages/slate-html-serializer/package.json
+++ b/packages/slate-html-serializer/package.json
@@ -4,7 +4,10 @@
  "version": "0.5.2",
  "license": "MIT",
  "repository": "git://github.com/ianstormtaylor/slate.git",
-  "main": "./lib/index.js",
+  "main": "lib/slate-html-serializer.js",
+  "module": "lib/slate-html-serializer.es.js",
+  "umd": "dist/slate-html-serializer.js",
+  "umdMin": "dist/slate-html-serializer.min.js",
  "files": [
    "dist/",
    "lib/"
@@ -20,22 +23,14 @@
    "slate": "^0.32.1"
  },
  "devDependencies": {
-    "babel-cli": "^6.10.1",
-    "browserify": "^13.0.1",
    "mocha": "^2.5.3",
    "slate": "^0.32.2",
-    "slate-hyperscript": "^0.5.2",
-    "uglify-js": "^2.7.0"
+    "slate-hyperscript": "^0.5.2"
  },
  "scripts": {
-    "build": "babel --out-dir ./lib ./src",
-    "build:max": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --standalone SlateHtmlSerializer > ./dist/slate-html-serializer.js",
-    "build:min": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --transform uglifyify --standalone SlateHtmlSerializer | uglifyjs > ./dist/slate-html-serializer.min.js",
-    "clean": "rm -rf ./dist ./lib ./node_modules",
-    "prepublish": "yarn run build && yarn run build:max && yarn run build:min",
-    "watch": "babel --watch --out-dir ./lib ./src --source-maps inline"
+    "clean": "rm -rf ./dist ./lib ./node_modules"
  },
-  "browserify-global-shim": {
+  "umdGlobals": {
    "immutable": "Immutable",
    "react": "React",
    "react-dom": "ReactDOM",
--- a/packages/slate-html-serializer/src/index.js
+++ b/packages/slate-html-serializer/src/index.js
@@ -1,6 +1,6 @@

 import React from 'react'
-import ReactDOMServer from 'react-dom/server'
+import { renderToStaticMarkup } from 'react-dom/server'
 import typeOf from 'type-of'
 import { Node, Value } from 'slate'
 import { Record } from 'immutable'
@@ -321,7 +321,7 @@ class Html {
    const elements = document.nodes.map(this.serializeNode)
    if (options.render === false) return elements

-    const html = ReactDOMServer.renderToStaticMarkup(<body>{elements}</body>)
+    const html = renderToStaticMarkup(<body>{elements}</body>)
    const inner = html.slice(6, -7)
    return inner
  }
--- a/packages/slate-hyperscript/package.json
+++ b/packages/slate-hyperscript/package.json
@@ -4,7 +4,10 @@
  "version": "0.5.2",
  "license": "MIT",
  "repository": "git://github.com/ianstormtaylor/slate.git",
-  "main": "./lib/index.js",
+  "main": "lib/slate-hyperscript.js",
+  "module": "lib/slate-hyperscript.es.js",
+  "umd": "dist/slate-hyperscript.js",
+  "umdMin": "dist/slate-hyperscript.min.js",
  "files": [
    "dist/",
    "lib/"
@@ -18,21 +21,13 @@
    "slate": "^0.32.1"
  },
  "devDependencies": {
-    "babel-cli": "^6.10.1",
-    "browserify": "^13.0.1",
    "mocha": "^2.5.3",
-    "slate": "^0.32.2",
-    "uglify-js": "^2.7.0"
+    "slate": "^0.32.2"
  },
  "scripts": {
-    "build": "babel --out-dir ./lib ./src",
-    "build:max": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --standalone SlateHyperscript > ./dist/slate-hyperscript.js",
-    "build:min": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --transform uglifyify --standalone SlateHyperscript | uglifyjs > ./dist/slate-hyperscript.min.js",
-    "clean": "rm -rf ./dist ./lib ./node_modules",
-    "prepublish": "yarn run build && yarn run build:max && yarn run build:min",
-    "watch": "babel --watch --out-dir ./lib ./src --source-maps inline"
+    "clean": "rm -rf ./dist ./lib ./node_modules"
  },
-  "browserify-global-shim": {
+  "umdGlobals": {
    "slate": "Slate"
  },
  "keywords": [
--- a/packages/slate-plain-serializer/package.json
+++ b/packages/slate-plain-serializer/package.json
@@ -4,7 +4,10 @@
  "version": "0.5.2",
  "license": "MIT",
  "repository": "git://github.com/ianstormtaylor/slate.git",
-  "main": "./lib/index.js",
+  "main": "lib/slate-plain-serializer.js",
+  "module": "lib/slate-plain-serializer.es.js",
+  "umd": "dist/slate-plain-serializer.js",
+  "umdMin": "dist/slate-plain-serializer.min.js",
  "files": [
    "dist/",
    "lib/"
@@ -17,22 +20,14 @@
    "slate": "^0.32.1"
  },
  "devDependencies": {
-    "babel-cli": "^6.10.1",
-    "browserify": "^13.0.1",
    "mocha": "^2.5.3",
    "slate": "^0.32.2",
-    "slate-hyperscript": "^0.5.2",
-    "uglify-js": "^2.7.0"
+    "slate-hyperscript": "^0.5.2"
  },
  "scripts": {
-    "build": "babel --out-dir ./lib ./src",
-    "build:max": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --standalone SlatePlainSerializer > ./dist/slate-plain-serializer.js",
-    "build:min": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --transform uglifyify --standalone SlatePlainSerializer | uglifyjs > ./dist/slate-plain-serializer.min.js",
-    "clean": "rm -rf ./dist ./lib ./node_modules",
-    "prepublish": "yarn run build && yarn run build:max && yarn run build:min",
-    "watch": "babel --watch --out-dir ./lib ./src --source-maps inline"
+    "clean": "rm -rf ./dist ./lib ./node_modules"
  },
-  "browserify-global-shim": {
+  "umdGlobals": {
    "immutable": "Immutable",
    "slate": "Slate"
  },
--- a/packages/slate-prop-types/package.json
+++ b/packages/slate-prop-types/package.json
@@ -4,7 +4,10 @@
  "version": "0.4.19",
  "license": "MIT",
  "repository": "git://github.com/ianstormtaylor/slate.git",
-  "main": "./lib/index.js",
+  "main": "lib/slate-prop-types.js",
+  "module": "lib/slate-prop-types.es.js",
+  "umd": "dist/slate-prop-types.js",
+  "umdMin": "dist/slate-prop-types.min.js",
  "files": [
    "dist/",
    "lib/"
@@ -17,21 +20,13 @@
    "slate": "^0.32.1"
  },
  "devDependencies": {
-    "babel-cli": "^6.10.1",
-    "browserify": "^13.0.1",
    "mocha": "^2.5.3",
-    "slate": "^0.32.2",
-    "uglify-js": "^2.7.0"
+    "slate": "^0.32.2"
  },
  "scripts": {
-    "build": "babel --out-dir ./lib ./src",
-    "build:max": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --standalone SlatePropTypes > ./dist/slate-prop-types.js",
-    "build:min": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --transform uglifyify --standalone SlatePropTypes | uglifyjs > ./dist/slate-prop-types.min.js",
-    "clean": "rm -rf ./dist ./lib ./node_modules",
-    "prepublish": "yarn run build && yarn run build:max && yarn run build:min",
-    "watch": "babel --watch --out-dir ./lib ./src --source-maps inline"
+    "clean": "rm -rf ./dist ./lib ./node_modules"
  },
-  "browserify-global-shim": {
+  "umdGlobals": {
    "immutable": "Immutable",
    "slate": "Slate"
  },
--- a/packages/slate-react/package.json
+++ b/packages/slate-react/package.json
@@ -4,7 +4,10 @@
  "version": "0.11.2",
  "license": "MIT",
  "repository": "git://github.com/ianstormtaylor/slate.git",
-  "main": "./lib/index.js",
+  "main": "lib/slate-react.js",
+  "module": "lib/slate-react.es.js",
+  "umd": "dist/slate-react.js",
+  "umdMin": "dist/slate-react.min.js",
  "files": [
    "dist/",
    "lib/"
@@ -16,7 +19,7 @@
    "is-in-browser": "^1.1.3",
    "is-window": "^1.0.2",
    "keycode": "^2.1.2",
-    "lodash.throttle": "^4.1.1",
+    "lodash": "^4.1.1",
    "prop-types": "^15.5.8",
    "react-immutable-proptypes": "^2.1.0",
    "react-portal": "^3.1.0",
@@ -32,26 +35,18 @@
    "slate": "^0.32.1"
  },
  "devDependencies": {
-    "babel-cli": "^6.10.1",
-    "browserify": "^13.0.1",
    "mocha": "^2.5.3",
    "slate": "^0.32.2",
    "slate-hyperscript": "^0.5.2",
-    "slate-simulator": "^0.4.19",
-    "uglify-js": "^2.7.0"
+    "slate-simulator": "^0.4.19"
  },
  "scripts": {
-    "build": "babel --out-dir ./lib ./src",
-    "build:max": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --standalone SlateReact > ./dist/slate-react.js",
-    "build:min": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --transform uglifyify --standalone SlateReact | uglifyjs > ./dist/slate-react.min.js",
-    "clean": "rm -rf ./dist ./lib ./node_modules",
-    "prepublish": "yarn run build && yarn run build:max && yarn run build:min",
-    "watch": "babel --watch --out-dir ./lib ./src --source-maps inline"
+    "clean": "rm -rf ./dist ./lib ./node_modules"
  },
-  "browserify-global-shim": {
+  "umdGlobals": {
+    "immutable": "Immutable",
    "react": "React",
    "react-dom": "ReactDOM",
-    "react-dom/server": "ReactDOMServer",
    "slate": "Slate"
  },
  "keywords": [
--- a/packages/slate-react/src/components/content.js
+++ b/packages/slate-react/src/components/content.js
@@ -4,7 +4,7 @@ import React from 'react'
 import Types from 'prop-types'
 import getWindow from 'get-window'
 import logger from 'slate-dev-logger'
-import throttle from 'lodash.throttle'
+import throttle from 'lodash/throttle'

 import EVENT_HANDLERS from '../constants/event-handlers'
 import Node from './node'
--- a/packages/slate-schema-violations/package.json
+++ b/packages/slate-schema-violations/package.json
@@ -4,25 +4,20 @@
  "version": "0.1.0",
  "license": "MIT",
  "repository": "git://github.com/ianstormtaylor/slate.git",
-  "main": "./lib/index.js",
+  "main": "lib/slate-schema-violations.js",
+  "module": "lib/slate-schema-violations.es.js",
+  "umd": "dist/slate-schema-violations.js",
+  "umdMin": "dist/slate-schema-violations.min.js",
  "files": [
    "dist/",
    "lib/"
  ],
  "devDependencies": {
-    "babel-cli": "^6.10.1",
-    "browserify": "^13.0.1",
    "mocha": "^2.5.3",
-    "slate": "^0.32.2",
-    "uglify-js": "^2.7.0"
+    "slate": "^0.32.2"
  },
  "scripts": {
-    "build": "babel --out-dir ./lib ./src",
-    "build:max": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --standalone SlateSchemaViolations > ./dist/slate-schema-violations.js",
-    "build:min": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --transform uglifyify --standalone SlateSchemaViolations | uglifyjs > ./dist/slate-schema-violations.min.js",
-    "clean": "rm -rf ./dist ./lib ./node_modules",
-    "prepublish": "yarn run build && yarn run build:max && yarn run build:min",
-    "watch": "babel --watch --out-dir ./lib ./src --source-maps inline"
+    "clean": "rm -rf ./dist ./lib ./node_modules"
  },
  "keywords": [
    "constants",
--- a/packages/slate-simulator/package.json
+++ b/packages/slate-simulator/package.json
@@ -4,30 +4,24 @@
  "version": "0.4.19",
  "license": "MIT",
  "repository": "git://github.com/ianstormtaylor/slate.git",
-  "main": "./lib/index.js",
+  "main": "lib/slate-simulator.js",
+  "module": "lib/slate-simulator.es.js",
+  "umd": "dist/slate-simulator.js",
+  "umdMin": "dist/slate-simulator.min.js",
  "files": [
    "dist/",
    "lib/"
  ],
  "peerDependencies": {
-    "slate": "^0.32.1",
-    "slate-dev-logger": "^0.1.23"
+    "slate": "^0.32.1"
  },
  "devDependencies": {
-    "babel-cli": "^6.10.1",
-    "browserify": "^13.0.1",
-    "slate": "^0.32.2",
-    "uglify-js": "^2.7.0"
+    "slate": "^0.32.2"
  },
  "scripts": {
-    "build": "babel --out-dir ./lib ./src",
-    "build:max": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --standalone SlateSimulator > ./dist/slate-simulator.js",
-    "build:min": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --transform uglifyify --standalone SlateSimulator | uglifyjs > ./dist/slate-simulator.min.js",
-    "clean": "rm -rf ./dist ./lib ./node_modules",
-    "prepublish": "yarn run build && yarn run build:max && yarn run build:min",
-    "watch": "babel --watch --out-dir ./lib ./src --source-maps inline"
+    "clean": "rm -rf ./dist ./lib ./node_modules"
  },
-  "browserify-global-shim": {
+  "umdGlobals": {
    "slate": "Slate"
  },
  "keywords": [
--- a/packages/slate/package.json
+++ b/packages/slate/package.json
@@ -4,7 +4,10 @@
  "version": "0.32.2",
  "license": "MIT",
  "repository": "git://github.com/ianstormtaylor/slate.git",
-  "main": "./lib/index.js",
+  "main": "lib/slate.js",
+  "module": "lib/slate.es.js",
+  "umd": "dist/slate.js",
+  "umdMin": "dist/slate.min.js",
  "files": [
    "dist/",
    "lib/"
@@ -25,21 +28,12 @@
    "react": "^0.14.0 || ^15.0.0 || ^16.0.0"
  },
  "devDependencies": {
-    "babel-cli": "^6.10.1",
-    "browserify": "^13.0.1",
-    "slate-hyperscript": "^0.5.2",
-    "uglify-js": "^2.7.0"
+    "slate-hyperscript": "^0.5.2"
  },
  "scripts": {
-    "build": "babel --out-dir ./lib ./src",
-    "build:max": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --standalone Slate > ./dist/slate.js",
-    "build:min": "mkdir -p ./dist && NODE_ENV=production browserify ./src/index.js --transform babelify --transform envify --transform [ browserify-global-shim --global ] --transform uglifyify --standalone Slate | uglifyjs > ./dist/slate.min.js",
-    "clean": "rm -rf ./dist ./lib ./node_modules",
-    "prepublish": "yarn run build && yarn run build:max && yarn run build:min",
-    "watch": "babel --watch --out-dir ./lib ./src --source-maps inline"
+    "clean": "rm -rf ./dist ./lib ./node_modules"
  },
-  "browserify-global-shim": {
-    "react": "React",
+  "umdGlobals": {
    "immutable": "Immutable"
  },
  "keywords": [
--- a/packages/slate/src/index.js
+++ b/packages/slate/src/index.js
@@ -1,5 +1,6 @@

 import Block from './models/block'
+import Change from './models/change'
 import Changes from './changes'
 import Character from './models/character'
 import Data from './models/data'
@@ -26,6 +27,7 @@ import { resetKeyGenerator, setKeyGenerator } from './utils/generate-key'

 export {
  Block,
+  Change,
  Changes,
  Character,
  Data,
--- a/packages/slate/src/models/value.js
+++ b/packages/slate/src/models/value.js
@@ -4,6 +4,7 @@ import logger from 'slate-dev-logger'
 import { Record, Set, List, Map } from 'immutable'

 import MODEL_TYPES from '../constants/model-types'
+import Change from './change'
 import Data from './data'
 import Document from './document'
 import History from './history'
@@ -621,7 +622,6 @@ class Value extends Record(DEFAULTS) {
   */

  change(attrs = {}) {
-    const Change = require('./change').default
    return new Change({ ...attrs, value: this })
  }

--- a/rollup.config.js
+++ b/rollup.config.js
@@ -0,0 +1,26 @@
+import factory from './support/rollup/factory'
+import examplesConfig from './support/rollup/examples'
+import slate from './packages/slate/package.json'
+import slateBase64Serializer from './packages/slate-base64-serializer/package.json'
+import slateDevLogger from './packages/slate-dev-logger/package.json'
+import slateHtmlSerializer from './packages/slate-html-serializer/package.json'
+import slateHyperscript from './packages/slate-hyperscript/package.json'
+import slatePlainSerializer from './packages/slate-plain-serializer/package.json'
+import slatePropTypes from './packages/slate-prop-types/package.json'
+import slateReact from './packages/slate-react/package.json'
+import slateSchemaViolations from './packages/slate-schema-violations/package.json'
+import slateSimulator from './packages/slate-simulator/package.json'
+
+export default [
+  ...factory(slate),
+  ...factory(slateBase64Serializer),
+  ...factory(slateDevLogger),
+  ...factory(slateHtmlSerializer),
+  ...factory(slateHyperscript),
+  ...factory(slatePlainSerializer),
+  ...factory(slatePropTypes),
+  ...factory(slateReact),
+  ...factory(slateSchemaViolations),
+  ...factory(slateSimulator),
+  ...examplesConfig,
+]
--- a/support/rollup/examples.js
+++ b/support/rollup/examples.js
@@ -0,0 +1,105 @@
+import path from 'path'
+import { cloneDeep } from 'lodash'
+import alias from 'rollup-plugin-alias'
+import resolve from 'rollup-plugin-node-resolve'
+import commonjs from 'rollup-plugin-commonjs'
+import json from 'rollup-plugin-json'
+import replace from 'rollup-plugin-replace'
+import babel from 'rollup-plugin-babel'
+import uglify from 'rollup-plugin-uglify'
+import sourcemaps from 'rollup-plugin-sourcemaps'
+import pkg from '../../package.json'
+
+const environment = process.env.NODE_ENV || 'development'
+
+const configurations = []
+
+const output = {
+  umd: pkg.umd,
+  umdMin: pkg.umdMin,
+}
+
+const umdConfig = {
+  input: 'examples/index.js',
+  output: {
+    file: output.umd,
+    name: 'slate-examples',
+    format: 'umd',
+    exports: 'named',
+    sourcemap: environment === 'development',
+  },
+  plugins: [
+    // Force rollup to use the browser variants of `debug` and `react-dom/server`
+    // The main variant of `debug` relies on Node.js globals, while the main
+    // variant of `react-dom/server` relies on Node.js's Stream.
+    alias({
+      debug: path.resolve(__dirname, 'node_modules/debug/src/browser'),
+      'react-dom/server': path.resolve(__dirname, 'node_modules/react-dom/cjs/react-dom-server.browser.production.min'),
+    }),
+
+    // Allow rollup to resolve modules that are npm dependencies
+    // (by default, it can only resolve local modules).
+    resolve(),
+
+    // Allow rollup to resolve npm dependencies that are CommonJS
+    // (by default, it can only handle ES2015 syntax).
+    commonjs({
+      exclude: ['examples/**'],
+
+      // The CommonJS plugin sometimes cannot correctly identify named
+      // exports of CommonJS modules, so we manually specify here to
+      // hint that e.g. `import { List } from 'immutable'` is a reference
+      // to a valid named export.
+      namedExports: {
+        'esrever': ['reverse'],
+        'immutable': ['List', 'Map', 'Record', 'OrderedSet', 'Set', 'Stack', 'is'],
+        'react-dom': ['findDOMNode'],
+        'react-dom/server': ['renderToStaticMarkup'],
+      },
+    }),
+
+    // Convert JSON imports to ES6 modules.
+    json(),
+
+    // Replace `process.env.NODE_ENV` with its value -- needed for
+    // some modules like React to use their production variant (and
+    // one place within Slate itself).
+    replace({
+      'process.env.NODE_ENV': JSON.stringify(environment)
+    }),
+
+    // Use babel to transpile the result -- limit to package src
+    // to prevent babel from trying to transpile npm dependencies.
+    babel({
+      include: ['examples/**']
+    }),
+  ],
+  // Limit rollup's file watching to example src files and the
+  // built output of packages -- helps keep it from watching
+  // too much and choking.
+  watch: {
+    include: [
+      'examples/**',
+      'packages/*/lib/*.es.js',
+    ],
+  },
+}
+
+if (environment === 'production') {
+  // Only build the minified UMD variant in production --
+  // it makes each rebuild take substantially longer.
+  const umdConfigMin = cloneDeep(umdConfig)
+  umdConfigMin.output.file = output.umdMin
+  umdConfigMin.plugins.push(uglify())
+  configurations.push(umdConfigMin)
+} else {
+  // In development, add the sourcemaps plugin so they
+  // are emitted alongside the dist file.
+  umdConfig.plugins.push(sourcemaps())
+
+  // Only build the unminified variant in development --
+  // it serves no purpose in production.
+  configurations.push(umdConfig)
+}
+
+export default configurations
--- a/support/rollup/factory.js
+++ b/support/rollup/factory.js
@@ -0,0 +1,161 @@
+import path from 'path'
+import { startCase, cloneDeep } from 'lodash'
+import alias from 'rollup-plugin-alias'
+import resolve from 'rollup-plugin-node-resolve'
+import commonjs from 'rollup-plugin-commonjs'
+import babel from 'rollup-plugin-babel'
+import replace from 'rollup-plugin-replace'
+import uglify from 'rollup-plugin-uglify'
+
+const environment = process.env.NODE_ENV || 'development'
+
+export default (pkg) => {
+  const pkgName = pkg.name
+  const output = {
+    cjs: pkg.main,
+    es: pkg.module,
+    umd: pkg.umd,
+    umdMin: pkg.umdMin,
+  }
+  const umdGlobals = pkg.umdGlobals
+
+  // Generate list of external dependencies from package.json
+  let dependencies = []
+  if (pkg.dependencies) {
+    dependencies = dependencies.concat(Object.keys(pkg.dependencies))
+  }
+  if (pkg.peerDependencies) {
+    dependencies = dependencies.concat(Object.keys(pkg.peerDependencies))
+  }
+
+  // Consider a dependency external if:
+  // 1. It is directly located in the package.json dependencies/peerDependencies (e.g. `react`), or
+  // 2. It is part of a package.json dependency (e.g. `lodash/omit`)
+  // External dependencies are expected to be present at runtime (rather than being bundled into
+  // our built dist).
+  const isExternalDependency = id => !!dependencies.find(dep => dep === id || id.startsWith(`${dep}/`))
+
+  // UMD build for browsers
+  const umdConfig = {
+    input: `packages/${pkgName}/src/index.js`,
+
+    output: {
+      file: `packages/${pkgName}/${output.umd}`,
+      format: 'umd',
+      exports: 'named',
+
+      // For a package name such as `slate-react`, the UMD name
+      // should be SlateReact.
+      name: startCase(pkgName).replace(/ /g, ''),
+
+      // Some packages contain `umdGlobals` in their package.json, which
+      // indicates external dependencies that should be treated as globals
+      // rather than bundled into our dist, such as Immutable and React.
+      globals: umdGlobals,
+    },
+
+    // `external` tells rollup to treat the umdGlobals as external (and
+    // thus skip bundling them).
+    external: Object.keys(umdGlobals || {}),
+
+    plugins: [
+      // Force rollup to use the browser variant of `debug`.
+      // The main variant of `debug` relies on Node.js globals.
+      alias({
+        debug: path.resolve(__dirname, 'node_modules/debug/src/browser'),
+      }),
+
+      // Allow rollup to resolve modules that are npm dependencies
+      // (by default, it can only resolve local modules).
+      resolve(),
+
+      // Allow rollup to resolve npm dependencies that are CommonJS
+      // (by default, it can only handle ES2015 syntax).
+      commonjs({
+        exclude: [`packages/${pkgName}/src/**`],
+
+        // The CommonJS plugin sometimes cannot correctly identify named
+        // exports of CommonJS modules, so we manually specify here to
+        // hint that e.g. `import { List } from 'immutable'` is a reference
+        // to a valid named export.
+        namedExports: {
+          'esrever': ['reverse'],
+          'immutable': ['List', 'Map', 'Record', 'OrderedSet', 'Set', 'Stack', 'is'],
+          'react-dom': ['findDOMNode'],
+          'react-dom/server': ['renderToStaticMarkup'],
+        },
+      }),
+
+      // Replace `process.env.NODE_ENV` with its value -- needed for
+      // some modules like React to use their production variant (and
+      // one place within Slate itself).
+      replace({
+        'process.env.NODE_ENV': JSON.stringify('production')
+      }),
+
+      // Use babel to transpile the result -- limit to package src
+      // to prevent babel from trying to transpile npm dependencies.
+      babel({
+        include: [`packages/${pkgName}/src/**`]
+      }),
+    ]
+  }
+
+  // Additional UMD minified build based off of the unminified config
+  const umdConfigMin = cloneDeep(umdConfig)
+  umdConfigMin.output.file = `packages/${pkgName}/${output.umdMin}`
+  umdConfigMin.plugins.push(uglify())
+
+  // CommonJS (for Node) and ES module (for bundlers) build.
+  const moduleConfig = {
+    input: `packages/${pkgName}/src/index.js`,
+    output: [
+      {
+        file: `packages/${pkgName}/${output.es}`,
+        format: 'es',
+        sourcemap: environment === 'development',
+      },
+    ],
+    external: isExternalDependency,
+    plugins: [
+      // Force rollup to use the browser variant of `debug`.
+      // The main variant of `debug` relies on Node.js globals.
+      alias({
+        debug: path.resolve(__dirname, 'node_modules/debug/src/browser'),
+      }),
+
+      // Allow rollup to resolve modules that are npm dependencies
+      // (by default, it can only resolve local modules).
+      resolve(),
+
+      // Replace `process.env.NODE_ENV` with its value -- needed for
+      // some modules like React to use their production variant (and
+      // one place within Slate itself).
+      replace({
+        'process.env.NODE_ENV': JSON.stringify(environment)
+      }),
+
+      // Use babel to transpile the result -- limit to package src
+      // to prevent babel from trying to transpile npm dependencies.
+      babel({
+        include: [`packages/${pkgName}/src/**`]
+      }),
+    ]
+  }
+
+  const configurations = [moduleConfig]
+
+  if (environment === 'production') {
+    // In development, we only build the ES version to
+    // reduce rebuild times. In production, we add the
+    // configs for the other variants here.
+    moduleConfig.output.push({
+      file: `packages/${pkgName}/${output.cjs}`,
+      format: 'cjs',
+      exports: 'named',
+    })
+    configurations.push(umdConfig, umdConfigMin)
+  }
+
+  return configurations
+}
--- a/yarn.lock
+++ b/yarn.lock