webpack 4 技术点记录

Posted 2021-03-05 昵称太难取了

---【webpack是什么，能做什么？】：

---是一个模块打包机，可以将浏览器不能直接运行的语言，将其打包为合适的格式以供浏览器的使用

---》实现代码的转换：比如把es6转为es5，把less转为css

---》文件的优化：压缩代码，合并文件

---》模块的合并：多个模块合成一个模块

---》代码校验：检测代码的规范

---》自动发布：把打包好的发送到服务器上

---【webpack安装】：本地安装

-  先初始化-npm i -y                          npm i webpack webpack-cli -D        安装开发依赖上线时不需要

---webpack可以进行零配置， 打包工具=》输出后的结果=》js模块

---【webpack的基本配置】：

---=》手动配置webpack:         (webpack 是node写出来的)

　　=>配置默认的文件名 webpack.config.js

　　　　let path = requier（"path"）   //node 的内置模块

　　　　module.exports = {

　　　　　　mode:"development"          //指定模式  production 生产模式    development 开发模式-压缩后的

　　　　　　entry:"./src/index.js",         //指定打包的入口文件

　　　　　　output:{                           //出口

　　　　　　　　filename:"bundle.js"               //出口文件，设置出口文件的名字

　　　　　　　　path:path.resolve（__dirname,"dist"）      //指定打包好的文件放在哪里的文件夹,__dirname表示以当前目录产生一个dist文件夹

　　　　　　}

               }