在对项目做了一些优化处理后，再次无缓存打开可以发现网页几乎是秒开，平均耗时在1s以内 在这里总结记录一下，基本上都是一些常规可复制的优化手段，希望能为同样想优化网页性能的你提供思路~

1、脚手架的简单雏形；2、脚手架工具体系；3、手写自己的脚手架；4、yeoman 的使用；5、plop 的使用

webpack优化方向关于webpack的优化，通常我们是划分为开发体验和输出代码质量两方面来考虑的(一）优化开发体验通常是从优化构建速度和使用体验【开发环境】缩小文件的搜索范围（loader配置in

如今，CLI工具（如create-react-app或Vue -cli）已经为我们抽象了大部分配置，并提供了合理的默认设置。 即使那样，了解幕后工作原理还是有好处的，因为我们迟早需要对默认值进行一些调整。 在本文中中，我们会知道 webpack可以做什么，以及如何配置它以满足我…

在上一篇文章Webpack配置全解析介绍了Webpack中loader和plugins的一些基本用法，当loader和plugins使用较多后项目也会越来越耗时，因此这次我们继续学习如何优化webpack的配置来让我们的项目运行的更快耗时更短。 本文将从缩小文件搜索范围、减少打…

前一段时间我把webpack源码大概读了一遍，webpack 到4.x版本后，其源码已经比较庞大，对各种开发场景进行了高度抽象，阅读成本也愈发昂贵。 过度分析源码对于大家并没有太大的帮助。本文主要是想通过分析webpack的构建流程以及实现一个简单的webpack来让大家对we…

新建一个空文件夹，用于创建项目，使用 npm init 命令创建一个 package.json 文件。 输入这个命令后，终端会问你一系列诸如项目名称，项目描述，作者等信息，也可以使用 npm init -y 这个命令来一次生成 package.json 文件，这样终端不会询问你…

1.2 第三方组件和插件。按需加载需引入第三方组件 通过 include、exclude 来减少被处理的文件。 extension 配置之后可以不用在 require 或是 import 的时候加文件扩展名,会依次尝试添加扩展名进行匹配。 alias 通过配置别名可以加快 we…

大家好，我是神三元，今天通过一道面试题来和大家聊一聊webpack。 我相信，尽管很多开发者会根据官方文档进行webpack的相关配置，但仍然并不了解Webpack究竟是起什么作用的，在前端工程化扮演者什么角色，观念仍然简单地停留在“代码打包工具”上。真的是这样吗？ 相信这个定…