浅析webpack源码之NodeEnvironmentPlugin模块总览(六)

栏目: JavaScript · 发布时间: 5年前

内容简介:进入webpack.jscompiler太复杂我们先看NodeEnvironmentPlugin

进入webpack.js

//传入地址,new Compiler出来一个复杂对象
compiler = new Compiler(options.context);
// 把options挂载到对象上
compiler.options = options;
new NodeEnvironmentPlugin().apply(compiler);

compiler太复杂

我们先看NodeEnvironmentPlugin

const NodeWatchFileSystem = require("./NodeWatchFileSystem");
const NodeOutputFileSystem = require("./NodeOutputFileSystem");
const NodeJsInputFileSystem = require("enhanced-resolve/lib/NodeJsInputFileSystem");
const CachedInputFileSystem = require("enhanced-resolve/lib/CachedInputFileSystem");

class NodeEnvironmentPlugin {
    apply(compiler) {
        // 可以缓存输入的文件系统
        compiler.inputFileSystem = new CachedInputFileSystem(
            new NodeJsInputFileSystem(),
            60000
        );
        // 输入文件系统
        const inputFileSystem = compiler.inputFileSystem;
        // 输出文件系统,挂载到compiler对象
        compiler.outputFileSystem = new NodeOutputFileSystem();
        // 传入输入文件,监视文件系统,挂载到compiler对象
        compiler.watchFileSystem = new NodeWatchFileSystem(
            compiler.inputFileSystem
        );
        // 添加事件流before-run
        compiler.hooks.beforeRun.tap("NodeEnvironmentPlugin", compiler => {
            if (compiler.inputFileSystem === inputFileSystem) inputFileSystem.purge();
        });
    }
}
module.exports = NodeEnvironmentPlugin;

打开插件NodeJsInputFileSystem.js

"use strict";

const fs = require("graceful-fs");

class NodeJsInputFileSystem {
     //读取目录下文件
    readdir(path, callback) {
        fs.readdir(path, (err, files) => {
            callback(err, files && files.map(file => {
              // 对文件名进行NFC格式化
                return file.normalize ? file.normalize("NFC") : file;
            }));
        });
    }
     //异步读取目录下文件
    readdirSync(path) {
        const files = fs.readdirSync(path);
        return files && files.map(file => {
            return file.normalize ? file.normalize("NFC") : file;
        });
    }
}

const fsMethods = [
    "stat",
    "statSync",
    "readFile",
    "readFileSync",
    "readlink",
    "readlinkSync"
];
// 同步fs方法
for(const key of fsMethods) {
    Object.defineProperty(NodeJsInputFileSystem.prototype, key, {
        configurable: true,
        writable: true,
        value: fs[key].bind(fs)
    });
}

module.exports = NodeJsInputFileSystem;

graceful-fs就是对node 原生fs 做了一层封装,显得更优雅

总体看来NodeEnvironmentPlugin这个模块就是对文件做了处理,又重新封装了node.js 对fs模块做了以一些处理,文件的输入,输出,缓存,监听...


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Computational Geometry

Computational Geometry

Mark de Berg、Otfried Cheong、Marc van Kreveld、Mark Overmars / Springer / 2008-4-16 / USD 49.95

This well-accepted introduction to computational geometry is a textbook for high-level undergraduate and low-level graduate courses. The focus is on algorithms and hence the book is well suited for st......一起来看看 《Computational Geometry》 这本书的介绍吧!

图片转BASE64编码
图片转BASE64编码

在线图片转Base64编码工具

MD5 加密
MD5 加密

MD5 加密工具

HEX CMYK 转换工具
HEX CMYK 转换工具

HEX CMYK 互转工具