美文网首页Vue.js学习
前端之webpack面试中遇到的常见问题

前端之webpack面试中遇到的常见问题

作者: 强哥科技兴 | 来源:发表于2018-10-29 10:39 被阅读3次

1:什么是webpack和grunt和gulp有什么不同

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

2:什么是bundle,什么是chunk,什么是module?

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

3:什么是Loader?什么是Plugin?

答案:

1)Loaders是用来告诉webpack如何转化处理某一类型的文件,并且引入到打包出的文件中

2)Plugin是用来自定义webpack打包过程的方式,一个插件是含有apply方法的一个对象,通过这个方法可以参与到整个webpack打包的各个流程(生命周期)。

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

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

5:webpack-dev-server和http服务器如nginx有什么区别?

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

6:什么 是模块热更新?

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

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

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

8:什么是Tree-shaking?CSS可以Tree-shaking吗?

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

JS。Css需要使用Purify-CSS。

“相信有很多想学前端的小伙伴,今年年初我花了一个月整理了一份最适合2018年学习的web前端干货,从最基础的HTML+CSS+JS到移动端HTML5到各种框架都有整理,送给每一位前端小伙伴,53763,1707这里是小白聚集地,欢迎初学和进阶中的小伙伴。”

最后:祝大家早日学有所成,拿到满意offer,快速升职加薪,走上人生巅峰。

相关文章

  • 前端之webpack面试中遇到的常见问题

    1:什么是webpack和grunt和gulp有什么不同 答案:Webpack是一个模块打包器,他可以递归的打包项...

  • web面试汇总

    《前端面试常见问题按知识点分类整理》 《CSS 中布局终极方案》面试中经常遇到的面试题之一,居中布局,特来总结 《...

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

    1:什么是webpack和grunt和gulp有什么不同 答案:Webpack是一个模块打包器,他可以递归的打包项...

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

    原文:https://www.qdfuns.com/article/51117/c4f317d0f2802bfc1...

  • webpack前端面试常见问题

    一、概念: 概念问题一、什么是webpack和grunt和gulp有什么不同 ? 答案:webpack是一个模块打...

  • 2018 前端面试准备

    前端面试常见问题按知识点分类整理 前端面试常考问题整理,按模块知识点分类,持续完善中... Front-end-D...

  • 笔试4

    前端工作面试常见问题 备注: Rebecca Murphey 的 Baseline For Front-End D...

  • Vue2(一)

    目录 ◆ 前端工程化◆ webpack 的基本使用◆ webpack 中的插件◆ webpack 中的 loade...

  • 前端面试之webpack篇

    还是以前一样,有些概念面试可能会考,我都用*标记了出来,两句话就总结清楚其余的地方如果你想了解webpack,就仔...

  • 面试中遇到的前端问题

    1,阐述一下你对HTML语义化的理解? 通过使用恰当语义的 HTML 标签,可以让页面具有良好的结构与含义  ...

网友评论

    本文标题:前端之webpack面试中遇到的常见问题

    本文链接:https://www.haomeiwen.com/subject/mgzvtqtx.html