开发微总结

2018/5/8
1.[vue] 缺省图片+文字的基础组件

使用：

  
  暂无数据…

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中

（2）使用的是背景图

可以这样

data () {
    return {
        img: require('path/to/your/source')
    }
}



或者直接在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）

2. computed 本质是一个惰性求值的观察者，具有缓存性，只有当依赖变化后，第一次访问 computed 属性，才会计算新的值，而 watch 则是当数据发生变化便会调用执行函数
   3.从使用场景上说，computed 适用一个数据被多个数据影响，而 watch 适用一个数据影响多个数据；

2019/2/13
webpack

1. 打包体积
   为了减小包的打包体积，可以从以下几个方面进行优化：
   提取第三方库或通过引用外部文件的方式引入第三方库；
   代码压缩插件UglifyJsPlugin；
   服务器启用gzip压缩；
   按需加载资源文件 require.ensure；
   优化devtool中的source-map；
   剥离css文件，单独打包；
   去除不必要插件，通常就是开发环境与生产环境用同一套配置文件导致；

2. 打包效率
   开发环境采用增量构建，启用热更新；
   开发环境不做无意义的工作如提取css计算文件hash等；
   配置devtool；
   选择合适的loader，个别loader开启cache 如babel-loader；
   第三方库采用引入方式；
   提取公共代码；
   优化构建时的搜索路径 指明需要构建目录及不需要构建目录；
   模块化引入需要的部分；