Make code prettier

This updates ESLint and our shared eslint-config-openlayers to use Prettier.  Most formatting changes were automatically applied with this:

    npm run lint -- --fix

A few manual changes were required:

 * In `examples/offscreen-canvas.js`, the `//eslint-disable-line` comment needed to be moved to the appropriate line to disable the error about the `'worker-loader!./offscreen-canvas.worker.js'` import.
 * In `examples/webpack/exapmle-builder.js`, spaces could not be added after a couple `function`s for some reason.  While editing this, I reworked `ExampleBuilder` to be a class.
 * In `src/ol/format/WMSGetFeatureInfo.js`, the `// @ts-ignore` comment needed to be moved down one line so it applied to the `parsersNS` argument.

examples/kml-earthquakes.js

@@ -1,14 +1,13 @@
-import Map from '../src/ol/Map.js';
-import View from '../src/ol/View.js';
 import KML from '../src/ol/format/KML.js';
-import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
+import Map from '../src/ol/Map.js';
 import Stamen from '../src/ol/source/Stamen.js';
 import VectorSource from '../src/ol/source/Vector.js';
+import View from '../src/ol/View.js';
 import {Circle as CircleStyle, Fill, Stroke, Style} from '../src/ol/style.js';
-
+import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
 
 const styleCache = {};
-const styleFunction = function(feature) {
+const styleFunction = function (feature) {
   // 2012_Earthquakes_Mag5.kml stores the magnitude of each earthquake in a
   // standards-violating <magnitude> tag in each Placemark.  We extract it from
   // the Placemark's name instead.
@@ -21,13 +20,13 @@ const styleFunction = function(feature) {
       image: new CircleStyle({
         radius: radius,
         fill: new Fill({
-          color: 'rgba(255, 153, 0, 0.4)'
+          color: 'rgba(255, 153, 0, 0.4)',
         }),
         stroke: new Stroke({
           color: 'rgba(255, 204, 0, 0.2)',
-          width: 1
-        })
-      })
+          width: 1,
+        }),
+      }),
     });
     styleCache[radius] = style;
   }
@@ -38,16 +37,16 @@ const vector = new VectorLayer({
   source: new VectorSource({
     url: 'data/kml/2012_Earthquakes_Mag5.kml',
     format: new KML({
-      extractStyles: false
-    })
+      extractStyles: false,
+    }),
   }),
-  style: styleFunction
+  style: styleFunction,
 });
 
 const raster = new TileLayer({
   source: new Stamen({
-    layer: 'toner'
-  })
+    layer: 'toner',
+  }),
 });
 
 const map = new Map({
@@ -55,26 +54,27 @@ const map = new Map({
   target: 'map',
   view: new View({
     center: [0, 0],
-    zoom: 2
-  })
+    zoom: 2,
+  }),
 });
 
 const info = $('#info');
 info.tooltip({
   animation: false,
-  trigger: 'manual'
+  trigger: 'manual',
 });
 
-const displayFeatureInfo = function(pixel) {
+const displayFeatureInfo = function (pixel) {
   info.css({
     left: pixel[0] + 'px',
-    top: (pixel[1] - 15) + 'px'
+    top: pixel[1] - 15 + 'px',
   });
-  const feature = map.forEachFeatureAtPixel(pixel, function(feature) {
+  const feature = map.forEachFeatureAtPixel(pixel, function (feature) {
     return feature;
   });
   if (feature) {
-    info.tooltip('hide')
+    info
+      .tooltip('hide')
       .attr('data-original-title', feature.get('name'))
       .tooltip('fixTitle')
       .tooltip('show');
@@ -83,7 +83,7 @@ const displayFeatureInfo = function(pixel) {
   }
 };
 
-map.on('pointermove', function(evt) {
+map.on('pointermove', function (evt) {
   if (evt.dragging) {
     info.tooltip('hide');
     return;
@@ -91,6 +91,6 @@ map.on('pointermove', function(evt) {
   displayFeatureInfo(map.getEventPixel(evt.originalEvent));
 });
 
-map.on('click', function(evt) {
+map.on('click', function (evt) {
   displayFeatureInfo(evt.pixel);
 });