webpack是一个打包模块化JavaScript的工具，它会从入口模块出发，识别出源码中的模块化导入语句，递归地找出入口文件的所有依赖，将入口和其所有的依赖打包到一个单独的文件中。什么是loader

在这篇文章中，我们会使用 TypeScript, TSLint, Prettier, Jest 等构建并发布一个 NPM TypeScript 包。下面将会是我们要构建的： 下载 Node.js 和 NPM。 选一个好的包名。包名必须是 pascal-case 并且全部小写。因…

Tree-Shaking这个名词，很多前端coder已经耳熟能详了，它代表的大意就是删除没用到的代码。这样的功能对于构建大型应用时是非常好的，因为日常开发经常需要引用各种库。但大多时候仅仅使用了这些库的某些部分，并非需要全部，此时Tree-Shaking如果能帮助我们删除掉没有…

我第一次打开搜索引擎查询关于 Babel 的资料时，出现的竟然是关于 Babel 的传说。后来我花了小一天的时间去了解这个传说（来自《旧约圣经》）。 了解完这个神话之后，我后面就好好的去了解了一些有关 Babel 的知识，下面就是正题。 我们知道各个浏览器对 JavaScrip…

P6 前端必备脚手架 /CI 构建能力，顺着怪怪的思路往下看，然后获取文章末尾的源码，跟着源码操作一遍，就是一个完整的前端脚手架构建、发布、部署工程化项目。 下图中左边部分的项目初始化、模板拉取、项目运行部分，在《大前端进阶 Node.js》系列 P6 必备脚手架/CI 构建能…

Babel 是一个 JavaScript 编译器。 Babel通过转换，让我们写新版本的语法，转换到低版本，这样就可以在只支持低版本语法的浏览器里运行了。 Babel真厉害，它居然‘认识’代码、更改代码。那Babel就是操作代码的代码，酷。 学习Babel对我们能力的提升有很大…

vue-cli, create-react-app、react-native-cli 等都是非常优秀的脚手架，通过脚手架，我们可以快速初始化一个项目，无需自己从零开始一步步配置，有效提升开发体验。尽管这些脚手架非常优秀，但是未必是符合我们的实际应用的，我们可以定制一个属于自己的…

目前按需加载有两种方式实现。 babel-plugin-import是ant-design团队出的一个babel插件，主要用于模块的按需加载。其原理就是将直接引入的方式通过babel转化成按需引入的方式。如果css也需要按需加载，也会注入css引用代码。 babel-plugi…

说白了，vue-cli 其实就是一个基于webpack构建，可以让用户快速初始化一个项目的工具。 基本原理: vue-cli并非从无到有地凭空生成一个项目，而是通过下载/拉取(通过download-git-repo工具)已有的工程到本地，完成生成项目的工作。 而对于根据我个人对…