前端面试之webpack面试常见问题

时间: 2018-04-03阅读: 3829标签: 面试

概念问题一:什么是webpack和grunt和gulp有什么不同

答案:Webpack是一个模块打包器,他可以递归的打包项目中的所有模块,最终生成几个打包后的文件。他和其他的工具最大的不同在于他支持code-splitting、模块化(AMD,ESM,Commonjs)、全局分析。


概念问题二:什么是bundle,什么是chunk,什么是module?

答案:bundle是由webpack打包出来的文件,chunk是指webpack在进行模块的依赖分析的时候,代码分割出来的代码块。module是开发中的单个模块。


概念问题三:什么是Loader?什么是Plugin?

答案:
1)Loaders是用来告诉webpack如何转化处理某一类型的文件,并且引入到打包出的文件中
2)Plugin是用来自定义webpack打包过程的方式,一个插件是含有apply方法的一个对象,通过这个方法可以参与到整个webpack打包的各个流程(生命周期)。

配置问题:如何可以自动生成webpack配置?

答案: webpack-cli /vue-cli /etc ...脚手架工具


开发问题一:webpack-dev-server和http服务器如nginx有什么区别?

答案:webpack-dev-server使用内存来存储webpack开发环境下的打包文件,并且可以使用模块热更新,他比传统的http服务对开发更加简单高效。


开发问题二:什么 是模块热更新?

答案:模块热更新是webpack的一个功能,他可以使得代码修改过后不用刷新浏览器就可以更新,是高级版的自动刷新浏览器。


优化问题一:什么是长缓存?在webpack中如何做到长缓存优化?

答案:浏览器在用户访问页面的时候,为了加快加载速度,会对用户访问的静态资源进行存储,但是每一次代码升级或是更新,都需要浏览器去下载新的代码,最方便和简单的更新方式就是引入新的文件名称。在webpack中可以在output纵输出的文件指定chunkhash,并且分离经常更新的代码和框架代码。通过NameModulesPlugin或是HashedModuleIdsPlugin使再次打包文件名不变。


优化问题二:什么是Tree-shaking?css可以Tree-shaking吗

答案:Tree-shaking是指在打包中去除那些引入了,但是在代码中没有被用到的那些死代码。在webpack中Tree-shaking是通过uglifySPlugin来Tree-shaking jscss需要使用Purify-CSS。


来源:https://segmentfault.com/a/1190000014148611?utm_source=index-hottest

站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

链接: http://www.fly63.com/article/detial/582

每个 JavaScript 工程师都应当知道的 10 个面试题

多问问应聘者高层次的知识点,如果能讲清楚这些概念,就说明即使应聘者没怎么接触过 JavaScript,也能够在短短几个星期之内就把语言细节和语法之类的东西弄清楚。

前端:经典的递归面试题

细胞分裂 有一个细胞 每一个小时分裂一次,一次分裂一个子细胞,第三个小时后会死亡。那么n个小时候有多少细胞?这个问题的核心就是三个小时为一个周期

23 个 Vue.js 初级面试题

使用渐进式框架的代价很小,从而使现有项目(使用其他技术构建的项目)更容易采用并迁移到新框架。 Vue.js 是一个渐进式框架,因为你可以逐步将其引入现有应用,而不必从头开始重写整个程序。

面试时如何优雅地自我介绍?

有读者提问:如何在面试当中做一个最好的自我介绍?结合了一下自己面试以及面试别人(模拟面试)的一些经验,简单总结了几点,供大家参考。

20行实现一个Promise

在面试的时候,经常会有面试官让你实现一个Promise,如果参照A+规范来实现的话,可能面到天黑都结束不了。说到Promise,我们首先想到的最核心的功能就是异步链式调用,本篇文章就带你用20行代码实现一个可以异步链式调用的Promise。

一位程序员妹纸讲述她是如何拿到美团offer的?

美团,我是在拉勾网上投的简历,之前也投过一次,简历都没通过删选,后来让学姐帮我改了一下简历,重新投另一个部门,获得了面试机会。

10道css综合面试问题

css sprite是什么,有什么优缺点;display: none; 与 visibility: hidden; 的区别;清除浮动的几种方式;css3有哪些新特性;position的值, relative和absolute定位原点是

面试web前端开发需要注意哪些?

针对面试时注意的一些关键的点。面试流程大概流程是:注:可能有些公司的流程不一样,但是都逃不过这几个过程。在简历制作方面需要说一下,一般培训机构都会让学员写上2-5年工作经验

如何招聘一名优秀的前端人员?

招聘肯定要有标准,这样我们才能更快的找到我们需要的人才。在近期的大量面试中,我觉得有4个方面是必不可少的。代码能力强;经验丰富;性格合适;能融入团队

React常见面试题

React常见面试题:React中调用setState之后发生了什么事情?React中Element与Component的区别?优先选择使用ClassComponent而不是FunctionalComponent?React中的refs属性的作用是什么?React中keys的作用是什么?

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!