《Webpack+Babel入门与实例详解》出版了

《Webpack+Babel入门与实例详解》将由电子工业出版社出版,这是一本针对零基础前端开发者讲解Webpack与Babel使用方法的图书。

本书由两大部分构成,第一部分介绍Webpack,第二部分介绍Babel。Webpack部分讲解了Webpack的安装、资源入口与出口、预处理器与插件的配置、开发环境与生产环境的配置、性能优化及构建原理等。Babel部分讲解了Babel入门知识、Babel的配置文件、预设与插件的选择、babel-polyfill的使用方法,以及@babel/preset-env和@babel/plugin-transform-runtime这两个核心配置项的使用方法,这一部分还会讲解Babel的原理及Babel插件的开发。最后,在附录中介绍了Module Federation与微前端,以及Babel 8前瞻等内容。
本书中主要使用的Webpack版本是v5.21.2,但对v5.0.0之后的版本都适用;主要使用的Babel版本是v7.13.10,但对v7.0.0之后的版本都适用。

本书的内容是对网站教程内容做了一次升级,也增加了原理方面的讲解,对原理方面感兴趣的读者可以购买该书。

另外,已与出版社沟通,已发表的内容不会删除,大家还可以继续阅读已有的教程。

推荐这些技术文章:

Babel的底层原理

学习babel:

简单来说:
一段ES6代码,首先经过词法分析器,把代码分割成一段一段的放入tokens数组里,然后进入真正的语法分析,分析完了以后 会用抽象语法树的形式表现出来,接着遍历这个语法树,
当访问到要转换的关键字的时候,应用插件进行转换,最后生成新的语法树,从而得到目标源代码。

 
参考文章:
深入讲解编译器每一步是什么:
https://blog.csdn....

Webpack 5 配置手册(从0开始)

针对新手入门搭建项目,Webpack5 配置手册(从0开始)

webpack安装顺序
1. `npm init -y`,初始化包管理文件 package.json
2. 新建src源代码目录
3. 新建index.html
4. `yarn add webpack webpack-cli`,安装webpack相关包
5. 在项目根目录中,创建webpack.config.js 的配置文件
...

前端工程化解决方案之Webpack的使用讲解

什么是webpack?

概念: webpack 是基于 node.js 开发出来的前端项目工程化的具体解决方案。
主要功能: 它提供了友好的前端模块化开发支持,以及代码压缩混淆、处理浏览器端 JavaScript 的兼容性、性能优化等强大的功能。
好处: 让程序员把工作的重心放到具体功能的实现上,提高了前端开发效率和项目的可维护性。
注意...

前端工程化 Webpack基础

前端工程化

模块化 (js模块化,css模块化,其他资源模块化)
组件化 (复用现有的UI结构、样式、行为)
规范化 (目录结构的划分、编码规范化、接口规范化、文档规范化、Git分支管理)
自动化 (自动化构建、自动部署、自动化测试)

webpack

前端项目工程化的具体解决方案
提供友好的前端模块化开发支持,以及代码压缩混淆、处理js兼容性、性能优化等强大功能

安装

初始化项目
np...

文章标题:《Webpack+Babel入门与实例详解》出版了
文章链接:https://www.dianjilingqu.com/3958.html
本文章来源于网络,版权归原作者所有,如果本站文章侵犯了您的权益,请联系我们删除,联系邮箱:saisai#email.cn,感谢支持理解。
THE END
< <上一篇
下一篇>>