webpack-自定義plugin


Plugin:開始打包,在某個時刻,幫助我們處理一些什么事情得機制

Plugin是一個類,里面包含一個apply函數,接受一個參數compiler(compiler包含打包過程得很多信息,比如生命周期的鈎子)

官方文檔:https://webpack.js.org/contribute/writing-a-plugin/

##copyright-webpack-plugin

class CopyrightWebpackPlugin {
    constructor(options){
        console.log(options)
    }
    apply(compiler){
        //官網有很多鈎子,我們以emit為例
        compiler.hooks.emit.tapAsync(//異步操作的例子
            "CopyrightWebpackPlugin",
            (compilation,cb) => {
                compilation.assets["copyright.txt"] = {  //打包后創建一個新文件 打包后會在dist下多一個copyright.txt文件  內容為 hello copy
                    source:function(){
                        return "hello copy"
                    },
                    size:function(){
                        return 20;
                    }
                };
                cb()
            }
        )
        //同步的例子
        compiler.hooks.compile.tap(
            "CopyrightWebpackPlugin",
            compilation => {
                console.log("開始了")
            }
        )
    }
}

module.exports = CopyrightWebpackPlugin

 

##webpack.config.js

const copyrightWebackPlugin = require('./myPlugins/copyright-webpack-plugin.js')

module.exports = {
    plugins:[
        new copyrightWebackPlugin({
            'name':'Joy'
        })
    ]
}

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM