2018/5/8
1.[vue] 缺省图片+文字的基础组件
<template>
<div>
<div class="no-data">
<div class="no-data-img">
<slot name="data-img"></slot>
</div>
<slot name="data-text"></slot>
</div>
</div>
</template>
使用：
<no-data>
<img slot="data-img" src="xxxx" alt="pic" />
<span slot="data-text">暂无数据…</span>
</no-data>
2018/5/11
2.require-ensure 按需加载模块
语法：
require.ensure( dependencies:String[], callback:function( [require] ), [chunkName:String] )
//dependencies:依赖的模块数组
//callback:回调函数，该函数调用时会传一个require参数
//chunckName:模块名
//require.ensure的模块只会被下载下来，不会被执行，只有在回调函数使用require后，这个模板才会被执行
2018/6/6
vue 锚点滚动
2018/6/11
vue.js+webpack 为img src赋值问题
解决方法：
(1)使用img标签时
data () {
return {
img: require('path/to/your/source')
}
}
然后在template中
<img :src="img" />
（2）使用的是背景图
可以这样
data () {
return {
img: require('path/to/your/source')
}
}
<div :style="{backgroundImage: 'url(' + img + ')'}"></div>
或者直接在css中定义
background-image: url('path/to/your/source');
2018/7/23
Vue-Router导航守卫
2018/10/10
[vue] watch 和computed差别
1.computed 是计算一个新的属性，并将该属性挂载到 vm（Vue 实例）上，而 watch 是监听已经存在且已挂载到 vm 上的数据，所以用 watch 同样可以监听 computed 计算属性的变化（其它还有 data、props）
- computed 本质是一个惰性求值的观察者，具有缓存性，只有当依赖变化后，第一次访问 computed 属性，才会计算新的值，而 watch 则是当数据发生变化便会调用执行函数
3.从使用场景上说，computed 适用一个数据被多个数据影响，而 watch 适用一个数据影响多个数据；
2019/2/13
webpack
打包体积
为了减小包的打包体积，可以从以下几个方面进行优化：
提取第三方库或通过引用外部文件的方式引入第三方库；
代码压缩插件UglifyJsPlugin；
服务器启用gzip压缩；
按需加载资源文件 require.ensure；
优化devtool中的source-map；
剥离css文件，单独打包；
去除不必要插件，通常就是开发环境与生产环境用同一套配置文件导致；打包效率
开发环境采用增量构建，启用热更新；
开发环境不做无意义的工作如提取css计算文件hash等；
配置devtool；
选择合适的loader，个别loader开启cache 如babel-loader；
第三方库采用引入方式；
提取公共代码；
优化构建时的搜索路径 指明需要构建目录及不需要构建目录；
模块化引入需要的部分；
