1.创建一个项目文件夹，包含lib，dist，src三个文件 2.创建配置文件webpack.config.js，和bundle.js文件 3.lib里创建webpack.js文件，用来封装webpack类 4.src里创建一个index.js文件，作文打包的入口文件 ##webpack的基础配置 ...
分类：
Web程序 时间：
2020-06-08 00:36:56
阅读次数：
182
npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! gshop-client_final@1.0.0 dev: `webpack-dev-server --inline --progress --config build/webpack.dev.co ...
分类：
其他好文 时间：
2020-06-07 15:13:11
阅读次数：
82
HMR: hot module replacement 热模块替换 / 模块热替换 HMR: hot module replacement 热模块替换 / 模块热替换 作用: 一个模块发生变化, 只会重新打包这一个模块(而不是打包所有模块)极大提升构建速度 (开发环境) html文件: 默认不能使用 ...
分类：
Web程序 时间：
2020-06-07 12:32:25
阅读次数：
69
使用 dll，可以指示webpack 哪些库不参与打包，可以对某些第三方库进行单独打包， 需要一个配置文件 webpack.dll.js const {resolve} = require('path') const webpack = require('webpack') module.expor ...
分类：
其他好文 时间：
2020-06-07 11:13:09
阅读次数：
56
当 js 文件 是通过 cdn 加载到页面上的，webpack 打包时，需要忽略这一类库的打包，就需要在 webpack 配置中添加 externals 配置，如当页面上 jQuery 库通过 cdn 方式加载，externals 需要过滤掉 jQuery库的打包， <!DOCTYPE html> ...
分类：
其他好文 时间：
2020-06-06 21:38:00
阅读次数：
57
PWA：渐进式网络开发应用程序(离线可访问)，需要通过serviceWorker 实现， 首先，webpack 配置使用 workbox-webpack-plugin 这个插件，生成一个 serviceWorker 配置文件 构建后，生成 serviceWorker 文件： 接着，在入口文件 ind ...
分类：
其他好文 时间：
2020-06-06 20:08:26
阅读次数：
90
1.优化构建速度：用在开发环境中 DllPlugin：已经快过时了，配置繁琐 HardSourceWebpackPlugin：配置简单 DllPlugin插件打包第三方类库 优化构建性能 Dll动态链接库 其实就是做缓存：一个项目中我们经常会用到第三方类库，比如React、lodash等，没特别的需 ...
分类：
Web程序 时间：
2020-06-06 18:59:10
阅读次数：
109
0.有哪些常见的Loader？你用过哪些Loader？ (我开始熟悉的报起了菜名) raw-loader：加载文件原始内容（utf-8） file-loader：把文件输出到一个文件夹中，在代码中通过相对 URL 去引用输出的文件 (处理图片和字体) url-loader：与 file-loader ...
分类：
Web程序 时间：
2020-06-06 18:47:57
阅读次数：
65
webpack中有几个比较难懂的变量名称，可能对刚开始学习的人不是很友好，所以今天小邹就整理了一下，主要是做一个总结性的概括。 1.webpack 中，module，chunk 和 bundle 的区别是什么？ 首先我们来看一张图： 看这个图就很明白了： 对于一份同逻辑的代码，当我们手写了一个个的文 ...
分类：
Web程序 时间：
2020-06-06 18:45:43
阅读次数：
62
前言 提到前端打包，肯定提及webpack，毕竟它已经是现在流行的打包工具，对于一个前端而言，生产环境的静态资源优化，它既是面试中的高频问题，同时也最容易成为平时工作中的 OKR/KPI。如果你经常致力于优化前端打包提及，必然会对一些数字极为敏感，比如： lodash 和 react gzip 后的 ...
分类：
Web程序 时间：
2020-06-06 17:06:02
阅读次数：
146
