webpack
文章平均质量分 95
飞歌Fly
这个作者很懒,什么都没留下…
展开
-
深入webpack打包原理,loader和plugin的实现
本文讨论的核心内容如下:webpack进行打包的基本原理 如何自己实现一个loader和plugin注: 本文使用的webpack版本是v4.43.0, webpack-cli版本是v3.3.11,node版本是v12.14.1,npm版本v6.13.4(如果你喜欢yarn也是可以的),演示用的chrome浏览器版本81.0.4044.129(正式版本) (64 位)1. webpack打包基本原理webpack的一个核心功能就是把我们写的模块化的代码,打包之后,生成可以在浏览器中运行的代码转载 2021-02-21 16:37:59 · 1255 阅读 · 0 评论 -
带你深度解锁Webpack系列(优化篇)
带你深度解锁Webpack系列(优化篇)本文罗列出了十多种优化方式,大家可以结合自己的项目,选择适当的方式进行优化。这些Webpack插件的源码我大多也没有看过,主要是结合Webpack官方文档以及项目实践,并且花了大量的时间验证后输出了本文,如果文中有错误的地方,欢迎在评论区指正。鉴于前端技术变更迅速,祭出本篇文章基于Webpack的版本号:├── webpack@4....转载 2020-03-22 11:09:36 · 364 阅读 · 0 评论 -
webpack笔记总结
指定输入和输出文件后,lodash 生成bundle文件loader可以 import的 css等文件编译成webpack能识别的js文件HtmlWebpackPlugin插件可以 把分离的bundle文件自动插入 index.html入口文件中clean-webpack-plugin 先把dist下的所有文件先清空,在执行代码生成Manifest 记录着文件依赖和生成的追踪过程devt...原创 2019-02-25 21:31:48 · 198 阅读 · 0 评论 -
webpack devDependencies、dependencies的区别
devDependencies是只会在开发环境下依赖的模块,生产环境不会被打入包内。通过NODE_ENV=developement或NODE_ENV=production指定开发还是生产环境。dependencies依赖的包不仅开发环境能使用,生产环境也能使用。所以我们安装模块时要分清楚状况,是使用--save还是--save-dev,一般代码格式相关的 --save-dev,业务逻辑...原创 2019-02-20 12:14:24 · 2979 阅读 · 2 评论 -
介绍下 npm 模块安装机制,为什么输入 npm install 就可以自动安装对应的模块
转载自:https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/221. npm 模块安装机制:发出npm install命令 查询node_modules目录之中是否已经存在指定模块 若存在,不再重新安装 若不存在 npm 向 registry 查询模块压缩包的网址 下载压缩包,存放在根目...转载 2019-07-18 10:48:02 · 729 阅读 · 3 评论