webpack
文章平均质量分 88
不承认自己菜的菜鸡前端
这个作者很懒,什么都没留下…
展开
-
webpack 打包原理解析
文档https://webpack.js.org/1、webpack简介webpack is a module bundler(模块打包工具)Webpack是⼀个打包模块化JavaScript的⼯具,它会从⼊⼝模块出发,识别出源码中的模块化导⼊语句,递 归地找出⼊⼝⽂件的所有依赖,将⼊⼝和其所有的依赖打包到⼀个单独的⽂件中是⼯程化、⾃动化思想在前端开发中的体现。2、webpack 安装2.1安装# 安装最新的稳定版本npm i -D webpack# 安装指定版本npm i -D w原创 2022-01-28 10:28:41 · 1353 阅读 · 0 评论 -
import被webpack编译成了啥?
import 被webpack 编译成了啥?我们知道,webpack 打包过程如下:合并webpack.config.js和命令行传递的参数,形成最终的配置解析配置,得到entry入口读取入口文件内容,通过@babel/parse将入口内容(code)转换成ast通过@babel/traverse遍历ast得到模块的各个依赖通过@babel/core(实际的转换工作是由@babel/preset-env来完成的)将ast转换成es5 code通过循环伪递归的方式拿到所有模块的所有依赖并都转换原创 2021-03-09 17:26:59 · 704 阅读 · 0 评论 -
webpack总结
webpack4常用配置webpack 的核心价值就是前端源码的打包,即将前端源码中每一个文件(无论任何类型)都当做一个 pack ,然后分析依赖,将其最终打包出线上运行的代码。webpack 的四个核心部分entry 规定入口文件,一个或者多个output 规定输出文件的位置loader 各个类型的转换工具plugin 打包过程中各种自定义功能的插件本文针对webpack 4,虽然已经有v5,但是常用的配置基本没有变。初识 webpackwebpack 作为前端工程化的核心工具,是非常原创 2020-09-11 10:27:12 · 177 阅读 · 0 评论