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/disable-image-smoothing.js

@@ -1,10 +1,11 @@
 import Map from '../src/ol/Map.js';
-import View from '../src/ol/View.js';
 import TileLayer from '../src/ol/layer/Tile.js';
+import View from '../src/ol/View.js';
 import XYZ from '../src/ol/source/XYZ.js';
 
 const key = 'get_your_own_D6rA4zTHduk6KOKTXzGB';
-const attributions = '<a href="https://www.maptiler.com/copyright/" target="_blank">&copy; MapTiler</a> ' +
+const attributions =
+  '<a href="https://www.maptiler.com/copyright/" target="_blank">&copy; MapTiler</a> ' +
   '<a href="https://www.openstreetmap.org/copyright" target="_blank">&copy; OpenStreetMap contributors</a>';
 
 const disabledLayer = new TileLayer({
@@ -12,11 +13,12 @@ const disabledLayer = new TileLayer({
   className: 'ol-layer-dem',
   source: new XYZ({
     attributions: attributions,
-    url: 'https://api.maptiler.com/tiles/terrain-rgb/{z}/{x}/{y}.png?key=' + key,
+    url:
+      'https://api.maptiler.com/tiles/terrain-rgb/{z}/{x}/{y}.png?key=' + key,
     maxZoom: 10,
     crossOrigin: '',
-    imageSmoothing: false
-  })
+    imageSmoothing: false,
+  }),
 });
 
 const imagery = new TileLayer({
@@ -25,30 +27,36 @@ const imagery = new TileLayer({
     attributions: attributions,
     url: 'https://api.maptiler.com/tiles/satellite/{z}/{x}/{y}.jpg?key=' + key,
     maxZoom: 20,
-    crossOrigin: ''
-  })
+    crossOrigin: '',
+  }),
 });
 
 const enabledLayer = new TileLayer({
   source: new XYZ({
     attributions: attributions,
-    url: 'https://api.maptiler.com/tiles/terrain-rgb/{z}/{x}/{y}.png?key=' + key,
+    url:
+      'https://api.maptiler.com/tiles/terrain-rgb/{z}/{x}/{y}.png?key=' + key,
     maxZoom: 10,
-    crossOrigin: ''
-  })
+    crossOrigin: '',
+  }),
 });
 
-imagery.on('prerender', function(evt) {
+imagery.on('prerender', function (evt) {
   // use opaque background to conceal DEM while fully opaque imagery renders
   if (imagery.getOpacity() === 1) {
     evt.context.fillStyle = 'white';
-    evt.context.fillRect(0, 0, evt.context.canvas.width, evt.context.canvas.height);
+    evt.context.fillRect(
+      0,
+      0,
+      evt.context.canvas.width,
+      evt.context.canvas.height
+    );
   }
 });
 
 const control = document.getElementById('opacity');
 const output = document.getElementById('output');
-control.addEventListener('input', function() {
+control.addEventListener('input', function () {
   output.innerText = control.value;
   imagery.setOpacity(control.value / 100);
 });
@@ -58,50 +66,52 @@ imagery.setOpacity(control.value / 100);
 const view = new View({
   center: [6.893, 45.8295],
   zoom: 16,
-  projection: 'EPSG:4326'
+  projection: 'EPSG:4326',
 });
 
 const map1 = new Map({
   target: 'map1',
   layers: [disabledLayer, imagery],
-  view: view
+  view: view,
 });
 
 const map2 = new Map({
   target: 'map2',
   layers: [enabledLayer],
-  view: view
+  view: view,
 });
 
 const info1 = document.getElementById('info1');
 const info2 = document.getElementById('info2');
 
-const showElevations = function(evt) {
+const showElevations = function (evt) {
   if (evt.dragging) {
     return;
   }
   map1.forEachLayerAtPixel(
     evt.pixel,
-    function(layer, pixel) {
-      const height = -10000 + (pixel[0] * 256 * 256 + pixel[1] * 256 + pixel[2]) * 0.1;
+    function (layer, pixel) {
+      const height =
+        -10000 + (pixel[0] * 256 * 256 + pixel[1] * 256 + pixel[2]) * 0.1;
       info1.innerText = height.toFixed(1);
     },
     {
-      layerFilter: function(layer) {
+      layerFilter: function (layer) {
         return layer === disabledLayer;
-      }
+      },
     }
   );
   map2.forEachLayerAtPixel(
     evt.pixel,
-    function(layer, pixel) {
-      const height = -10000 + (pixel[0] * 256 * 256 + pixel[1] * 256 + pixel[2]) * 0.1;
+    function (layer, pixel) {
+      const height =
+        -10000 + (pixel[0] * 256 * 256 + pixel[1] * 256 + pixel[2]) * 0.1;
       info2.innerText = height.toFixed(1);
     },
     {
-      layerFilter: function(layer) {
+      layerFilter: function (layer) {
         return layer === enabledLayer;
-      }
+      },
     }
   );
 };