feat: basic hot reload

lib/hotReload.js

@@ -0,0 +1,20 @@
+const hotReloadAPIPath = require.resolve('vue-hot-reload-api')
+
+module.exports = function genHotReloadCode (id, functional) {
+  // TODO handle CSSModules and style injection disposal
+  return `
+/* hot reload */
+if (module.hot) {
+  var api = require('${hotReloadAPIPath}')
+  api.install(require('vue'))
+  if (api.compatible) {
+    module.hot.accept()
+    if (!module.hot.data) {
+      api.createRecord('${id}', component.options)
+    } else {
+      api.${functional ? `rerender` : `reload`}('${id}', component.options)
+    }
+  }
+}
+  `.trim()
+}

lib/index.js

@@ -5,6 +5,7 @@ const qs = require('querystring')
 const loaderUtils = require('loader-utils')
 const selectBlock = require('./selector')
 const plugin = require('./plugin')
+const genHotReloadCode = require('./hotReload')
 const componentNormalizerPath = require.resolve('./runtime/componentNormalizer')
 
 module.exports = function (source) {
@@ -119,7 +120,7 @@ var component = normalizer(
   ${isServer ? JSON.stringify(hash(request)) : `null`}
   ${incomingQuery.shadow ? `,true` : ``}
 )
-`.trim()
+  `.trim()
 
   if (descriptor.customBlocks && descriptor.customBlocks.length) {
     // TODO custom blocks
@@ -130,7 +131,7 @@ var component = normalizer(
   }
 
   if (needsHotReload) {
-    // TODO hot reload
+    code += genHotReloadCode(id, hasFunctional)
   }
 
   code += `\nexport default component.exports`

package.json

@@ -54,6 +54,7 @@
     "vue-template-compiler": "^2.5.16",
     "webpack": "^4.1.0",
     "webpack-cli": "^2.0.10",
+    "webpack-dev-server": "^3.1.1",
     "webpack-merge": "^4.1.2",
     "yorkie": "^1.0.3"
   },