【node】模块化与包(二)

1、模块化的基本概念

模块化是指解决一个复杂的问题时,自顶向下逐层把系统划分成若干模块的过程。对于整个系统来说,模块是可组合、分解和更换的单元。

(1)模块化的优点

遵循固定规则,把大文件拆分成对立并相互依赖的多个小模块

好处:

  • 提高代码的复用性;
  • 提高代码的可维护性;
  • 可以按需加载;

 (2)模块化规范

用什么语法格式引用模块,用什么语法格式向外暴露成员

2、CommonJS规定内容

CommonJS规定了模块特性和各模块之间如何相互依赖。

① 每个模块内部,module变量代表当前模块。

② module变量是一个对象,它的exports属性(module.exports)是对外的接口。

③ 加载某个模块其实是加载该模块的module.exports属性,用require()方法用于加载模块。

3、Node.js中模块三大分类

  • 内置模块(内置模块是由Node.js官方提供的,例如path,fs,http)
  • 自定义模块(用户创建的每个JS文件都是自定义模块)
  • 第三方模块(由第三方开发的模块,并非官方提供的内置模块,也不是用户创建的自定义模块,使用前需要下载)

 (1)require()方法可以加载需要的内置模块、用户自定义模块、第三方模块进行使用。

const http = require('http');

使用require()方法加载其他模块时,会执行被加载模块中代码。

在使用require()加载用户自定义模块期间,可以省略.js的后缀名。

(2)模块作用域

在自定义模块中的变量以及方法等成员,只能在当前模块内被访问,这种模块级别的访问限制叫做模块作用域。(防止全局变量污染问题)

  (3) 向外共享模块作用域中的成员

       ① module对象 :每个JS自定义模块中都有一个module对象,里面存储了当前模块有关信息。

         ② module.exports 对象: 在自定义模块中,将模块内的成员共享出去,供外界使用。(外界用require方法导入的自定义模块时,就是module.export所指对象)

// 文件一 module.js
module.exports.username = 'sss'

module.exports.sayHello = function(){
    console.log('Hello!')
}

// 文件二
const m = require('./module');
console.log(m);

// 文件二引用文件一结果 m打印结果
// { username: 'sss', sayHello: [Function (anonymous)] }

使用require()方法导入模块时,导入的结果永远module.exports指向的对象为准

        ③ exports对象 : 默认情况下 exports和module.exports指向同一个对象。最终共享的结果还是以module.exports指向的对象为准

1、require() 模块,永远都是module.export所指对象

4、npm包管理

(1)包的概念

Node.js中第三方模块叫做包。

包是由第三方个人或者团队开发出来的,基于内置模块封装出来的,免费共所有人使用,目的提高开发效率。

http://www.npmjs.com/

(2)常用指令

查看npm版本: npm -v

安装包:npm install 包完整名称/ npm i 包完整名称

安装指定版本的包(无需卸载):npm i 包名称@版本号

卸载:npm uninstall 包名称

版本号是点分十进制:第一位大版本,第二位功能版本,第三位bug修复版本,只要前面版本号增长了,后面版本就会归零。

(3)包的导入

// 导入需要的包,名称就是装包的名称
const moment = require(moment)

安装完成包后,项目文件夹多了node_modules和package-lock.json配置文件

node_modules:所有已安装到项目里的包

package-lock.json:包下载信息
(4)包管理配置文件(package-lock.json)

因为第三方包过大,共享时剔除node_modules

创建package.json: npm init -y(路径项目文件夹不能有中文空格)

dependencies:记录npm哪些包,开发和上线之后都用

devDependencies节点:开发用,上线后不用 npm i 包名称 -D

(5)使用cnpm与nrm

解决下包慢的问题:淘宝NPM镜像服务器

切换npm下包镜像源

// 查看当前下包镜像源
npm config get registry
// 更换为淘宝镜像
// https://registry.npm.taobao.org/已经过期了
npm config set registry=npm config set registry https://registry.npmmirror.com
// 检查是否下载成功
npm config get registry

nrm:快速查看和切换下包的镜像源

// 通过npm包管理器,将nrm安装为全局可用的工具
npm i nrm -g
// 查看所有可用镜像源
nrm ls
// 将下包镜像源切换为淘宝镜像
nrm use taobao

5、规范的包结构

包的分类:项目包、全局包

项目包分为开发依赖包与核心依赖包,开发依赖包只在开发期间用到,核心依赖包在开发期间与项目上线都会用到

全局包:安装到node_modules中 安装时 npm i 包名称 -g

安装i5ting_toc:npm install -g i5ting_toc

// 调用i5ting_toc,实现md文件转换html功能
i5ting_toc -f 要转换md文件路径 -o

 包的规范

一个规范的包,它的组成结构,必须符合以下3点要求:
① 包必须以单独的目录而存在;
② 包的顶级目录下要必须包含 package.json 这个包管理配置文件;
③ package.json 中必须包含 name,version,main 这三个属性,分别代表包的名字、版本号、包的入口,

6、发布包

以test-tools举例

(1)初始化包的基本结构

        ① 新建 test-tools 文件夹,作为包的根目录
        ② 在 test-tools 文件夹中,新建如下三个文件:
                package.json (包管理配置文件)
                index.js (包的入口文件)
                README.md(包的说明文档)

(2) 初始化package.json

{
"name": "test-tools",
"version": "1.0.0",
"main": "index.js",
"description":"提供了xxxx的功能",
"keywords". ["xx1", "xx2", "xx3"],
"license": "IsC"
}

 (3) 设计入口文件(main属性设计的入口文件)

// index.js
function xx1(){
    ...
    return
}

function xx2(){
    ...
    return
}
...

// 向外暴露需要成员
module.exports ={
    xx1;
}

(4) 模块化拆分

① 将不同功能拆分到不同js中去

② 在index.js中导入两个模块

③ 在index.js中,使用module.exports把对应方法共享出去

(5)把包发布到npm上

编写说明文档README.md是包的说明文档,markdown格式

安装方式、导入方式、功能模块的说明、开源协议

① 注册npm账号

② 终端登录npm账号(先切换官方服务器,不能用淘宝服务器)。上传包。

// 登录
npm login
// 把包发布到npm上,包名不能重复
npm publish

 ③ 如果要删除已发布包(72h 以内),删除后24小时不能重复发布

npm unpublish 包名称 --force

7、模块加载机制

(1)优先从缓存中加载:模块第一次加载后会缓存,多次调用require不会执行多次

(2)内置模块加载优先级最高

(3)自定义模块必须以./或者../开头路径标识符,扩展名加载顺序:确切文件名加载-.js-.json-.node-加载失败

(4)第三方模块加载机制,不是内置模块,也没有相对路径开头,从当前目录开始,尝试从node_modules文件中加载第三方模块,直到文件系统根目录为止

(5)目录作为模块,先寻找package.json,找main属性作为入口,如果没有或者入口不能解析,则从加载目录下找寻index.js文件,如果还是找不到,则报错:Error:Cannot find module 'xxx'


 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/454295.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【Axure高保真原型】下拉列表切换图表

今天和大家分享通过下拉列表动态切换统计图表的原型模板,我们可以通过下拉列表选择要显示的图表,包括柱状图、条形图、饼图、环形图、折线图、曲线图、面积图、阶梯图、雷达图;而且图表数据可以在左侧表格中动态维护,包括增加修改…

数码管的动态显示(二)

1.原理 这个十六进制是右边的dp为高位。 数码管的动态显示,在第一个计数周期显示个位,在第二个周期显示十位,在第三个周期显示百位由于人眼的视觉和数码管的特性,感觉就是显示了234,每个数码管的显示需要从输入的数据里…

科普编程中 宿主环境(host environment) 基础概念

我们来说说 宿主环境 首先 什么是宿主环境? 宿主环境 (host environment) 意思就是 程序运行所必须的依赖环境 安卓和IOS 系统 就是两种完全不同的宿主环境 总所周知 微信版的安卓App 在苹果中是无法运行的 所以说 Android 是安卓软件的宿主环境 离开了这个宿主环…

ECharts饼图图例消失踩的坑

在使用Echarts的饼图时,当时做法是在图例数小于8时显示全部的图例,在大于8的时候显示前8个图例。于是用了两种不同的方式处理。导致出现切换时间后图例不显示的情况。 错误过程: 在进行图例生成时采用了两种不同的方式: ①如果…

Linux内核编译(版本6.0以及版本v0.01)并用qemu驱动

系统环境: ubuntu-22.04.1-desktop-amd64 目标平台: x86 i386 内核版本: linux-6.0.1 linux-0.0.1 环境配置 修改root密码 sudo passwd 修改软件源(非必要) vmtools安装(实现win-linux软件互传) 安装一些必须的软件&…

代码随想录算法训练营第25天|216.组和总和三、17.电话号码的字母组合

目录 一、力扣216.组合总和三1.1 题目1.2 思路1.3 代码 二、力扣17.电话号码的字母组合2.1 题目2.2 思路2.3 代码 一、力扣216.组合总和三 1.1 题目 1.2 思路 自己的想法:和总和问题思路类似,回溯法。 (1)k个数的组合&#xff0…

如何查看mnist数据集的图片

import numpy as np import matplotlib.pyplot as pltdef read_mnist_images(filename):with open(filename, rb) as f:# 读取魔术数字、图像数量、行数、列数magic_number int.from_bytes(f.read(4), big)number_of_images int.from_bytes(f.read(4), big)rows int.from_by…

《详解:鸿蒙NEXT开发核心技术》

我们现在都知道鸿蒙作为一个国产的全栈自研系统,经过国家主推后。已经引起人们很大的关注,其中作为开发者来说;许多一线大厂已经与其华为鸿蒙展开原生应用的合作了,目前了解到已经有200家。而之后出现了很多的高薪鸿蒙开发岗位&am…

ThreeJs 射线拾取不准确设置

欢迎关注进来点个关注; 关注获取更多咨询!关注获取答案! 1、效果图如下: 2、问题描述:点击一开始无法获取当前的位置,官方推荐直接使用 mouseClick.x = (event.offsetX / window.innderWidth) * 2 - 1; mouseClick.y = -(event.offsetY / window.innderHeight) * 2 + 1;…

独显直连是什么意思

很多小伙伴在购买笔记本电脑时,尤其是游戏本,都会看到详情页在介绍显卡提示有“独显直连”功能,那么独显直连是什么意思?它又有什么用呢? 独显直连是什么意思 独显直连,英文全称Graphics Processing Unit…

【你也能从零基础学会网站开发】Web建站之javascript入门篇 History对象与Location对象

🚀 个人主页 极客小俊 ✍🏻 作者简介:程序猿、设计师、技术分享 🐋 希望大家多多支持, 我们一起学习和进步! 🏅 欢迎评论 ❤️点赞💬评论 📂收藏 📂加关注 History历史对…

Linux本地搭建FastDFS系统

文章目录 前言1. 本地搭建FastDFS文件系统1.1 环境安装1.2 安装libfastcommon1.3 安装FastDFS1.4 配置Tracker1.5 配置Storage1.6 测试上传下载1.7 与Nginx整合1.8 安装Nginx1.9 配置Nginx 2. 局域网测试访问FastDFS3. 安装cpolar内网穿透4. 配置公网访问地址5. 固定公网地址5.…

(BAT向)Java岗常问高频面试汇总:MyBatis 微服务 Spring 分布式 MySQL等

看面试题可以是为了面试,也可以是对自己学到的东西的一种查漏补缺,更加深刻的去了解一些核心知识点 Spring面试高频问题 问题一:谈 需要zi料 绿色徽【vip1024b】 谈你对spring IOC 和 DI 的理解,它们有什么区别? **问题…

spring-boot-maven-plugin springboot打包配置问题

目录 一、打包可执行jar 二、打包非可执行jar 三、两种jar对比 springboot项目的pom文件中一般都配置了spring-boot-maven-plugin打包插件。 <!-- 打包插件依赖 --><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-b…

爆肝整理万能sass框架:react18+webpack5+typescript+ant Design,框架在手,交付无忧!!!

来活了&#xff0c;要求一周时间内快速给xxx业务开发一个sass系统平台&#xff0c;要求有角色权限控制&#xff0c;推荐模块&#xff0c;各种业务内容模块&#xff0c;莫慌&#xff0c;直接上代码&#xff01;&#xff01;&#xff01;&#xff01;&#xff01; 1.系统框架配置…

前端去除网页水印

按F12&#xff0c;打开开发者工具面板&#xff0c;然后直接在样式搜索backgroud 然后直接取消backgroud 的复选框即可。

基于Springboot的面向智慧教育的实习实践系统设计与实现(有报告)。Javaee项目,springboot项目。

演示视频&#xff1a; 基于Springboot的面向智慧教育的实习实践系统设计与实现&#xff08;有报告&#xff09;。Javaee项目&#xff0c;springboot项目。 项目介绍&#xff1a; 采用M&#xff08;model&#xff09;V&#xff08;view&#xff09;C&#xff08;controller&…

6.Java并发编程—深入剖析Java Executors:探索创建线程的5种神奇方式

Executors快速创建线程池的方法 Java通过Executors 工厂提供了5种创建线程池的方法&#xff0c;具体方法如下 方法名描述newSingleThreadExecutor()创建一个单线程的线程池&#xff0c;该线程池中只有一个工作线程。所有任务按照提交的顺序依次执行&#xff0c;保证任务的顺序性…

AWS入门实践-AWS CLI工具的使用介绍

AWS CLI&#xff08;Amazon Web Services Command Line Interface&#xff09;是一个强大的工具&#xff0c;它允许您直接从命令行与AWS服务进行交互。这不仅可以加快许多任务的处理速度&#xff0c;而且还可以通过脚本自动化。 一、AWS CLI工具的安装 1、Windows 安装下载…

【PLIO学习总结】laserMapping中的时间戳与状态更新逻辑

本文仅用于个人学习总结记录。如有错误&#xff0c;请批评指正。 0、PLIO简要思路 从PLIO的论文中&#xff0c;可以知道&#xff0c;完整的PLIO算法采用IMU和LiDAR数据同时作为“输入”&#xff0c;维护状态变量包括加速度和角速度。 同时&#xff0c;PLIO是一种distortion-…