w8r · January 10, 2018 10:20 · Nov 12, 2017 · Nov 10, 2017 · Jan 3, 2017 · Jan 2, 2017
diff --git a/package.json b/package.json
@@ -6,12 +6,12 @@
     "build": "rollup --config rollup.config.js"
   },
   "devDependencies": {
-    "rollup": "0.51.3",
+    "rollup": "^0.51.3",
     "rollup-plugin-closure-compiler-js": "^1.0.5",
     "rollup-plugin-commonjs": "^8.2.6",
     "rollup-plugin-node-resolve": "^3.0.0"
   },
   "dependencies": {
-    "ol": "4.0.0"
+    "ol": "^4.1.0"
   }
 }
diff --git a/package.json b/package.json
@@ -6,12 +6,12 @@
     "build": "rollup --config rollup.config.js"
   },
   "devDependencies": {
-    "rollup": "^0.38.0",
-    "rollup-plugin-closure-compiler-js": "^1.0.3",
-    "rollup-plugin-commonjs": "^6.0.1",
-    "rollup-plugin-node-resolve": "^2.0.0"
+    "rollup": "0.51.3",
+    "rollup-plugin-closure-compiler-js": "^1.0.5",
+    "rollup-plugin-commonjs": "^8.2.6",
+    "rollup-plugin-node-resolve": "^3.0.0"
   },
   "dependencies": {
-    "ol": "3.21.0-beta.14"
+    "ol": "4.0.0"
   }
 }
diff --git a/rollup.config.js b/rollup.config.js
@@ -3,9 +3,9 @@ import common from 'rollup-plugin-commonjs';
 import node from 'rollup-plugin-node-resolve';
 
 module.exports = {
-  entry: 'main.js',
-  targets: [
-    {dest: 'bundle.js', format: 'es'}
+  input: 'main.js',
+  output: [
+    {file: 'bundle.js', format: 'es'}
   ],
   plugins: [
     node(),

diff --git a/_readme_.md b/_readme_.md
@@ -2,7 +2,7 @@
 
 This example demonstrates how the [`ol@beta` package](https://www.npmjs.com/package/ol) can be used with Rollup and the Closure Compiler in advanced mode.
 
-Note that the Compiler creates a while to run.
+Note that the Compiler takes a while to run.
 
 Clone the project.
 

diff --git a/index.html b/index.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
+    <meta charset="utf-8">
     <title>Using OpenLayers with Rollup and the Closure Compiler</title>
     <link rel="stylesheet" href="https://openlayers.org/en/latest/css/ol.css" type="text/css">
     <style>

diff --git a/package.json b/package.json
@@ -12,6 +12,6 @@
     "rollup-plugin-node-resolve": "^2.0.0"
   },
   "dependencies": {
-    "ol": "3.21.0-beta.13"
+    "ol": "3.21.0-beta.14"
   }
 }
diff --git a/_readme_.md b/_readme_.md
@@ -2,7 +2,7 @@
 
 This example demonstrates how the [`ol@beta` package](https://www.npmjs.com/package/ol) can be used with Rollup and the Closure Compiler in advanced mode.
 
-Note that the Compiler creates a lot of noise.  This needs to be fixed.
+Note that the Compiler creates a while to run.
 
 Clone the project.
 

diff --git a/package.json b/package.json
@@ -12,6 +12,6 @@
     "rollup-plugin-node-resolve": "^2.0.0"
   },
   "dependencies": {
-    "ol": "3.21.0-beta.11"
+    "ol": "3.21.0-beta.13"
   }
 }
diff --git a/rollup.config.js b/rollup.config.js
@@ -11,7 +11,8 @@ module.exports = {
     node(),
     common(),
     closure({
-      compilationLevel: 'ADVANCED'
+      compilationLevel: 'ADVANCED',
+      warningLevel: 'QUIET'
     })
   ]
 };
diff --git a/_readme_.md b/_readme_.md
@@ -1,8 +1,8 @@
 # OpenLayers, Rollup, and Closure Compiler
 
-This example demonstrates how the [`ol` package](https://www.npmjs.com/package/ol) can be used with Rollup and the Closure Compiler in advanced mode.
+This example demonstrates how the [`ol@beta` package](https://www.npmjs.com/package/ol) can be used with Rollup and the Closure Compiler in advanced mode.
 
-Note that the Compiler creates a lot of noise.
+Note that the Compiler creates a lot of noise.  This needs to be fixed.
 
 Clone the project.
 

diff --git a/index.html b/index.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
-    <title>Using OpenLayers with Rollup</title>
+    <title>Using OpenLayers with Rollup and the Closure Compiler</title>
     <link rel="stylesheet" href="https://openlayers.org/en/latest/css/ol.css" type="text/css">
     <style>
       html, body {

diff --git a/_readme_.md b/_readme_.md
@@ -1,6 +1,6 @@
 # OpenLayers, Rollup, and Closure Compiler
 
-This example demonstrates how the `ol` package can be used with Rollup and the Closure Compiler in advanced mode.
+This example demonstrates how the [`ol` package](https://www.npmjs.com/package/ol) can be used with Rollup and the Closure Compiler in advanced mode.
 
 Note that the Compiler creates a lot of noise.
 

diff --git a/rollup.config.js b/rollup.config.js
@@ -1,6 +1,6 @@
-const closure = require('rollup-plugin-closure-compiler-js');
-const common = require('rollup-plugin-commonjs');
-const node = require('rollup-plugin-node-resolve');
+import closure from 'rollup-plugin-closure-compiler-js';
+import common from 'rollup-plugin-commonjs';
+import node from 'rollup-plugin-node-resolve';
 
 module.exports = {
   entry: 'main.js',

diff --git a/rollup.config.js b/rollup.config.js
@@ -10,6 +10,8 @@ module.exports = {
   plugins: [
     node(),
     common(),
-    closure()
+    closure({
+      compilationLevel: 'ADVANCED'
+    })
   ]
 };
diff --git a/package.json b/package.json
@@ -6,8 +6,8 @@
     "build": "rollup --config rollup.config.js"
   },
   "devDependencies": {
-    "google-closure-compiler-js": "^20161201.0.0",
     "rollup": "^0.38.0",
+    "rollup-plugin-closure-compiler-js": "^1.0.3",
     "rollup-plugin-commonjs": "^6.0.1",
     "rollup-plugin-node-resolve": "^2.0.0"
   },

diff --git a/rollup.config.js b/rollup.config.js
@@ -1,36 +1,15 @@
-const compile = require('google-closure-compiler-js').compile;
-const logger = require('google-closure-compiler-js/logger');
-const nodeResolve = require('rollup-plugin-node-resolve');
-const commonJs = require('rollup-plugin-commonjs');
+const closure = require('rollup-plugin-closure-compiler-js');
+const common = require('rollup-plugin-commonjs');
+const node = require('rollup-plugin-node-resolve');
 
 module.exports = {
   entry: 'main.js',
   targets: [
     {dest: 'bundle.js', format: 'es'}
   ],
   plugins: [
-    nodeResolve(),
-    commonJs(),
-    {
-      name: 'closure-compiler-js',
-      transformBundle: function(code) {
-        const flags = {
-          createSourceMap: true,
-          jsCode: [{
-            src: code
-          }],
-          compilationLevel: 'ADVANCED'
-        };
-        const output = compile(flags);
-        logger(flags, output);
-        if (output.errors.length) {
-          throw new Error(`Compilation Errors (${output.errors.length})`);
-        }
-        return {
-          code: output.compiledCode,
-          map: output.sourceMap
-        };
-      }
-    }
+    node(),
+    common(),
+    closure()
   ]
 };
diff --git a/_readme_.md b/_readme_.md
@@ -1,4 +1,4 @@
-# OpenLayers + Rollup
+# OpenLayers, Rollup, and Closure Compiler
 
 This example demonstrates how the `ol` package can be used with Rollup and the Closure Compiler in advanced mode.
 

diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,2 @@
+/node_modules/
+bundle.js
diff --git a/_readme_.md b/_readme_.md
@@ -0,0 +1,22 @@
+# OpenLayers + Rollup
+
+This example demonstrates how the `ol` package can be used with Rollup and the Closure Compiler in advanced mode.
+
+Note that the Compiler creates a lot of noise.
+
+Clone the project.
+
+    git clone [email protected]:32a5692bedac5254da24fa3b12072f35.git ol-rollup-closure
+
+Install the project dependencies.
+
+    cd ol-rollup-closure
+    npm install
+
+Create a bundle for the browser.
+
+    npm run build
+
+Open `index.html` to see the result.
+
+    open index.html
diff --git a/index.html b/index.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Using OpenLayers with Rollup</title>
+    <link rel="stylesheet" href="https://openlayers.org/en/latest/css/ol.css" type="text/css">
+    <style>
+      html, body {
+        margin: 0;
+        height: 100%;
+      }
+      #map {
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        width: 100%;
+      }
+    </style>
+  </head>
+  <body>
+    <div id="map"></div>
+    <script src="./bundle.js"></script>
+  </body>
+</html>
diff --git a/main.js b/main.js
@@ -0,0 +1,19 @@
+import Map from 'ol/map';
+import View from 'ol/view';
+import TileLayer from 'ol/layer/tile';
+import XYZ from 'ol/source/xyz';
+
+new Map({
+  target: 'map',
+  layers: [
+    new TileLayer({
+      source: new XYZ({
+        url: 'https://{a-c}.tile.openstreetmap.org/{z}/{x}/{y}.png'
+      })
+    })
+  ],
+  view: new View({
+    center: [0, 0],
+    zoom: 2
+  })
+});
diff --git a/package.json b/package.json
@@ -0,0 +1,17 @@
+{
+  "name": "ol-rollup-closure",
+  "version": "1.0.0",
+  "description": "Example using OpenLayers with Rollup and Closure Compiler",
+  "scripts": {
+    "build": "rollup --config rollup.config.js"
+  },
+  "devDependencies": {
+    "google-closure-compiler-js": "^20161201.0.0",
+    "rollup": "^0.38.0",
+    "rollup-plugin-commonjs": "^6.0.1",
+    "rollup-plugin-node-resolve": "^2.0.0"
+  },
+  "dependencies": {
+    "ol": "3.21.0-beta.11"
+  }
+}
diff --git a/rollup.config.js b/rollup.config.js
@@ -0,0 +1,36 @@
+const compile = require('google-closure-compiler-js').compile;
+const logger = require('google-closure-compiler-js/logger');
+const nodeResolve = require('rollup-plugin-node-resolve');
+const commonJs = require('rollup-plugin-commonjs');
+
+module.exports = {
+  entry: 'main.js',
+  targets: [
+    {dest: 'bundle.js', format: 'es'}
+  ],
+  plugins: [
+    nodeResolve(),
+    commonJs(),
+    {
+      name: 'closure-compiler-js',
+      transformBundle: function(code) {
+        const flags = {
+          createSourceMap: true,
+          jsCode: [{
+            src: code
+          }],
+          compilationLevel: 'ADVANCED'
+        };
+        const output = compile(flags);
+        logger(flags, output);
+        if (output.errors.length) {
+          throw new Error(`Compilation Errors (${output.errors.length})`);
+        }
+        return {
+          code: output.compiledCode,
+          map: output.sourceMap
+        };
+      }
+    }
+  ]
+};