官方解释,是下一代JavaScript 语法的编译器。 既然是下一代Javascript的标准，浏览器因版本的不同对此会有兼容性问题，JavaScript的新的方法都不能使用，但是目前我们在项目开发一直提倡使用最新的语法糖编写，不但能减少代码量，而且async,await等新特…

既然标题说了是深入Babel，那我们就不说Babel各种用法了，什么babel-core，babel-runtime，babel-loader……如果你想了解这一部分内容，这类文章很多，推荐最近看到的一篇：一口(很长的)气了解 babel，可以说是相当详实完备了。 言归正传，这…

npm在前端开发流程中提供了非常完善的自动化工具链，已成为每个前端开发者必备的工具，但是同样由于其强大性导致很多前端开发者只会简单的使用它。本文将总结在日常开发中所需要的npm知识点，以便开发者们更好的将npm运用在实际开发中。 1. npm 处理 node_modules 目…

单元测试：指的是以原件的单元为单位，对软件进行测试。单元可以是一个函数，也可以是一个模块或一个组件，基本特征就是只要输入不变，必定返回同样的输出。一个软件越容易些单元测试，就表明它的模块化结构越好，给模块之间的耦合越弱。React的组件化和函数式编程，天生适合进行单元测试 TD…

1. 为什么要做前端测试 比起写注释，单元测试可能是更好的选择，通过运行测试代码，观察输入和输出，有时会比注释更能让别人理解你的代码（当然，重要的注释还是要写的。。。） 编写测试代码的过程，往往可以让我们深入思考业务流程，让我们的代码写的更完善和规范。 2. 什么是TDD和BD…

当我第一次听说TDD(Test-Driven Develop, 测试驱动开发)的时候，我首先想到的是测试小姐姐们想搞事情？后面发现这个玩意儿是想干掉测试，那好，下面开始让我们干掉这群整天给我们找bug...下面开始从简单的单元测试上手Jest测试框架。 初始化时会出现提示信息，…

基于同构代码的 SSR 指的是同一份代码（spa代码），既能在客户端运行，并渲染出页面，也可以在服务器端渲染为 html 字符串，并响应给客户端。 它与传统的服务器直出不同，传统的服务器直出指的是路由系统只存在于服务器端，在服务器端，任何一个页面都需要服务器响应内容。 根据上图…

webpack 对于每个前端儿来说都不陌生，它将每个静态文件当成一个模块，经过一系列的处理为我们整合出最后的需要的 js、css、图片、字体等文件。来自官网的图很形象的阐述了 webpack 的功能 —— bundle js / css / ... （打包全世界ヾ(◍°∇°◍)…

前言：记得我刚开始参与到公司项目的开发时，由于代码结构太乱被同事集体diss，而后被强烈要求打开eslint来开发，无奈之下陷入eslint的魔爪。但是当我打开eslint的时候，我真的是去他喵的，代码哪哪都给我爆红，然后我就偷偷把eslint关掉了（机智如我<(￣︶…