正文
- Loader直译为"加载器"。Webpack将⼀切⽂件视为模块,但是Webpack原⽣是只能解析JavaScript⽂件,如果想将其他⽂件也打包的话,就会⽤到Loader。所以Loader的作⽤是让Webpack拥有了加载和解析非JavaScript文件的能力;
- Plugin直译为"插件"。Plugin可以扩展Webpack的功能,让Webpack具有灵活性。在Webpack运⾏的⽣命周期中会⼴播出许多事件,Plugin可以监听这些事件,在合适的时机通过Webpack提供的API改变输出结果。
2、WebPack中bundle,chunk,module的作用是什么?
- bundle 是由Webpack打包出来的文件;
- chunk 代码块,一个chunk由多个模块组合⽽成,⽤于代码的合并和分割;
- module 是开发中的单个模块,在Webpack中⼀个模块对应⼀个⽂件,Webpack会从配置的entry中递归开始找出所有依赖的模块。
3、Less转换Css过程
less模块通过Webpack中Less-Loader将LESS文件转义成Css文件
4、打包原理
这里分享一份由字节前端面试官整理的「2021大厂前端面试手册」,内容囊括Html、CSS、Javascript、Vue、HTTP、浏览器面试题、数据结构与算法。全部整理在下方文档中,共计111道
HTML
- HTML5有哪些新特性?
- Doctype作⽤? 严格模式与混杂模式如何区分?它们有何意义?
- 如何实现浏览器内多个标签页之间的通信?
- ⾏内元素有哪些?块级元素有哪些? 空(void)元素有那些?⾏内元 素和块级元素有什么区别?
- 简述⼀下src与href的区别?
- cookies,sessionStorage,localStorage 的区别?
- HTML5 的离线储存的使用和原理?
- 怎样处理 移动端 1px 被 渲染成 2px 问题?
- iframe 的优缺点?
- Canvas 和 SVG 图形的区别是什么?
JavaScript
- 问:0.1 + 0.2 === 0.3 嘛?为什么?
- JS 数据类型
- 写代码:实现函数能够深度克隆基本类型
- 事件流
- 事件是如何实现的?
- new 一个函数发生了什么
- 什么是作用域?
- JS 隐式转换,显示转换
- 了解 this 嘛,bind,call,apply 具体指什么
- 手写 bind、apply、call
- setTimeout(fn, 0)多久才执行,Event Loop
- 手写题:Promise 原理
- 说一下原型链和原型链的继承吧
- 数组能够调用的函数有那些?
- PWA使用过吗?serviceWorker的使用原理是啥?
- ES6 之前使用 prototype 实现继承
- 箭头函数和普通函数有啥区别?箭头函数能当构造函数吗?
- 事件循环机制 (Event Loop)