本文介绍了webpack作为静态编译工具的基础知识，包括其作用、历史、环境支持和安装方式。详细讲解了webpack的打包过程，区分了开发环境和生产环境的差异，并阐述了webpack如何自动解决依赖。还提到了loader的重要性和配置方法，如style-loader和css-loader，以及如何进行代码分离、优雅降级和产出HTML。最后，文章讨论了css抽离、图片打包等进阶话题。
grunt gulp browserify webpack当今主流 webpack vue react angular 当前市面 2 个版本 webpack 3.0 webpack 4.0webpack
一、webpack 基础认识（ webpack是一种静态编译工具(预编译) 我们主要研究： 入口文件、出口、转换器、插件）
1、官网地址：官网: https://webpack.js.org/ 中文: https://www.webpackjs.com/ 前身: browserify 缺点，只能转化js
2、webpack作用? 2.1 ：干嘛的: 项目管理、打包、模块管理(依赖问题)、加载资源 (js/css/html/png…/woff/data/vue…),转换器(loader) 前身：grunt/gulp/browserify->webpack->pratcle 2.2 ： . webpack的历史 webpack1支持CMD和AMD，同时拥有丰富的plugin和loader，webpack逐渐得到广泛应用。 webpack2 支持ES Module，分析ESModule之间的依赖关系，webpack1必须将ES，Module转换成CommonJS模块，2支持tree sharking webpack3 新的特性大都围绕ES Module提出，如Scope Hoisting和Magic Comment； 前端的模块化 AMD : require.js CMD : sea.js( 弃用了 ) COMMON.js ： node.js
3、环境支持： Node 8
4、安装：全局 npm i webpac
最低0.47元/天 解锁文章
891
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
