webpack 4 技术点记录

---【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文件夹

      }

               }

   

猜你喜欢

转载自www.cnblogs.com/zzhqdkf/p/12490144.html
今日推荐