前端面试之webpack篇

Posted 前端程序人生

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了前端面试之webpack篇相关的知识,希望对你有一定的参考价值。

如果你想了解webpack,就仔细看看,虽然本教程不能让你webpack玩的很6,但是懂操作流程够了。面试你一般问你webpack的原理,Loader的原理,你有用哪些优化措施
前端开发已经模块化,它改进了代码库的封装和结构。打包工具已经成为了一个项目必不可少的部分,如今这儿有几种可能的选择,例如webpack,grunt,gulp等。webpack因为他的功能和扩展性在过去的几年中,受到非常大的欢迎。但是webpack的配置总是让人觉得很困惑,今天我们将从一个空的配置文件逐步完成一个完整的设置进行打包文件。


概念



不像大多数的模块打包机,webpack是收把项目当作一个整体,通过一个给定的的主文件,webpack将从这个文件开始找到你的项目的所有依赖文件,使用loaders处理它们,最后打包成一个或多个浏览器可识别的js文件


install

首先添加我们即将使用的包:



npm install webpack webpack-dev-server --save-dev



webpack是我们需要的模块打包机,webpack-dev-server用来创建本地服务器,监听你的代码修改,并自动刷新修改后的结果。这些是有关devServer的配置



contentBase,  // 为文件提供本地服务器

port,  // 监听端口,默认8080

以上是关于前端面试之webpack篇的主要内容,如果未能解决你的问题,请参考以下文章

前端面试之webpack篇

程序员花费3小时总结:前端面试之webpack篇

前端面试题之前端工程化篇

前端面试题之手写promise

前端面试题之代码输出篇

前端面试题之手写代码篇