webpack(二) loader

loader

webpack可以把任意文件数据作为模块进行处理,包括:js文件,非js文件,css,图片等等,webpack在默认情况下只能操作js文件,如果想操作非js文件我们可以通过loader

什么是loader?

loader是文件加载器,能够加载资源文件,并对这些文件进行一些处理,诸如编译、压缩等,最终一起打包到指定的文件中

  • 处理一个文件可以使用多个loader,loader的执行顺序是和本身的顺序是相反的,即最后一个loader最先执行,第一个loader最后执行。
  • 第一个执行的loader接收源文件内容作为参数,其他loader接收前一个执行的loader的返回值作为参数。最后执行的loader会返回此模块的JavaScript源码

loader的使用流程

以项目中添加txt文件为例
1.首先安装 raw-loader (全局安装加 -g)
npm install -D raw-loader
2.在入口文件同级创建 aa.txt文件并输入内容

在这里插入图片描述
在这里插入图片描述

3.在入口文件内引入输出
import aa from './aa.txt'
console.log(aa)
4.在webpack.config.js文件中添加配置
 module:{
   
    rules:[     //规定
      {
   
        test:/\.txt$
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值