index.js 6.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243
  1. var Vue // late bind
  2. var version
  3. var map = Object.create(null)
  4. if (typeof window !== 'undefined') {
  5. window.__VUE_HOT_MAP__ = map
  6. }
  7. var installed = false
  8. var isBrowserify = false
  9. var initHookName = 'beforeCreate'
  10. exports.install = function (vue, browserify) {
  11. if (installed) { return }
  12. installed = true
  13. Vue = vue.__esModule ? vue.default : vue
  14. version = Vue.version.split('.').map(Number)
  15. isBrowserify = browserify
  16. // compat with < 2.0.0-alpha.7
  17. if (Vue.config._lifecycleHooks.indexOf('init') > -1) {
  18. initHookName = 'init'
  19. }
  20. exports.compatible = version[0] >= 2
  21. if (!exports.compatible) {
  22. console.warn(
  23. '[HMR] You are using a version of vue-hot-reload-api that is ' +
  24. 'only compatible with Vue.js core ^2.0.0.'
  25. )
  26. return
  27. }
  28. }
  29. /**
  30. * Create a record for a hot module, which keeps track of its constructor
  31. * and instances
  32. *
  33. * @param {String} id
  34. * @param {Object} options
  35. */
  36. exports.createRecord = function (id, options) {
  37. if(map[id]) { return }
  38. var Ctor = null
  39. if (typeof options === 'function') {
  40. Ctor = options
  41. options = Ctor.options
  42. }
  43. makeOptionsHot(id, options)
  44. map[id] = {
  45. Ctor: Ctor,
  46. options: options,
  47. instances: []
  48. }
  49. }
  50. /**
  51. * Check if module is recorded
  52. *
  53. * @param {String} id
  54. */
  55. exports.isRecorded = function (id) {
  56. return typeof map[id] !== 'undefined'
  57. }
  58. /**
  59. * Make a Component options object hot.
  60. *
  61. * @param {String} id
  62. * @param {Object} options
  63. */
  64. function makeOptionsHot(id, options) {
  65. if (options.functional) {
  66. var render = options.render
  67. options.render = function (h, ctx) {
  68. var instances = map[id].instances
  69. if (ctx && instances.indexOf(ctx.parent) < 0) {
  70. instances.push(ctx.parent)
  71. }
  72. return render(h, ctx)
  73. }
  74. } else {
  75. injectHook(options, initHookName, function() {
  76. var record = map[id]
  77. if (!record.Ctor) {
  78. record.Ctor = this.constructor
  79. }
  80. record.instances.push(this)
  81. })
  82. injectHook(options, 'beforeDestroy', function() {
  83. var instances = map[id].instances
  84. instances.splice(instances.indexOf(this), 1)
  85. })
  86. }
  87. }
  88. /**
  89. * Inject a hook to a hot reloadable component so that
  90. * we can keep track of it.
  91. *
  92. * @param {Object} options
  93. * @param {String} name
  94. * @param {Function} hook
  95. */
  96. function injectHook(options, name, hook) {
  97. var existing = options[name]
  98. options[name] = existing
  99. ? Array.isArray(existing) ? existing.concat(hook) : [existing, hook]
  100. : [hook]
  101. }
  102. function tryWrap(fn) {
  103. return function (id, arg) {
  104. try {
  105. fn(id, arg)
  106. } catch (e) {
  107. console.error(e)
  108. console.warn(
  109. 'Something went wrong during Vue component hot-reload. Full reload required.'
  110. )
  111. }
  112. }
  113. }
  114. function updateOptions (oldOptions, newOptions) {
  115. for (var key in oldOptions) {
  116. if (!(key in newOptions)) {
  117. delete oldOptions[key]
  118. }
  119. }
  120. for (var key$1 in newOptions) {
  121. oldOptions[key$1] = newOptions[key$1]
  122. }
  123. }
  124. exports.rerender = tryWrap(function (id, options) {
  125. var record = map[id]
  126. if (!options) {
  127. record.instances.slice().forEach(function (instance) {
  128. instance.$forceUpdate()
  129. })
  130. return
  131. }
  132. if (typeof options === 'function') {
  133. options = options.options
  134. }
  135. if (record.Ctor) {
  136. record.Ctor.options.render = options.render
  137. record.Ctor.options.staticRenderFns = options.staticRenderFns
  138. record.instances.slice().forEach(function (instance) {
  139. instance.$options.render = options.render
  140. instance.$options.staticRenderFns = options.staticRenderFns
  141. // reset static trees
  142. // pre 2.5, all static trees are cached together on the instance
  143. if (instance._staticTrees) {
  144. instance._staticTrees = []
  145. }
  146. // 2.5.0
  147. if (Array.isArray(record.Ctor.options.cached)) {
  148. record.Ctor.options.cached = []
  149. }
  150. // 2.5.3
  151. if (Array.isArray(instance.$options.cached)) {
  152. instance.$options.cached = []
  153. }
  154. // post 2.5.4: v-once trees are cached on instance._staticTrees.
  155. // Pure static trees are cached on the staticRenderFns array
  156. // (both already reset above)
  157. instance.$forceUpdate()
  158. })
  159. } else {
  160. // functional or no instance created yet
  161. record.options.render = options.render
  162. record.options.staticRenderFns = options.staticRenderFns
  163. // handle functional component re-render
  164. if (record.options.functional) {
  165. // rerender with full options
  166. if (Object.keys(options).length > 2) {
  167. updateOptions(record.options, options)
  168. } else {
  169. // template-only rerender.
  170. // need to inject the style injection code for CSS modules
  171. // to work properly.
  172. var injectStyles = record.options._injectStyles
  173. if (injectStyles) {
  174. var render = options.render
  175. record.options.render = function (h, ctx) {
  176. injectStyles.call(ctx)
  177. return render(h, ctx)
  178. }
  179. }
  180. }
  181. record.options._Ctor = null
  182. // 2.5.3
  183. if (Array.isArray(record.options.cached)) {
  184. record.options.cached = []
  185. }
  186. record.instances.slice().forEach(function (instance) {
  187. instance.$forceUpdate()
  188. })
  189. }
  190. }
  191. })
  192. exports.reload = tryWrap(function (id, options) {
  193. var record = map[id]
  194. if (options) {
  195. if (typeof options === 'function') {
  196. options = options.options
  197. }
  198. makeOptionsHot(id, options)
  199. if (record.Ctor) {
  200. if (version[1] < 2) {
  201. // preserve pre 2.2 behavior for global mixin handling
  202. record.Ctor.extendOptions = options
  203. }
  204. var newCtor = record.Ctor.super.extend(options)
  205. record.Ctor.options = newCtor.options
  206. record.Ctor.cid = newCtor.cid
  207. record.Ctor.prototype = newCtor.prototype
  208. if (newCtor.release) {
  209. // temporary global mixin strategy used in < 2.0.0-alpha.6
  210. newCtor.release()
  211. }
  212. } else {
  213. updateOptions(record.options, options)
  214. }
  215. }
  216. record.instances.slice().forEach(function (instance) {
  217. if (instance.$vnode && instance.$vnode.context) {
  218. instance.$vnode.context.$forceUpdate()
  219. } else {
  220. console.warn(
  221. 'Root or manually mounted instance modified. Full reload required.'
  222. )
  223. }
  224. })
  225. })