vue.js
Pages: 1/7 First page 1 2 3 4 5 6 7 Next page Final page [ View by Articles | List ]
Jun 10
首先,移除一些冷门的 feature(比如 filter、inline-template 等);

其次,引入 tree-shaking 的技术,减少打包体积。

第一点很好理解,所以这里我们来看看 tree-shaking,它的原理很简单,tree-shaking 依赖 ES2015 模块语法的静态结构(即 import 和 export),通过编译阶段的静态分析,找到没有引入的模块并打上标记。
举个例子,一个 math 模块定义了 2 个方法 square(x) 和 cube(x) :

我们在这个模块外面只引入了 cube 方法:

最终 math 模块会被 webpack 打包生成如下代码:

可以看到,未被引入的 square 模块被标记了, 然后压缩阶段会利用例如 uglify-js、terser 等压缩工具真正地删除这些没有用到的代码。

也就是说,利用 tree-shaking 技术,如果你在项目中没有引入 Transition、KeepAlive 等组件,那么它们对应的代码就不会打包,这样也就间接达到了减少项目引入的 Vue.js 包体积的目的。
Jul 31
遇到vue一直报错assigning to rvalue解决,一直以为是js代码的问题,后面找了很久的原因,才发现是在html的模板中v-model绑定的属性并没有在data属性中定义

v-model绑定错误引起
Apr 15
当然可以用vue-tap,vue-touch
这里讲的是原生的
给dom加个ref,例如demo
Apr 10








Tags: , , ,
Oct 7
使用webpack的插件DllPlugin加快打包速度
https://segmentfault.com/a/1190000012925212
链接无法访问直接下载离线网页
Download ( 1075 downloads)
Oct 7

webpack有各种包依赖,如果某个包版本之后会出现此类报错,修改package.json的包版本,重新执行npm i或者cnpm更新包到最新版本即可
Aug 21
本文基于 "element-ui": "^2.4.3", tree控件文档:https://element.faas.ele.me/#/zh-CN/component/tree#tree-shu-xing-kong-jian
这是个坑,如果遇到这个问题,先到git上看下人家的bug fix:https://github.com/ElemeFE/element/issues/4944  
然并卵,我这没搞定,通过下面方法搞定
Highslide JS
具体操作:
1、在tree外包一层div,给class=‘tree’
2、定义tree的样式
3、重写tree样式


代码:
template


style
Aug 21
在VUE单页应用项目开发过程树形中有一个需求,需要选中树形控件(可以是点击选中行或者复选框),但是只能选中一个。控件使用的是Element ui中的el-tree,但是找了一下并没有单选组件的API,慢慢琢磨中。
Highslide JS
1.el-tree组件
Highslide JS



2.主要是通过两个事件进行联合判断,

node-click节点被点击时的回调,check-change节点选中状态发生变化时的回调.

由于nodeClick被调用时checkChange也会被调用,因此需要一个editCheckId辅助避免出现因为联动导致选中状态错乱
Highslide JS

git项目地址:https://github.com/heyoju/vueDemo

Pages: 1/7 First page 1 2 3 4 5 6 7 Next page Final page [ View by Articles | List ]