webpack常见面试题

Posted 2021-11-24 老张在线敲代码

webpack

npm run build / serve 之后发生了什么？

• 答：脚手架使用webpack来执行配置文件，默认是webpack.config.js或者vue.config.js。然后执行入口文件的js,进行解析处理。
• 如果是build则生成物理文件存在磁盘上。如果是server的话则将编译的结果存入内存条中。

webpack是干嘛的？定义？解释？

• 答：webpack是一个打包工具，前端半自动化开发工具。它是基于nodejs运行的，它的功能有：压缩代码，压缩图片，解析es6,解析sass语法，代码热更新等。

webpack构成部分？

• 答：入口，出口，插件，装载机loader，本地服务devServer

webpack执行过程？

• webpack默认执行webpack.config.js文件，读取入口文件开始解析各种资源。

列举几个常用loader？

sass-loader 解析sass文件，转成css,
file-loader 处理字体，图片,
url-loader 基于file-loader处理文件,
css-loader 解析css文件，处理css代码,
style-loader把css代码插入到页面当中,
img-loader专门处理图片的，
babel-loader解析es6转成es5

loader的执行顺序？

答：自下而上，从右向左

plugins有哪些？

• html-webpack-plugins解析html的

loader和插件plugins的区别？

答：正常情况下，先用loader把资源处理完之后再执行插件。
loader是专门用于处理各种资源的，编译过程。
plugins是对webpack没有的功能的补充

【webpack默认只能解析js文件】

webpack安装

npm i webpack webpack-cli
webpack-dev-server
创建一个webpack.config.js文件进行配置

webpack执行的命令

零配置打包：npx webpack

只能打包js文件，打包后的文件一定叫main.js

执行配置：webpack

启动服务：webpack serve