webpack学习

1.Webpack的作用?

Webpack可以把JS文件中依赖的各种资源,分门别类的摘立出来,根据一定的配置规则,该编译编译,该合并合并,该压缩的压缩,最终生成干干净净的静态资源文件。

2.Node中的CommonJS规范

在Node里面写JS代码,CommonJS的模块包关系如何组织是我们需要掌握的核心知识点。

CommentJS分为两部分,moudle对象和require对象

举个栗子🌰:

module.exports = {
    name:'mwf',
    age:18
}
const a = require('./a')
console.log(a.name)
console.log(a.age)

3.包管理工具-NPM

使用NPM下载指定模块到当前项目中放到node_modules目录下配置使用。

4.Node的工具集-path/url/util/zlib

这些常用的工具集就像node的贴心助手,我们需要掌握这些使用频次比较高的API工具集。

5.Node的文件操作能力-fs

文件操作能力是Node非常重要的一个能力,也就是本地文件资源的交互和操作能力,比如把文件写入到某个位置,或者复制移动文件到某个位置都能用到fs这个工具集,常与Path路径这些周边API的配套使用。

6.Node的缓冲(Buffer)和流(stream)

webpack的构建中有大量的文件读写操作,需要有比较好的机制来保证数据操作效率,其中用到了大量的stream读写的封装,同时也存在Buffer缓冲,是一个比较核心的知识点。

7.Node的事件机制-EventEmitter

enents对象只提供了一个对象,events.EventEmitter。EventEmitter的核心就是事件触发与事件监听器功能的封装,你可以通过require('events')来访问该模块。

例子:

const events = require('events');
var event = new events.EventEmitter();
event.on('some_event',function (){
    console.log('事件触发')
})
setTimeout(function () {
    event.emit('some_event')
},1000)

8.Node的HTTP处理-请求与响应

我们在使用webpack在本地dev环境开发的时候,经常需要用到Server来代理静态资源,包括做接口转发,Webpack常用的插件是Express。无论是作为服务端响应请求,还是作为请求的发起方,向第三方请求API,甚至是爬取网页,都逃不开HTTP的网络通信能力,

9.Node的事件循环-EventLoop

node中的事件循环的顺序:

外部输入数据-->轮询阶段(poll)-->检查阶段(check)-->关闭事件回调阶段(close callback)-->定时器检测阶段(timer)-->I/O事件回调阶段(I/O callbacks)-->闲置阶段(idle, prepare)-->轮询阶段(按照该顺序反复运行)...

  • timers 阶段:这个阶段执行timer(setTimeout、setInterval)的回调
  • I/O callbacks 阶段:处理一些上一轮循环中的少数未执行的 I/O 回调
  • idle, prepare 阶段:仅node内部使用
  • poll 阶段:获取新的I/O事件, 适当的条件下node将阻塞在这里
  • check 阶段:执行 setImmediate() 的回调
  • close callbacks 阶段:执行 socket 的 close 事件回调

10.Node的进程集群-Cluster

​ Node.js默认单进程运行,对于32位系统最高可以使用512MB内存,对于64位最高可以使用1GB内存。对于多核CPU的计算机来说,这样做效率很低,因为只有一个核在运行,其他核都在闲置。cluster模块就是为了解决这个问题而提出的。

​ cluster模块允许设立一个主进程和若干个worker进程,由主进程监控和协调worker进程的运行。worker之间采用进程间通信交换消息,cluster模块内置一个负载均衡器,采用Round-robin算法协调各个worker进程之间的负载。运行时,所有新建立的链接都由主进程完成,然后主进程再把TCP连接分配给指定的worker进程。

例子:

var cluster = require('cluster');

if(cluster.isMaster) {
    var numWorkers = require('os').cpus().length;
    console.log('Master cluster setting up ' + numWorkers + ' workers...');

    for(var i = 0; i < numWorkers; i++) {
        cluster.fork();
    }

    cluster.on('online', function(worker) {
        console.log('Worker ' + worker.process.pid + ' is online');
    });

    cluster.on('exit', function(worker, code, signal) {
        console.log('Worker ' + worker.process.pid + ' died with code: ' + code + ', and signal: ' + signal);
        console.log('Starting a new worker');
        cluster.fork();
    });
}
posted @ 2023-08-07 22:53  侠客小飞  阅读(8)  评论(0编辑  收藏  举报