摘要：
多个 loader，但是每个文件只能匹配一个 loader，被一个 loader 处理，因此可以使用 oneOf 唯一匹配，不需要每个文件把所有的 loader 都询问一遍，可以提高 loader 的执行效率 const {resolve} = require('path') const MiniC 阅读全文
摘要：
source-map：一种提供源代码 到 构建后 代码映射技术（如果构建后的代码出错了，通过映射可以追踪源代码的错误） 1，source-map ：外部，错误代码准确信息 和 源代码的错误位置 2，inline-source-map：内联，只生成一个内联 source-map，错误代码准确信息 和 阅读全文
摘要：
HTR：hot module replacement 热模块替换 / 模块热替换 作用：一个模块发生变化，只会重新打包这一个模块（而不是打包所有模块），极大的提升构建速度 会在应用程序运行过程中替换、添加或删除模块，而无需重新加载整个页面，主要是通过以下方式： ①保留在完全重新加载页面时丢失的应用程 阅读全文
摘要：
1 2 3 const {resolve} = require('path') 4 const MiniCssExtractPlugin = require('mini-css-extract-plugin') 5 const OptimizeCssAssetsWebpackPlugin = req 阅读全文
摘要：
1，js 压缩： 将 mode 改为“production" 即可，production 模式下，webpack 会自动压缩 js 文件 2，html 压缩： src / index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset 阅读全文
摘要：
js 兼容性处理：babel-loader @babel / core npm install --save-dev babel-loader @babel/core index.js 中，使用了箭头函数的语法，打包编译后同样也是箭头函数，这在 chrome中没有任何问题，正常输出7，但在 IE 中 阅读全文
摘要：
js 语法检查：eslint-loader eslint 只检查自己写的源代码，第三方的库不用检查 设置检查规则： package.json 中 eslintConfig 设置： browser：true 浏览器全局变量 airhub 代码规范：https://github.com/airbnb/j 阅读全文
摘要：
npm install --save-dev optimize-css-assets-webpack-plugin webpack配置： const { resolve } = require('path'); const HtmlWebpackPlugin = require('html-webp 阅读全文
摘要：
在 这里 display:flex 需要兼容性处理，webpack 编译打包时，需要使用 postcss-loader 这个loader 和 postcss-preset-env 这个插件，它帮postcss找到package.json中browserslist里面的配置，通过配置加载指定的css兼 阅读全文
摘要：
webpack编译打包时，css是被放在 js 中的，通过 style 标签加载到页面上，通过将 css 从 js中提取出来，可以使用 link 方式加载 css 用到一个插件 , mini-css-extract-plugin 首先下载这个插件 npm install --save-dev min 阅读全文