zoukankan      html  css  js  c++  java
  • 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'
            })
        ]
    }
  • 相关阅读:
    【BZOJ1087】状压dp
    【数据库课程设计】
    【BZOJ1295】最短路
    vue组件间通信六种方式(完整版)
    常见六大Web安全攻防解析
    4、css之position
    hue集成各种组件
    1.25-1.26 Coordinator数据集和oozie bundle
    1.22-1.24 Oozie企业使用案例
    1.18-1.21 Oozie Coordinator调度
  • 原文地址:https://www.cnblogs.com/znLam/p/13110076.html
Copyright © 2011-2022 走看看