随着前端技术的不断发展，JavaScript作为一门脚本语言已经逐渐成为了构建Web应用的基础。而npm是目前最流行的JavaScript包管理工具，并且拥有着海量的依赖包供我们使用。在这篇文章中，我们将介绍一个名为easywebpack的npm包，它可以帮助我们更加轻松地搭建webpack配置。
easywebpack的介绍
easywebpack是一个基于webpack4的配置库。它的目标是将webpack繁琐的配置变得简单易用，提供一整套优化方案，对于新手来说，这是一个非常好的选择。
easywebpack提供了一些常用的webpack配置，例如：多入口、公共代码抽取、CDN加速等等。同时，easywebpack也支持一些常用的Webpack插件，如UglifyJS、autoprefixer等。
安装与使用
安装方式非常简单，只需要在你的项目根目录中执行以下命令，即可安装easywebpack。
--- ------- ----------- ----------
安装完成后，我们就可以在webpack.config.js文件中使用easywebpack，示例代码如下：
----- ----------- - -----------------------
-------------- - ------------------------------
------ -
------ -----------------
------ ----------------
--
------- -
----- ----------------------- --------
--------- ------------------
-
---使用easywebpack的优势
使用多入口
使用多入口可以更好地组织你的代码。通过使用easywebpack，你可以在webpack.config.js中定义多个entry点，在构建时根据entry的key值生成多个输出文件。
------ - ------ ----------------- ------ ---------------- --
上述配置表示我们将使用index.js作为入口生成index.bundle.js文件，同时，也会使用about.js作为入口生成about.bundle.js文件。
编译ES6+
easywebpack支持ES6+的语法。通过使用babel-loader和@babel/preset-env，我们可以将ES6+代码转化为ES5代码，从而实现浏览器兼容性的问题。
------- -
------ -
-
----- --------
-------- ---------------
---- -
------- ---------------
-------- -
-------- ---------------------
-
-
-
-
-优化
easywebpack内置了许多优化方案，这些方案可以帮助我们优化代码，并在生产环境中达到更好的性能。
例如，我们可以使用UglifyJS来压缩和混淆Javascript代码，通过使用mini-css-extract-plugin，将我们的CSS代码从Javascript中提取出来，从而减少文件的大小。
------------- -
---------- -
--- ----------------
------ -----
--------- -----
---------- ----
---
--- -------------------------
-
-CDN加速
通过使用cdn-assets-webpack-plugin，我们可以将我们的资源文件自动上传到CDN，并将资源地址改为CDN地址。这样可以减轻服务器负担，提升网页加载速度。
-------- -
--- -----------------------
----------- ----
--------- ---------------------------
---------- ---
------ --
--------- -------
--
-结论
easywebpack是一款非常易用的webpack配置库。如果你是一个新手，或者你只想快速地搭建一个webpack项目，easywebpack会是一个非常好的选择。通过本文的介绍，相信你已经对easywebpack有了一个初步的了解，希望它对你有所帮助。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/5f242087969256532b6b9b82