title: How to use OpenLayers 6.5 examples?
body: <p>The OpenLayers community provides many examples on this page :
  <a href="https://openlayers.org/en/latest/examples/" rel="nofollow noreferrer">https://openlayers.org/en/latest/examples/</a></p>
  <p>My goal is to be able to understand each example (for example : Draw Features) and then use the technics in my own website project.</p>
  <p>The problem is that when I work with the code they provide below each example, it does not work</p>
  <p>Then, I downloaded the ol package from here :
  <a href="https://openlayers.org/download/" rel="nofollow noreferrer">https://openlayers.org/download/</a></p>
  <p>The problem is that for each example there is 3 files : &quot;.js&quot; file, &quot;.map.js&quot; file and &quot;.html&quot; file. (see picture)</p>
  <p><img src="https://i.stack.imgur.com/FEpz5.jpg" alt="enter image description here" /></p>
  <p>the problem is that the &quot;.js&quot; file contain some code that I could not understand
  but I think it refers to other functions in a separate common.js file there in the folder.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>(window.webpackJsonp = window.webpackJsonp || []).push([
      [29], {
          22622: function(e, n, t) {
              "use strict";
              t.r(n);
              var o, a = t(66),
                  c = t(3),
                  r = t(2),
                  w = t(9),
                  u = t(10),
                  i = t(5),
                  d = t(19),
                  s = new i.a({
                      source: new w.b
                  }),
                  p = new u.a({
                      wrapX: !1
                  }),
                  m = new d.a({
                      source: p
                  }),
                  map = new c.a({
                      layers: [s, m],
                      target: "map",
                      view: new r.a({
                          center: [-11e6, 46e5],
                          zoom: 4
                      })
                  }),
                  l = document.getElementById("type");
  
              function y() {
                  "None" !== l.value &amp;&amp; (o = new a.c({
                      source: p,
                      type: l.value
                  }), map.addInteraction(o))
              }
              l.onchange = function() {
                  map.removeInteraction(o), y()
              }, document.getElementById("undo").addEventListener("click", (function() {
                  o.removeLastPoint()
              })), y()
          }
      },
      [
          [22622, 0]
      ]
  ]);
  //# sourceMappingURL=draw-features.js.map</code></pre>
  </div>
  </div>
  </p>
  <p>The problem is that common.js file is very long, weird and delicate to understand how it works, see below snippet</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>!(function (t) {
    function e(e) {
      for (
        var r, a, s = e[0], h = e[1], l = e[2], u = 0, p = [];
        u &lt; s.length;
        u++
      )
        (a = s[u]),
          Object.prototype.hasOwnProperty.call(n, a) &amp;&amp; n[a] &amp;&amp; p.push(n[a][0]),
          (n[a] = 0);
      for (r in h) Object.prototype.hasOwnProperty.call(h, r) &amp;&amp; (t[r] = h[r]);
      for (c &amp;&amp; c(e); p.length; ) p.shift()();
      return o.push.apply(o, l || []), i();
    }
  
    function i() {
      for (var t, e = 0; e &lt; o.length; e++) {
        for (var i = o[e], r = !0, s = 1; s &lt; i.length; s++) {
          var h = i[s];
          0 !== n[h] &amp;&amp; (r = !1);
        }
        r &amp;&amp; (o.splice(e--, 1), (t = a((a.s = i[0]))));
      }
      return t;
    }
    var r = {},
      n = {
        0: 0,
      },
      o = [];</code></pre>
  </div>
  </div>
  
  My questions are :</p>
  <ul>
  <li>How to use OpenLayers example in order to make my own website</li>
  <li>Is Common.js created manually or automatically</li>
  <li>is there any way to get a separated working code for each Ol example</li>
  </ul>