webpack基礎知識單選題100道及答案

webpack基礎知識單選題100道及答案1.以下關于webpack的說法，正確的是（）A.webpack只能用于打包JavaScript文件B.webpack是一個前端項目的自動化構建工具C.webpack主要用于后端項目的部署D.webpack只適用于React項目答案：B2.webpack的核心概念中，負責將不同類型的文件轉換為有效的模塊的是（）A.entryB.outputC.loaderD.plugin答案：C3.webpack中默認的入口文件是（）A.index.jsB.main.jsC.app.jsD.entry.js答案：A4.在webpack配置文件中，用于指定輸出文件的路徑和文件名的屬性是（）A.entryB.outputC.moduleD.plugins答案：B5.以下哪個loader可以用于處理CSS文件（）A.babel-loaderB.css-loaderC.file-loaderD.url-loader答案：B6.webpack中用于處理圖片等靜態(tài)資源的loader可以是（）A.style-loaderB.sass-loaderC.file-loaderD.postcss-loader答案：C7.以下關于webpack插件（plugin）的說法，錯誤的是（）A.插件可以用于優(yōu)化打包結果B.插件可以在打包過程中執(zhí)行特定的任務C.插件和loader的功能基本相同D.插件可以用于生成額外的文件答案：C8.webpack的開發(fā)服務器（webpack-dev-server）的主要作用是（）A.用于打包項目B.提供一個本地的開發(fā)服務器，實現熱更新等功能C.用于部署項目到生產環(huán)境D.用于優(yōu)化項目的性能答案：B9.在webpack配置中，用于配置loader的屬性是（）A.entryB.outputC.moduleD.plugins答案：C10.以下哪個插件可以用于提取CSS文件到單獨的文件中（）A.HtmlWebpackPluginB.CleanWebpackPluginC.MiniCssExtractPluginD.UglifyJsPlugin答案：C11.webpack中，用于處理ES6+語法轉換為ES5語法的loader是（）A.css-loaderB.babel-loaderC.file-loaderD.postcss-loader答案：B12.以下關于webpack的entry配置的說法，錯誤的是（）A.entry可以是一個字符串，指定單個入口文件B.entry可以是一個數組，指定多個入口文件C.entry可以是一個對象，用于配置多個入口點D.entry只能指定JavaScript文件答案：D13.webpack中，用于生成HTML文件并自動引入打包后的資源的插件是（）A.HtmlWebpackPluginB.CleanWebpackPluginC.MiniCssExtractPluginD.UglifyJsPlugin答案：A14.以下關于webpack的output配置中，用于指定輸出文件名的屬性是（）A.pathB.filenameC.publicPathD.chunkFilename答案：B15.以下哪個loader可以用于處理Sass文件（）A.css-loaderB.sass-loaderC.file-loaderD.postcss-loader答案：B16.webpack中，用于清理上次打包生成的文件的插件是（）A.HtmlWebpackPluginB.CleanWebpackPluginC.MiniCssExtractPluginD.UglifyJsPlugin答案：B17.在webpack配置中，用于配置插件的屬性是（）A.entryB.outputC.moduleD.plugins答案：D18.以下關于webpack的模式（mode）的說法，錯誤的是（）A.有development、production和none三種模式B.development模式下會進行代碼壓縮和優(yōu)化C.production模式下會進行代碼壓縮和優(yōu)化D.none模式下不進行任何默認的優(yōu)化答案：B19.webpack中，用于將多個CSS文件合并為一個文件的插件可以是（）A.HtmlWebpackPluginB.CleanWebpackPluginC.MiniCssExtractPluginD.OptimizeCssAssetsPlugin答案：D20.以下關于webpack的loader和plugin的區(qū)別，說法正確的是（）A.loader是在打包完成后執(zhí)行，plugin是在打包過程中執(zhí)行B.loader用于處理特定類型的文件，plugin用于執(zhí)行更廣泛的任務C.loader只能處理JavaScript文件，plugin可以處理各種類型的文件D.loader和plugin的作用完全相同答案：B21.webpack中，用于處理字體文件的loader可以是（）A.css-loaderB.file-loaderC.babel-loaderD.postcss-loader答案：B22.以下關于webpack的entry配置中，使用對象形式配置多個入口點時，對象的鍵表示（）A.入口文件的路徑B.輸出文件的名稱C.入口點的名稱D.輸出文件的路徑答案：C23.webpack中，用于優(yōu)化JavaScript代碼的插件可以是（）A.HtmlWebpackPluginB.CleanWebpackPluginC.UglifyJsPluginD.MiniCssExtractPlugin答案：C24.以下關于webpack的output配置中，publicPath屬性的作用是（）A.指定輸出文件的路徑B.指定輸出文件名C.指定在瀏覽器中訪問打包文件的公共路徑D.指定代碼分割時生成的chunk文件的文件名答案：C25.以下哪個loader可以用于處理Less文件（）A.css-loaderB.less-loaderC.file-loaderD.postcss-loader答案：B26.webpack中，用于分析打包后文件大小和依賴關系的插件可以是（）A.webpack-bundle-analyzerB.CleanWebpackPluginC.MiniCssExtractPluginD.UglifyJsPlugin答案：A27.在webpack配置中，用于配置模塊解析規(guī)則的屬性是（）A.entryB.outputC.resolveD.plugins答案：C28.以下關于webpack的熱更新（HotModuleReplacement）的說法，錯誤的是（）A.可以在不刷新頁面的情況下更新模塊B.只適用于CSS文件的更新C.可以提高開發(fā)效率D.需要在開發(fā)服務器中進行配置答案：B29.webpack中，用于處理JSON文件的loader是（）A.json-loader（在webpack4+中不需要，默認支持）B.css-loaderC.file-loaderD.postcss-loader答案：A30.以下關于webpack的代碼分割（CodeSplitting）的說法，正確的是（）A.只能將JavaScript代碼進行分割B.可以減小初始加載的文件大小C.不需要進行任何配置，webpack會自動進行代碼分割D.代碼分割會降低項目的性能答案：B31.webpack中，用于處理圖片文件并將小于一定大小的圖片轉換為base64格式的loader是（）A.file-loaderB.url-loaderC.css-loaderD.postcss-loader答案：B32.以下關于webpack的output配置中，chunkFilename屬性的作用是（）A.指定輸出文件的路徑B.指定輸出文件名C.指定在瀏覽器中訪問打包文件的公共路徑D.指定代碼分割時生成的chunk文件的文件名答案：D33.以下哪個插件可以用于在打包時將一些不需要的代碼從最終的打包文件中去除（）A.HtmlWebpackPluginB.CleanWebpackPluginC.TreeShaking（webpack4+中默認支持，不是插件形式嚴格意義上）D.MiniCssExtractPlugin答案：C34.在webpack配置中，用于配置外部依賴的屬性是（）A.entryB.outputC.externalsD.plugins答案：C35.以下關于webpack的環(huán)境變量的說法，錯誤的是（）A.可以通過環(huán)境變量來區(qū)分不同的構建環(huán)境B.只能在webpack配置文件中使用環(huán)境變量C.可以在代碼中使用環(huán)境變量D.可以通過命令行參數來設置環(huán)境變量答案：B36.webpack中，用于處理模板文件（如ejs、pug等）的loader可以是（）A.ejs-loader（針對ejs模板）等B.css-loaderC.file-loaderD.postcss-loader答案：A37.以下關于webpack的devtool配置的說法，正確的是（）A.用于配置開發(fā)服務器的相關參數B.用于配置代碼的壓縮和優(yōu)化選項C.用于配置生成sourcemap的方式D.用于配置模塊的解析規(guī)則答案：C38.webpack中，用于處理CSV文件的loader可以是（）A.csv-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A39.以下關于webpack的緩存（Caching）的說法，錯誤的是（）A.可以提高打包的速度B.緩存只對開發(fā)環(huán)境有效C.可以通過配置來實現緩存D.合理的緩存可以減少不必要的重新打包答案：B40.webpack中，用于處理XML文件的loader可以是（）A.xml-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A41.以下關于webpack的模塊解析順序的說法，正確的是（）A.先從node_modules目錄中查找，再從當前目錄查找B.先從當前目錄查找，再從node_modules目錄中查找C.只從node_modules目錄中查找D.只從當前目錄查找答案：B42.webpack中，用于處理YAML文件的loader可以是（）A.yaml-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A43.以下關于webpack的別名（alias）配置的說法，錯誤的是（）A.可以通過別名來簡化模塊的引入路徑B.別名配置只能在webpack配置文件中設置C.別名配置可以提高模塊查找的效率D.別名配置可以避免一些路徑相關的問題答案：B44.webpack中，用于處理Markdown文件的loader可以是（）A.markdown-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A45.以下關于webpack的性能優(yōu)化的說法，錯誤的是（）A.減少不必要的依賴可以提高打包速度B.代碼分割可以減小初始加載的文件大小C.不使用任何插件和loader可以提高性能D.合理配置緩存可以提高打包速度答案：C46.webpack中，用于處理TypeScript文件的loader是（）A.ts-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A47.以下關于webpack的構建過程的說法，正確的是（）A.首先解析入口文件，然后遞歸解析依賴的模塊B.先處理插件，再處理loaderC.構建過程只涉及到JavaScript文件的處理D.構建過程不需要進行文件的讀取和寫入操作答案：A48.webpack中，用于處理Vue單文件組件（.vue文件）的loader是（）A.vue-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A49.以下關于webpack的目標（target）配置的說法，錯誤的是（）A.用于指定構建的目標環(huán)境B.常見的目標環(huán)境有web、node等C.目標配置對打包結果沒有影響D.不同的目標環(huán)境可能需要不同的配置答案：C50.webpack中，用于處理CoffeeScript文件的loader可以是（）A.coffee-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A51.以下關于webpack的依賴圖（DependencyGraph）的說法，正確的是（）A.依賴圖只包含JavaScript文件的依賴關系B.依賴圖是在打包完成后生成的C.依賴圖記錄了項目中各個模塊之間的依賴關系D.依賴圖對項目的構建沒有實際作用答案：C52.webpack中，用于處理Haml文件的loader可以是（）A.haml-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A53.以下關于webpack的錯誤處理和提示的說法，錯誤的是（）A.webpack會在控制臺輸出詳細的錯誤信息B.可以通過配置來定制錯誤提示的格式和內容C.忽略錯誤可以提高打包的穩(wěn)定性D.錯誤信息對排查問題沒有幫助答案：D54.webpack中，用于處理Stylus文件的loader是（）A.stylus-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A55.以下關于webpack的模塊熱替換（HMR）和自動刷新（LiveReloading）的區(qū)別，說法正確的是（）A.HMR會刷新整個頁面，LiveReloading只會更新修改的模塊B.HMR只會更新修改的模塊，LiveReloading會刷新整個頁面C.HMR和LiveReloading的效果完全相同D.HMR和LiveReloading都不適合在開發(fā)環(huán)境中使用答案：B56.webpack中，用于處理Jade文件的loader可以是（）A.jade-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A57.以下關于webpack的配置文件（webpack.config.js）的說法，錯誤的是（）A.配置文件是一個JavaScript文件B.配置文件只能有一個C.可以通過命令行參數指定不同的配置文件D.配置文件中可以使用Node.js的模塊和語法答案：B58.webpack中，用于處理Handlebars模板文件的loader可以是（）A.handlebars-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A59.在webpack中，若想對打包后的文件進行重命名以添加哈希值來防止緩存問題，應在output配置的哪個屬性中設置相關規(guī)則（）A.pathB.filenameC.publicPathD.hashPath答案：B60.以下關于webpack-dev-middleware的說法，正確的是（）A.它是一個獨立的服務器，與webpack-dev-server功能相同B.它是一個中間件，用于將webpack的編譯結果提供給其他服務器C.它只能在生產環(huán)境中使用D.它主要用于優(yōu)化打包后的文件大小答案：B61.webpack中，用于處理GraphQL文件的loader可以是（）A.graphql-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A62.當在webpack中配置多個loader處理同一類型文件時，loader的執(zhí)行順序是（）A.從左到右，從上到下B.從右到左，從上到下C.從左到右，從下到上D.從右到左，從下到上答案：D63.以下關于webpack的CodeSplitting中動態(tài)導入（DynamicImports）的說法，錯誤的是（）A.可以使用import()語法來實現動態(tài)導入B.動態(tài)導入會導致初始加載文件大小增加C.動態(tài)導入有助于實現按需加載D.動態(tài)導入可以提高應用的性能答案：B64.webpack中，用于優(yōu)化字體文件加載的插件可以是（）A.HtmlWebpackPluginB.FontFaceObserverPluginC.MiniCssExtractPluginD.UglifyJsPlugin答案：B65.在webpack配置中，用于設置模塊的默認導出方式的屬性是（）A.exportsB.output.exportsC.module.exportsD.不存在這樣的屬性答案：D66.以下關于webpack的TreeShaking在CSS中的應用，說法正確的是（）A.webpack默認會對CSS進行TreeShakingB.可以通過配置PurgeCSS插件來實現CSS的TreeShakingC.CSS不存在TreeShaking的概念D.只有在生產模式下CSS才會進行TreeShaking答案：B67.webpack中，用于處理MDX文件（MarkdownwithJSX）的loader是（）A.mdx-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A68.以下關于webpack的性能預算（PerformanceBudget）的說法，錯誤的是（）A.可以設置打包文件的大小限制B.性能預算對開發(fā)過程沒有實際意義C.當打包文件超出預算時，webpack會給出警告D.可以通過配置來調整性能預算答案：B69.webpack中，用于處理Scala.js文件的loader可以是（）A.scalajs-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A70.在webpack的resolve配置中，alias屬性中設置的別名路徑是否需要以斜杠（/）結尾（）A.一定需要B.一定不需要C.根據操作系統(tǒng)決定D.取決于具體的配置需求，有的情況需要，有的情況不需要答案：D71.以下關于webpack的HMR在React應用中的使用，說法錯誤的是（）A.可以實現React組件的局部更新B.需要在React組件中進行額外的配置才能使用HMRC.HMR可以提高React應用的開發(fā)效率D.React默認支持HMR，無需任何配置答案：D72.webpack中，用于處理LESS模塊（帶有模塊化語法的LESS文件）的loader可以是（）A.less-loader?modulesB.css-loaderC.file-loaderD.postcss-loader答案：A73.以下關于webpack的緩存策略中，緩存失效的原因不包括（）A.配置文件發(fā)生變化B.依賴的模塊發(fā)生變化C.緩存文件過期時間到了D.打包的目標環(huán)境改變答案：C74.webpack中，用于處理WebAssembly文件的loader可以是（）A.wasm-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A75.在webpack的配置中，若要為不同的環(huán)境（開發(fā)、生產等）設置不同的配置，最常用的方法是（）A.編寫多個完全獨立的webpack配置文件B.使用環(huán)境變量結合一個配置文件，通過條件判斷來設置不同配置C.在每次打包時手動修改配置文件D.無法為不同環(huán)境設置不同配置答案：B76.以下關于webpack的ModuleFederation（模塊聯(lián)邦）的說法，錯誤的是（）A.可以實現跨應用共享代碼和模塊B.只能在同一項目的不同模塊之間使用C.有助于構建微前端架構D.可以提高代碼的復用性答案：B77.webpack中，用于處理Handlebars.runtime.js的相關配置通常在哪個loader中（）A.handlebars-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A78.以下關于webpack的AssetModules（資產模塊）的說法，正確的是（）A.資產模塊只能處理圖片文件B.資產模塊是webpack5新引入的功能，用于替代部分loaderC.資產模塊不能進行自定義配置D.資產模塊只能在生產模式下使用答案：B79.webpack中，用于處理Dart文件的loader可以是（）A.dart-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A80.在webpack的devServer配置中，hotOnly屬性的作用是（）A.只在熱更新失敗時才刷新頁面B.始終只進行熱更新，不刷新頁面C.只在開發(fā)環(huán)境中生效，生產環(huán)境中無效D.控制熱更新的頻率答案：A81.以下關于webpack的優(yōu)化壓縮圖片的方法，除了使用image-webpack-loader外，還可以（）A.手動在Photoshop中壓縮圖片后再放入項目B.使用gzip壓縮服務器端的圖片文件C.在webpack配置中設置圖片的最大尺寸D.調整圖片的分辨率答案：B82.webpack中，用于處理Stylus模塊（帶有模塊化語法的Stylus文件）的loader可以是（）A.stylus-loader?modulesB.css-loaderC.file-loaderD.postcss-loader答案：A83.以下關于webpack的devtool配置中，source-map和inline-source-map的區(qū)別是（）A.source-map生成單獨的映射文件，inline-source-map將映射內容嵌入到打包文件中B.source-map只在開發(fā)環(huán)境有效，inline-source-map在開發(fā)和生產環(huán)境都有效C.source-map生成的映射文件更小，inline-source-map生成的映射文件更大D.source-map用于JavaScript文件，inline-source-map用于CSS文件答案：A84.webpack中，用于處理EJS模塊（帶有模塊化語法的EJS文件）的loader可以是（）A.ejs-loader?modulesB.css-loaderC.file-loaderD.postcss-loader答案：A85.以下關于webpack的Chunk的說法，錯誤的是（）A.Chunk是webpack打包過程中生成的代碼塊B.每個入口文件對應一個ChunkC.代碼分割會產生多個ChunkD.Chunk只能包含JavaScript代碼答案：D86.webpack中，用于處理Pug模塊（帶有模塊化語法的Pug文件）的loader可以是（）A.pug-loader?modulesB.css-loaderC.file-loaderD.postcss-loader答案：A87.在webpack的output配置中，若要將打包后的文件輸出到多個目錄，以下做法正確的是（）A.無法實現此功能B.使用數組形式設置path屬性C.配置多個output對象D.在path屬性中使用通配符答案：C88.以下關于webpack的WebpackBundleAnalyzer插件在分析結果中，餅圖表示的是（）A.各個模塊的依賴關系B.各個Chunk的大小占比C.打包過程中各個階段的耗時D.不同類型文件的數量占比答案：B89.webpack中，用于處理F#文件的loader可以是（）A.fsharp-loaderB.css-loaderC.file-loaderD.postcss-loader答案：A90.以下關于webpack的構建緩存與瀏覽器緩存的關系，說法正確的是（）A.構建緩存與瀏覽器緩存沒有任何關聯(lián)B.構建緩存可以優(yōu)化瀏覽器緩存的設置C.瀏覽器緩存會影響構建緩存的效果D.構建緩存的結果直接決定了瀏覽器緩存的內容答案：B91.webpack中，用于處理GraphQLSDL文件的loader可以是（）A.graphql-sdl-loaderB.css-loaderC.file-loa