Loader 和 Plugin 有哪些不同?请描述一下开发 Loader 和 Plugin 的思路

  1. 什么是loader

    loader是文件加载器,负责资源文件从输入到输出的转换(加载资源文件,并对文件进行处理【例如编译、压缩等】, 然后打包到指定文件中);

    对于同一个资源可以依次使用多个loader,loader执行顺序类似出栈的方式,最后一个loader最先执行,第一个loader最后执行(代码中表现为:从下至上执行);

    第一个执行loader接收源文件内容作为参数,其他loader依次接收上一个loader 处理过的内容作为参数

  2. 什么是plugin

    plugin类似于一个扩展器,增强了webpack的自动化能力;

  3. loader和plugin的区别

    loader:是一个转换器,将文件A编译形成文件B,这里操作的是文件

    plugin:是一个扩展器,增强了webpack 本身 ; 针对的是loader结束之后webpack打包的整个过程,并不直接操作文件,而是基于事件工作机制工作,会监听webpack打包过程中的某些节点,执行更广泛的任务

  4. loader开发思路

    • 通过module.export 导出一个函数
    • 函数的默认参数为要处理的文件source
    • 函数体中处理资源
    • 返回处理后结果(交给下一个loader 进行处理)
  5. plugin开发思路

    webpack 要求插件是一个函数或者是一个包含apply方法的对象

    • 通过钩子机制实现
    • 方法体内通过webpack提供的api获取资源做相应处理
    • 将处理完的资源通过webpack提供的方法返回
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值