vue热重载
依据官网使用 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热重载的更多相关文章
- 从开发一款基于Vue技术栈的全栈热重载生产环境脚手架,我学到了什么
浏览文章前 这一期,我分享给大家三点看源码的小技巧,这也是从别的大佬那总结的. 被反复使用的代码 这样的代码是一个软件的重点函数,一个大神的写法有很多精华值得学习. 穿越时间的代码 如果一段代码10年 ...
- webpack使用webpack-dev-middleware进行热重载
新手,刚开始学习webpack,想使用webdevserver,但定制性太差,于是研究了一下使用webpack-dev-middleware进行指定. 根据文档https://www.npmjs.co ...
- webpack之带有可自动打开浏览器及热重载的基本配置
什么是Webpack WebPack可以看做是模块打包机:它做的事情是,分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并 ...
- KSFramework常见问题:Lua脚本热重载,内存状态数据丢失?
Lua热重载 内存数据在重载后会丢失 KSFramework中,所有的UI Lua脚本是可以重载的.脚本中的一些内存数据,在重载后会丢失,比如: -- 记录一个UI界面被打开了多少次 function ...
- KSFramework:集成U3D热重载框架 - README
KSFramework KEngine + SLua+ Framework = KSFramework KSFramework是一个整合KEngine.SLua的Unity 5开发框架,并为程序.美术 ...
- .Net 4.X 提前用上 .Net Core 的配置模式以及热重载配置
1. 前言 在提倡微服务及 Serverless 越来越普及的当下,在 .Net Core 之前,.Net 应用的配置模式往往依赖于一个名为 web.config 的 XML 文件,耦合性高,而可扩展 ...
- Node.js + gulp 合并静态页模版,文件更新自动热重载。浏览器可预览
github地址:https://github.com/Liaozhenting/template 使用的是ejs的语法.其实你用什么文件后缀都可以,都是按ejs来解析. 模板文件放在componen ...
- vue 热加载问题
今天是使用vue突然发现没有热加载功能了,然后网上查了一下,配置了一些东西,并没有什么用,然后发现电脑FQ影响 vue 热加载 关掉FQ软件就好了,具体原理我也不清
- lua热重载
热重载,就是不重新开unity让代码的变化直接看出来,一般在开发时候使用 lua中通过require导入的文件,最终都存在package.loaded这个table中.require会判断是否文件已经 ...
随机推荐
- 转:目前为止最全的微信小程序项目实例
wx-gesture-lock 微信小程序的手势密码 WXCustomSwitch 微信小程序自定义 Switch 组件模板 WeixinAppBdNovel 微信小程序demo:百度小说搜索 sh ...
- 【Linux 内核网络协议栈源码剖析】网络栈主要结构介绍(socket、sock、sk_buff,etc)
原文:http://blog.csdn.net/wenqian1991/article/details/46700177 通过前面的分析,可以发现,网络协议栈中的数据处理,都是基于各类结构体,所有有关 ...
- JSP 与 ACTION 之间的跳转
<script language="javascript">function delconfirm(url){ if(confirm("你确定要删除本条数据吗 ...
- I.MX6 mkuserimg.sh hacking
/*********************************************************************** * I.MX6 mkuserimg.sh hackin ...
- 优化Laravel的分页LIMIT和OFFSET调用
在分页系统中使用limit和offset是很常见的,它们通常也会和ORDER BY一起使用.索引对排序较有帮助,如果没有索引就需要大量的文件排序. 一个常见的问题是偏移量很大,比如查询使用了LIMIT ...
- bzoj4052
gcd 跟那道cf题是一个原理... 每一时刻我们最多有log个gcd,那么我们用map存储每种gcd最左端,每次和新的数gcd就更新新的gcd的最左端,然后更新答案 #include<bits ...
- AutoMapper封装类
/// <summary> /// AutoMapper扩展帮助类 /// </summary> public static class AutoMapperHelper { ...
- 基于《Hadoop权威指南 第三版》在Windows搭建Hadoop环境及运行第一个例子
在Windows环境上搭建Hadoop环境需要安装jdk1.7或以上版本.有了jdk之后,就可以进行Hadoop的搭建. 首先下载所需要的包: 1. Hadoop包: hadoop-2.5.2.tar ...
- 微型ORM:PetaPoco 学习资料整理
github地址:https://github.com/CollaboratingPlatypus/PetaPoco petapoco 实体中字段去掉关联(类似于EF中的NotMap) 微型ORM:P ...
- css覆盖select样式并添加小箭头
.select { border-radius: 5px; border: 1px #F4A627 solid; -webkit-appearance: none;//清除默认样式 backgroun ...