add esModule support (#349)

* add alternative module exports

* add esModule test and docs

Author: HerringtonDarkholme

docs/en/options.md

@@ -73,3 +73,11 @@
 - type: `Object`
 
   Pass options to the template rendering engine (via [consolidate](https://github.com/tj/consolidate.js)) if you are using a non-html templating language.
+
+### esModule
+
+- ^9.4.3
+- type: `Boolean`
+- default: `undefined`
+
+  Whether to emit esModule compatible code. By default vue-loader will emit default export in commonjs format like `module.exports = ....`. When `esModule` is set to true, default export will be transpiled into `exports.__esModule = true; exports = ...`. Useful for interoperating with transpiler other than Bable, like TypeScript.

lib/loader.js

@@ -236,7 +236,11 @@ module.exports = function (content) {
         '")}\n'
     }
     // final export
-    output += '\nmodule.exports = __vue_exports__\n'
+    if (options.esModule) {
+      output += '\nexports.__esModule = true;\nexports["default"] = __vue_exports__\n'
+    } else {
+      output += '\nmodule.exports = __vue_exports__\n'
+    }
   } else {
     // inject-loader support
     output +=

test/test.js

@@ -348,4 +348,24 @@ describe('vue-loader', function () {
       done()
     })
   })
+
+  it('support es compatible modules', function (done) {
+    test({
+      entry: './test/fixtures/basic.vue',
+      vue: {
+        esModule: true
+      }
+    }, function (window, module, rawModule) {
+      expect(rawModule.__esModule).to.equal(true)
+      var vnode = mockRender(rawModule.default, {
+        msg: 'hi'
+      })
+      expect(vnode.tag).to.equal('h2')
+      expect(vnode.data.staticClass).to.equal('red')
+      expect(vnode.children[0]).to.equal('hi')
+
+      expect(rawModule.default.data().msg).to.contain('Hello from Component A!')
+      done()
+    })
+  })
 })