Skip to content

这是一个用于Vue-cli的loader,根据.vax.xml文件中配置,在Vue 中自动生成Vuex、Axios、Cache文件,前端工作将完全不需考虑ajax和vue的状态管理这些繁杂的事情,一步配置,代码自动生成。

terribleness/vax-loader

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

48 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

这是一个用于Vue-cli的loader,根据.vax.xml文件中配置,在Vue 中自动生成Vuex、Axios、Cache文件,前端工作将完全不需考虑ajax和vue的状态管理这些繁杂的事情,一步配置,代码自动生成。 vax-loader生成结构例子

npm install vax-loader

5步完成,修改下图红框处文件:

1

文件 修改
webpack.base.config.js文件的rules下增加vax-loader { test: /\.vax.xml$/, loader: [{ loader : 'babel-loader'},{ loader : 'vax-loader'}] } 查看下图例子
src目录下增加1.vax.xml后缀配置文件 具体查看1.vax.xml配置文件内容
App.vue等等页面文件中 根据配置,同vuex一样的调用,查看下图例子
main.js文件 var vax = require('./1.vax.xml'),并赋值给new Vuex.store(vax)查看下图例子
src目录下hooks存放hook文件(非必须) 具体查看hook钩子函数使用方法

2

4

3

9

配置项说明
vax(必填)根节点(必填)
table(必填且全局唯一)vuex中action、mutation、getter、state名字,多个请求则配置多个table
hook(选填)为hook文件地址,其中有5个钩子函数,可以修改进行中状态,如参数修改,返回值修改,触发其他commit等
axios(选填)配置则启用ajax请求,配置节点与axios配置保持一致,注意baseURL只会在发布版本启动,调试版本不会启动
cache(选填)可配置缓存时间,单位秒,存在localstorage中
vuex(选填)一定会根据name生成action,但是mutation、getter、state是否生成是根据这个节点是否配置来决定的

7

                 一般是不需要返回值的,如果返回false,则终止流程                    
钩子名称触发时间参数格式
beforePromise任何操作前p参数内容为{commit,state,param}三个参数commit是vuex中commit;state是vuex中state;param是dispatch传递的参数,如果要修改param,需要为p.param = 这样写法
beforeAxios开始触发axios前p参数内容为{commit,state,param}三个参数,同上
afterAxiosaxios后获得数据了p参数内容为{commit,state,param,data}四个参数,同上,data为返回数据,如果修改data,需要为p.data= 这样写法
beforeVuexvuex触发commit前p参数内容为{commit,state,param,data}四个参数,同上
afterVuexvuex触发commit后p参数内容为{commit,state,param,data}四个参数,同上
netErroraxios网络异常,不为200后p参数内容为{commit,state,param,data}四个参数,同上

About

这是一个用于Vue-cli的loader,根据.vax.xml文件中配置,在Vue 中自动生成Vuex、Axios、Cache文件,前端工作将完全不需考虑ajax和vue的状态管理这些繁杂的事情,一步配置,代码自动生成。

Resources

Stars

Watchers

Forks

Packages

No packages published