依据官网使用 webpack 的 Hot Module Replacement API,Vuex 支持在开发过程中热重载 mutation、module、action 和 getter。你也可以在 Browserify 中使用 browserify-hmr 插件。

对于 mutation 和模块,你需要使用 store.hotUpdate() 方法:

// store.js
import Vue from 'vue'
import Vuex from 'vuex'
import mutations from './mutations'
import moduleA from './modules/a' Vue.use(Vuex) const state = { ... } const store = new Vuex.Store({
state,
mutations,
modules: {
a: moduleA
}
}) if (module.hot) {
// 使 action 和 mutation 成为可热重载模块
module.hot.accept(['./mutations', './modules/a'], () => {
// 获取更新后的模块
// 因为 babel 6 的模块编译格式问题,这里需要加上 `.default`
const newMutations = require('./mutations').default
const newModuleA = require('./modules/a').default
// 加载新模块
store.hotUpdate({
mutations: newMutations,
modules: {
a: newModuleA
}
})
})
}

vue热重载的更多相关文章

  1. 从开发一款基于Vue技术栈的全栈热重载生产环境脚手架,我学到了什么

    浏览文章前 这一期,我分享给大家三点看源码的小技巧,这也是从别的大佬那总结的. 被反复使用的代码 这样的代码是一个软件的重点函数,一个大神的写法有很多精华值得学习. 穿越时间的代码 如果一段代码10年 ...

  2. webpack使用webpack-dev-middleware进行热重载

    新手,刚开始学习webpack,想使用webdevserver,但定制性太差,于是研究了一下使用webpack-dev-middleware进行指定. 根据文档https://www.npmjs.co ...

  3. webpack之带有可自动打开浏览器及热重载的基本配置

    什么是Webpack WebPack可以看做是模块打包机:它做的事情是,分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并 ...

  4. KSFramework常见问题:Lua脚本热重载,内存状态数据丢失?

    Lua热重载 内存数据在重载后会丢失 KSFramework中,所有的UI Lua脚本是可以重载的.脚本中的一些内存数据,在重载后会丢失,比如: -- 记录一个UI界面被打开了多少次 function ...

  5. KSFramework:集成U3D热重载框架 - README

    KSFramework KEngine + SLua+ Framework = KSFramework KSFramework是一个整合KEngine.SLua的Unity 5开发框架,并为程序.美术 ...

  6. .Net 4.X 提前用上 .Net Core 的配置模式以及热重载配置

    1. 前言 在提倡微服务及 Serverless 越来越普及的当下,在 .Net Core 之前,.Net 应用的配置模式往往依赖于一个名为 web.config 的 XML 文件,耦合性高,而可扩展 ...

  7. Node.js + gulp 合并静态页模版,文件更新自动热重载。浏览器可预览

    github地址:https://github.com/Liaozhenting/template 使用的是ejs的语法.其实你用什么文件后缀都可以,都是按ejs来解析. 模板文件放在componen ...

  8. vue 热加载问题

    今天是使用vue突然发现没有热加载功能了,然后网上查了一下,配置了一些东西,并没有什么用,然后发现电脑FQ影响 vue 热加载 关掉FQ软件就好了,具体原理我也不清

  9. lua热重载

    热重载,就是不重新开unity让代码的变化直接看出来,一般在开发时候使用 lua中通过require导入的文件,最终都存在package.loaded这个table中.require会判断是否文件已经 ...

随机推荐

  1. python set dict tuple and list

    1 set 1.1 不变集合,frozenset 也就是说,集合中的元素不能删除,也不能增加. 1.2 两个集合之间的关系 isdisjoint()函数. 2 各个数据结构的不同显示 2.1 set ...

  2. (转)Java中JSON字符串与java对象的互换实例详解

    在开发过程中,经常需要和别的系统交换数据,数据交换的格式有XML.JSON等,JSON作为一个轻量级的数据格式比xml效率要高,XML需要很多的标签,这无疑占据了网络流量,JSON在这方面则做的很好, ...

  3. lambda和抽象类

    lambda的使用条件是‘一个接口仅有一个待实现的方法’: so,lambda不能使用在抽象类上,使用后或提示‘Target type of a lambda conversion must be a ...

  4. java泛型-类型擦除

    详细内容:参考java编程思想P373,p650. Java 泛型(Generic)的引入加强了参数类型的安全性,减少了类型的转换,但有一点需要注意:Java 的泛型在编译器有效,在运行期被删除,也就 ...

  5. Lightoj 1006 Hex-a-bonacci

    Given a code (not optimized), and necessary inputs, you have to find the output of the code for the ...

  6. JS处理空格

    JS处理空格 2010-10-27 11:48:32|  分类: 技术-JS |  标签:js  空格  |字号 订阅     /*删除两侧空格*/ function trim(ui){        ...

  7. POJ - 2418 Hardwood Species(map,trie,BST)

    1.输入若干行树名,输入结束后,按字典序输出树名及其所占百分比. 2.多种方法:map,trie,BST 3. map: #include<iostream> #include<st ...

  8. next数组求最小循环节

    1.kmp产生的next数组: 最小循环节(长度)=len-next[len]; 证明: ----------------------- ----------------------- k    m ...

  9. NABCD项目需求报告

    项目:记账小账本 N:need 需求 根据我们的调查,很多人虽然知道记账有很多的好处,但是因为种种的原因,我们都没能养成记账的好习惯,所以我们所做的记账小软件,说到底是一个行为养成类的软件,而这类软件 ...

  10. gevent 协程 使用

    Python通过yield提供了对协程的基本支持,但是不完全.而第三方的gevent为Python提供了比较完善的协程支持. gevent是第三方库,通过greenlet实现协程,其基本思想是: 当一 ...