前言经常遇到这样的问题。当h5项目需要预加载图片资源时，我们往往需要手动获取图片地址存入数组，然后通过遍历进行预加载，例如：letimgList=['http://domain.com/img/1.jpg','http://domain.com/img/2.jpg','http://domain.com/img/3.jpg',...];为了懒惰至于懒惰，我们可以写一个webpack加载器来处理它，然后像上面描述的那样返回一个数组给我们。期望在页面调用这种方式获取项目目录下img文件夹的图片，并返回一个url数组。让imgList=__getPath('img');原理代码不多，但原理比较简单。使用正则匹配__getPath('img')获取图片所在文件夹名称，然后获取图片的相对路径，require，然后返回拼接后的字符，如：'[require("img/1.jpg"),require("img/2.jpg"),require("img/3.jpg"),...]'finally会执行return的内容，然后是一个image数组将返回URL。constfs=require("fs")constpath=require('path');constglob=require('glob');constloaderUtils=require('loader-utils');module.exports=function(content){constoptions=loaderUtils.getOptions(这个)||{};如果（选项。noCache）this.cacheable（false）；让fileReg=/__getPath\(([^\)]+)\)/gim;//自定义文件上下文||从webpack4开始，原来的this.options.context被改为this.rootContextletrootPath=options.context||this.rootContext||(this.options&&this.options.context);让srcPath=path.join(rootPath,"/src");让filepath=this.context;//当处理文件所在的目录content=content.replace(fileReg,(ret,src)=>{letfolderName=src.replace(/'|"/g,"");letresList=glob.sync(path.join(srcPath,folderName)+"/*");letresult='[';for(leti=0;i
