ymy的小仓库

错误的引入方式 改正 错误的引入方式 改正错误的引入方式 改正 错误的引入方式 改正 错误的引入方式 改正...

启动： npm scripts 运行 webpack 开发环境： npm run dev 生产环境： npm run build 通过 webpack 直接运行 webpa...

HappyPack 已经不再维护，推荐使用 thread-loader HappyPack 已经不再维护，推荐使用 thread-loader...

可以分析哪些问题： 依赖的第三方模块文件大小 业务里面的组件代码大小 npm run build 后自动 8888 端口展示。分析出来后可以处理一下。比如通过 cdn 引入...

构建配置抽离成 npm 包： 意义： 通用性： 业务开发者无需关注构建配置 统一团队构建脚本 可维护性 构建配置合理的拆分 README 文档、ChangeLog 文档 质...

判断构建是否成功 在 CI/CD 的 pipline 或者发布系统需要知道的当前构建状态 每次构建完成后输入 echo $? 获取错误码 捕获报错 通过错误码显示错误 主动...

展示一大堆日志，很多不需要开发者关注 统计信息 stats： 构建成功 展示一大堆日志，很多不需要开发者关注 统计信息 stats： 构建成功...

服务端渲染： HTML + CSS +JS +Data => 渲染后的 HTML 服务端： 所有模板等资源都存储在服务器 内网机器拉取数据更快 一个 HTML 返回所有数据...

代码分割的意义 对于大的 web 应用来讲，将所有的代码都放在一个文件中是不够有效的，特别是当你的某些代码块是在某些特殊的时候才会被使用到。webpack 有一个功能就是将...

现象：构建后的代码存在大量闭包代码 1.体积增大 2.运行代码时创建的函数作用域变多，内存开销变大 结论： 1.被 webpack 转换后的模块会带上一层包裹 2.impo...

我对比本地和官网示例，发现了出土的清晰度有问题。之后请同事访问了该示例，清晰度正常。 我在例子中 ctrl+ 鼠标骨滚动，无变化。无解。 后来看到菜单栏也和官网的尺寸不同，...

eval: 使用 eval 包裹模块代码 source map：产生.map 文件 cheap：不包含列信息 inline：将 .map 作为 DataURI 嵌入，不单独...

原理：一个 entry 有一个 html-webpack-plugin 优化：动态获取 entry 和设置 html-webpack-plugin 数量，利用 glob.s...

postcss-loader autoprefixer 在某 less 文件中样式加 display: flex 配置 webpack.config.js 报错 处理 新建...

clean-webpack-plugin 构建时自动删除之前构建好的目录。 clean-webpack-plugin 构建时自动删除之前构建好的目录。...

js 文件压缩 webpack 内置 uglifyjs-webpack-plugin css 文件压缩 安装 optimize-css-assets-webpack-plu...

作用：版本管理 Hash:和整个项目的构建有关，只要项目文件有修改，整个项目构建的 hash 值就会更改 Chunkhash：和 webpack 打包的 chunck 有关...

file-loader url-loader 可以处理图片和字体，可以设置较小资源自动转换为 base64...

css-loader 用于加载 .css 文件，并且转换成 commonjs 对象 style-loader 将样式通过 <style> 标签插入 head 中 less-...

mode 用来指定当前的构建环境是： production|development|none 设置 mode 可以使用 webpack 内置的函数，默认值为 product...