ng-hot-loader 前言 webpack-dev-server自带支持模块热替换特性(HMR)，不刷新页面实现代码局部更新，使用HMR可以大幅提升开发效率。 实现目标 [x] 样式热替换 -- style-loader本身即支持HMR，建议依赖库css直接解析出文件link，降低热替换成本 [x] 模板热替换 [x] 服务热替换 [x] 过滤器热替换 -- expression 变动才会重...

近期项目中需要可视化图表，恰好 echarts 发布新版本，便选择了 echarts作为基础图表库。但是github 上基于 echarts 的封装大部分为基于2.X版本的封装，与项目不符合。

browserfify长处在于使用node-flavor模块规范，而不是requirejs使用的AMD模块规范，以及seajs使用的CMD模块规范。打包处理后一般单页面仅为一个js文件（当然，文件size相当可观）。相对于其他规范，最直接的好处是可以直接使用Node生态中前后端功用模块，例如uniq, underscore等不依赖Node环境的包，以及superagent这种...

因为众所周知的原因，使用node，官方NPM仓库安装依赖包是个看人品的事情，不过有万能的淘宝，所以需要部分调整就可以避免这些原因。（以下内容osx, centos下测试通过）

angular的E2E全面采用protractor作为测试工具，放弃原来的scenario runner。工具基于selenium，webDriverJS，使用node封装而来。在安装路上遇到不少问题，所以单独记录安装过程。

Stream模块有四个类，Readable, Writable, Duplex, Transform，Transform可以看做自成体系的子类。从使用角度来说，模块定义的类都为基类，是不具备直接使用条件的，需要程序实现相关接口方可使用。

使用angular开发项目，进行前后端联调时，常见的状态是所有静态文件放于nginx根目录下，使用nginx的反向代理功能调用真实API。因为经验缺乏，之前调试之时，不得不在静态文件目录下直接修改文件，修复成功后再回传代码线的方式，带来诸多不便，也相当不合理，所以周末搞出来自己的处理方案，记录如下。如有其它解决方案...

前言 Angularjs提供多种模板加载方案。 最基础的为通过预先声明路径的方式，通过Ajax获取。 使用诸如gulp-html2js构建工具，将HTML模板转化为js文件使用。 使用script标签引入。 一般实际情况下，开发时使用第一种方式，部署时采取第二种方式，不会采用第三种方式。本文简要说明一下标签引入模板。Angularjs本身支持的标...

Turn a regular node function into one which returns a thunk, useful for generator-based flow control such as co.

上述为最开始写的测试用例，理所当然的以为第一个pass，第二个fail。结果是第一个pass，第二个timeout error。由于暂时性短路，没有发现问题所在，后在repo询问后得知结果。

koa依赖co模块来实现流程控制。co4.0.0版本之后，开始进行Promise化，维护团队表示可能会逐步放弃对其他yieldable对象的支持。到ES7的async，await之时（吐槽语：ES6还没发布，Node环境稍微好些，浏览器环境看不到边际），可能不再利用generator的hack来做流程控制，而是使用标准方法。

Nodejs在0.11.x后开始支持generator，就是ES6中会正式定稿的规范。然后就有了基于此特性的koa框架，也就很多人所说的，以更优雅的方式进行流程控制。个人意见，如果没有过多的回调，没有大量的“恶魔金字塔”，还是建议使用Express框架，更易上手，中间件选择更多。接触koa没几天，发现知识点略多略多，逐一击破。

Angularjs的思维方式是通过数据带动DOM变动，通常依托指令与控制器的配合来实现。就表单操作上，提供了几乎完备的操作体验。对于官方没有实现的功能，只能自己来实现。比如说在做表单校验时，使用编码方式实现控件的focus。

通常，使用angular做表单验证，一般都是把验证规则单独写为service，然后通过依赖注入的方式调用。在个别情况下，例如用户注册表单，需要根据用户输入给出不同提示信息，使用service略显不合适宜，所以可以采用指令的方式。

Angularjs相对来说算是上手难度较大的框架之一，官方提供的angular-seed自觉不够好用，对新手也非常不友好，所以才会自己搞angular-boilerplate出来，无论是用以学习，还是做简单组件开发，可以节省不少时间。 地址：[链接]

H5之前，一个URL对应一个页面，无论以何种方式修改地址栏地址，都会导致页面完全刷新，无论跳转页面之间是否有关联。简单来说，H5的history API提供接口，可以使用javascript修改地址栏路径，而不刷新页面。

高级语言基本上都有类的概念，而javascript因为各种原因相对比较特别，并没有明确的class类声明方式（ES6暂不涉及），而是通过构造函数变相实现。推荐《javascript高级程序设计》，对类继承有详细介绍。书中涉及继承方式多达数种，意味着继承的灵活性。但灵活性，有时也意味着复杂性。总结来说，继承方案本文介绍两种即...

关于执行脚本，肯定会想到shell脚本，借助于存量庞大的资源储备，生产力很不错。但上手难度大，语法略显逆天，也是不争的事实。如果可以使用javascript来写脚本，对于前端工程师来说可谓减轻不少工作量。因为工作需求，需要做HTTP LOG分析，虽然最后还是会采用shell脚本，但是会实现一个Node版本。

Express提供了三种路由方案，path, Router, route。中间件哲学，每个负责具体业务实现，都与中间件行为相似。同时提供了三种路由方式，各有优劣。

在做nodejs开发中，难免会遇到HTTP相关的测试，一般需要依赖模块supertest或者superagent,supertest依赖后者。

前端开发近两年工程化大幅飙升。随着Nodejs大放异彩，静态文件处理不再需要其他语言辅助。主要的两大工具即为基于文件的grunt，基于流的gulp。简单来说，如果需要的只是文件处理，gulp绝对首选。如果是其他依赖于文件的任务管理，例如测试（karma，mocha），推荐使用grunt。

coffeescript，某种程度上来说，只是一个单纯的预处理器，而其对javascript编写带来的便利性甚至不如less对于css开发带来的效率提升。先说个人意见，不适合场景如下：

前言 mocha生成测试率报告，不需要繁杂的配置，配置istanbul直接使用就ok。 依赖工具 istanbul mocha 测试命令 {代码...} {代码...} 注意事项 window不兼容，目前会报错 最好不要使用全局安装mocha， istanbul的方式进行测试 如果需要与 ([链接])结合使用，可以参考 ([链接])的 .travis.yml 配置文件。

前端开发近两年工程化大幅飙升。随着Nodejs大放异彩，静态文件处理不再需要其他语言辅助。主要的两大工具即为基于文件的grunt，基于流的gulp。简单来说，如果需要的只是文件处理，gulp绝对首选。如果是其他依赖于文件的任务管理，例如测试（karma，mocha），推荐使用grunt。

如有排版乱掉，参阅[链接]。 前端测试框架推荐karma，断言库推荐jasmine断言库，再配合jasmine-ajax, jasmine-jquery扩展，可以实现比较完整的前端测试。关于jquery的测试场景可能不多见，但有备无患。

文件拖动上传，对于个别应用场景十分有效，实现起来也并不难。参见 “浏览器图片预览 --[链接]"。 现在更进一步，做到文件夹拖动。Filsesystem不是w3c标准，所以chrome浏览器支持度良好，其它浏览器大部分不支持。以下内容全基于chrome 36 版本测试成功。

参考资料 发布/订阅：[链接] 自定义事件一： [链接] 自定义事件二： [链接] 二维码 前言 前端异步编程主要包括回调函数，事件监听，promise/defer。 在前端异步编程的基础上，能够实现发布/订阅（Publish/subscribe）消息范式。消息的发送者（发布者）不是计划发送其消息给特定的接收者（订阅者）。订阅者对一个或多个类...

[链接] grunt-contrib-connect connect依赖版本为V2.19.6.（2014/08/07) base只能遍历文件，不能深层遍历文件夹,所以路径下的文件可以通过浏览器访问，路径下的文件夹下的文件不能访问。 {代码...} keepalive设置为true，进程不会执行后自动退出。 middleware为中间件数组，可以自定义中间件。源码如下，如果传入的middl...

总体概述 jasmine-ajax主要五个对象组成： 请求伪造对象(FackXMLHttpRequest)： {代码...} 请求跟踪对象(RequestTracker)： {代码...} 请求拦截对象(RequestStub)：用作对伪造的AJAX请求做出响应。 {代码...} 请求拦截跟踪对象(StubTracker): {代码...} 参数解析(ParamParser)： {代码...} 辅助函数 arrayContains {代码...

如有排版错误，请查阅[链接] 官方文档： jasmine : [链接] jasmine-ajax : [链接] framework未定义 昨日遇到问题，在local安装后，对应框架未能引入，需要全局安装后方可排除。可能是个人之前理解有误。 karma-jasmine-ajax说明 安装karma-jasmine-ajax插件，如下为其package.json文件，npm install之前，去掉tags，即可...