webpack之如何自己去做一个loader

最新推荐文章于 2024-12-02 23:42:46 发布

星耀199

最新推荐文章于 2024-12-02 23:42:46 发布

阅读量181

点赞数

分类专栏： Webpack

本文链接：https://blog.youkuaiyun.com/weixin_43732512/article/details/90603769

版权

Webpack 专栏收录该内容

3 篇文章

订阅专栏

3.0如何自己创建一个loader
就是一个函数(不能使用箭头函数因为loader的配置中有this若用箭头函数指向window)
格式：module.exports=function(source){
    this.query//是options中的内容可以用loader-untils
    还有就是this.callback(err,content,sourceMap,meta)把你的loader代码传出去内容这是同步的
    异步的callback就是this.async()
}
当使用webpack.config.js 使用loader时
两种写法一种是
    1.modules:{
        rules:[
            {
            test:/\.js/,
            use:[
                path.resolve(_dirname,'loader的路径')，
                
            ]  
            }
        ]
    }
    2.
    resolveLoaders:{
        modules:['node_modules','自己写的loader的文件夹']
    },
    modules:{
        rules:[
            {
            test:/\.js/,
            use:[
                'loader的名字' 
            ]  
            }
        ]
    }