title: Javascript: How to create ES5 lib with ES6
body: <p>I'm working with GoogleAppsScript.<br>
  I'm trying to have my code locally in order to:<br>
  - use github<br>
  - write ES6</p>
  
  <p>I'm using webpack, and generating a bundle that will run in a html page is not a problem. <code>But I don't know for now how to generate a bundle that I will be able to copy/paste to GoogleAppsScript.</code></p>
  
  <p>The <strong>main.js</strong> file that I create is something like that :</p>
  
  <pre><code>import Point from './Point.js'
  import Test from './test.js'
  import SpreadSheetLogger from './SpreadSheetLogger.js'
  </code></pre>
  
  <p>And when I look to the <strong>bundle</strong> I have something like that:</p>
  
  <pre><code>/******/ (function(modules) { // webpackBootstrap
  /******/    // The module cache
  /******/    var installedModules = {};
  
  /******/    // The require function
  /******/    function __webpack_require__(moduleId) {
  
  /******/        // Check if module is in cache
  /******/        if(installedModules[moduleId])
  /******/            return installedModules[moduleId].exports;
  
  /******/        // Create a new module (and put it into the cache)
  /******/        var module = installedModules[moduleId] = {
  /******/            exports: {},
  /******/            id: moduleId,
  /******/            loaded: false
  /******/        };
  
  /******/        // Execute the module function
  /******/        modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
  
  /******/        // Flag the module as loaded
  /******/        module.loaded = true;
  
  /******/        // Return the exports of the module
  /******/        return module.exports;
  /******/    }
  
  
  /******/    // expose the modules object (__webpack_modules__)
  /******/    __webpack_require__.m = modules;
  
  /******/    // expose the module cache
  /******/    __webpack_require__.c = installedModules;
  
  /******/    // __webpack_public_path__
  /******/    __webpack_require__.p = "";
  
  /******/    // Load entry module and return exports
  /******/    return __webpack_require__(0);
  /******/ })
  /************************************************************************/
  /******/ ([
  /* 0 */
  /***/ function(module, exports, __webpack_require__) {
  
      'use strict';
  
      function _interopRequireDefault(obj) { return obj &amp;&amp; obj.__esModule ? obj : { 'default': obj }; }
  
      var _PointJs = __webpack_require__(1);
  
      var _PointJs2 = _interopRequireDefault(_PointJs);
  
      var _testJs = __webpack_require__(2);
  
      var _testJs2 = _interopRequireDefault(_testJs);
  
      var _SpreadSheetLoggerJs = __webpack_require__(4);
  
      var _SpreadSheetLoggerJs2 = _interopRequireDefault(_SpreadSheetLoggerJs);
  
      var a = new _PointJs2['default'](1, 2);
  
  /***/ },
  /* 1 */
  /***/ function(module, exports) {
  
      "use strict";
  
      Object.defineProperty(exports, "__esModule", {
          value: true
      });
  
      var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i &lt; props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
  
      function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
  
      var Point = (function () {
          function Point(x, y) {
              _classCallCheck(this, Point);
  
              this.x = x;
              this.y = y;
          }
  
          _createClass(Point, [{
              key: "toString",
              value: function toString() {
                  return "(" + this.x + ", " + this.y + ")";
              }
          }]);
  
          return Point;
      })();
  
      exports["default"] = Point;
      module.exports = exports["default"];
  
  /***/ },
  /* 2 */
  /***/ function(module, exports) {
  
      "use strict";
  
      [....]
  
  /***/ }
  /******/ ]);
  </code></pre>
  
  <p>So if I look summarize, it's something like that:</p>
  
  <pre><code>(function(modules) {
     WebPack code
  }([
     module1,
     module2,
     ...
  ])
  </code></pre>
  
  <p>But if I copy/paste that code to the javascript of a browser, I'm unable to use the different modules.  </p>
  
  <p>If I extract the <code>modules</code> from the bundle and <code>copy/paste</code> to the js console in a browser, this time it works.  </p>
  
  <hr>
  
  <p>I'm sure that webpack/babel can generate the code I need, but I can't find how.</p>