Webpack的习题

1.grunt、webpack和gulp三个构建工具中，其中( )是任务流工具2( )是模块打包工具。（A）

A.grunt和gulp，webpack
B.webpack, grunt和gulp
C.webpack和grunt，gulp
C.gulp，webpack和grunt

2.下列关于常见的Loader的描述中有误的是（C）

A.source-map-loader：加载额外的 Source Map 文件，以方便断点调试
B.image-loader：加载并且压缩图片文件
C.style-loader：加载 CSS，支持模块化、压缩、文件导入等特性
D.eslint-loader：通过 ESLint 检查 JavaScript 代码
解析：
css-loader：加载 CSS，支持模块化、压缩、文件导入等特性，style-loader：把 CSS 代码注入到 JavaScript 中，通过 DOM 操作去加载 CSS。

3.关于下列常见的Plugin描述错误的是（D）

A.define-plugin：定义环境变量
B.commons-chunk-plugin：提取公共代码
C.uglifyjs-webpack-plugin：通过UglifyES压缩ES6代码
D.copy-webpack-plugin：自动移除目录插件
解析：clean-webpack-plugin是自动移除目录插件

4.利用webpack从哪些方面可以优化前端的性能？(ABCD)

A.压缩代码
B.CDN加速
C.删除死代码
D.提取公共代码
解析：A.uglifyJsPlugin 压缩js代码，mini-css-extract-plugin 压缩css代码。B.利用CDN加速，将引用的静态资源修改为CDN上对应的路径，可以利用webpack对于output参数和loader的publicpath参数来修改资源路径 C.tree shaking，css需要使用Purify-CSS D.webpack4移除了CommonsChunkPlugin (提取公共代码)，用optimization.splitChunks和optimization.runtimeChunk来代替

5.下列关于webpack的说法错误的一项是（C）

A.entry是相对路径./不能去掉
B.output输出文件的位置
C.path可以是相对路径也可以是绝对路径
D.path必须是绝对路径

6.Webpack的mode工作模式有(ABC)

A.none
B.development
C.production
D.work

7.下列说法中错误的是（B）

A.JavaScript驱动整个前端的业务，js文件作为打包的入口
B.webpack可以用来编译转换代码
C.Loader可以加载任意类型的资源
D.use配置多个loader的执行顺序是从后向前
解析：B.webpack只是打包工具，加载器可以用来编译转换代码

8.Webpack加载资源的方式（ABCDE）

A.遵循ES Module标准的import声明
B.遵循CommomJS标准的require函数
C.遵循AMD标准的define函数和require函数
D.*样式代码中的@import指令和url函数
E.*HTML代码中图片标签的src属性

9.下列关于Loader的说法中有误的是（A）

A.Loader加载的非JavaScript不会触发资源加载
B.Loader负责资源文件从输入到输出的转换
C.Loader的使用方式有三种
D.Loader是一个export出来的function
解析：A.webpack本身只能打包Javascript文件，但是对于其他资源例如 css，图片，或者其他的语法集比如jsx，是没有办法加载的。 这就需要对应的loader将资源转化，加载进来。B.loader的主要功能C.配置（推荐）：在 webpack.config.js 文件中指定 loader。内联：在每个 import 语句中显式指定 loader。CLI：在 shell 命令中指定它们。D.官方解释。

10.下列说法中错误的是（D）

A.plugin通过钩子机制实现，钩子必须是一个函数或者是一个包含apply方法的对象
B.webpack通过在生命周期的钩子中挂载函数实现扩展
C.source map解决了源代码与运行代码不一致所产生的问题，会暴露源代码
D. usedExports一般用于npm包标记是否有副作用
解析
C.source map会暴露源代码D.TreeShaking在生产模式会自动开启，它是一组功能搭配使用后的效果，其中usedExports负责标记（枯树叶），sideEffects一般用于npm包标记是否有副作用。