diff --git a/examples/resources/common.js b/examples/resources/common.js
index a59685d3d5..62ed888dd7 100644
--- a/examples/resources/common.js
+++ b/examples/resources/common.js
@@ -74,7 +74,7 @@
             'index.html': {
               content: html
             },
-            'index.js': {
+            'main.js': {
               content: js
             },
             "package.json": {
diff --git a/examples/templates/example.html b/examples/templates/example.html
index b0c5cee4b7..5826db242f 100644
--- a/examples/templates/example.html
+++ b/examples/templates/example.html
@@ -130,6 +130,14 @@
         </div>
       </div>
 
+      <div class="row-fluid">
+        <div class="source-controls">
+          <a class="copy-button" id="copy-js-button" data-clipboard-target="#example-js-source"><i class="fa fa-clipboard"></i> Copy</a>
+        </div>
+        <pre><legend>main.js</legend><code id="example-js-source" class="language-js">import 'ol/ol.css';
+{{ js.source }}</code></pre>
+      </div>
+
       <div class="row-fluid">
         <div class="source-controls">
           <a class="copy-button" id="copy-html-button" data-clipboard-target="#example-html-source"><i class="fa fa-clipboard"></i> Copy</a>
@@ -149,17 +157,11 @@
 {{#if css.source}}{{ indent css.source spaces=6 }}{{/if}}    &lt;/style&gt;
   &lt;/head&gt;
   &lt;body&gt;
-{{ indent contents spaces=4 }}    &lt;script src="index.js"&gt;&lt;/script&gt;
+{{ indent contents spaces=4 }}    &lt;script src="main.js"&gt;&lt;/script&gt;
   &lt;/body&gt;
 &lt;/html&gt;</code></pre>
       </div>
-      <div class="row-fluid">
-        <div class="source-controls">
-          <a class="copy-button" id="copy-js-button" data-clipboard-target="#example-js-source"><i class="fa fa-clipboard"></i> Copy</a>
-        </div>
-        <pre><legend>index.js</legend><code id="example-js-source" class="language-js">import 'ol/ol.css';
-{{ js.source }}</code></pre>
-      </div>
+
 {{#if worker.source}}
       <div class="row-fluid">
         <div class="source-controls">
@@ -168,6 +170,7 @@
         <pre><legend>worker.js</legend><code id="example-worker-source" class="language-js">{{ worker.source }}</code></pre>
       </div>
 {{/if}}
+
       <div class="row-fluid">
         <div class="source-controls">
           <a class="copy-button" id="copy-pkg-button" data-clipboard-target="#example-pkg-source"><i class="fa fa-clipboard"></i> Copy</a>
@@ -175,6 +178,7 @@
         <pre><legend>package.json</legend><code id="example-pkg-source" class="language-js">{{ pkgJson }}</code></pre>
       </div>
     </div>
+
     <script src="./resources/common.js"></script>
     <script src="./resources/prism/prism.min.js"></script>
     {{{ js.tag }}}