手写模块化开发定
第三方模块增删改查
模块查找规则(自己封装+系统+第三方)
1.手写模块化开发
1.模块:一个js文件就是一个模块
2.模块内部定义的变量和函数,在其他js文件中无法访问到
3.将不同功能写在不同的js文件(模块)
4.最后将js文件组装到一起就形成了互相依赖功能
解决问题 | 内容 |
---|---|
文件依赖 | 文件与文件之间依赖关系不明确 |
命名冲突 | 代码覆盖问题 |
导出模块需要写导出代码
需要导出的JS文件中,导出的变量/方法的代码
let 需要导出的变量 = "1";
let 需要导出的函数 = () => { }
//方法1
module.exports.导出的变量名 = 需要导出的变量;
module.exports.导出的函数名 = 需要导出的函数;
module.exports = {} //以module.exports为准
//方法2
exports.导出的变量名 = 需要导出的变量;
exports.导出的函数名 = 需要导出的函数;
exports = {} //以module.exports为准,这么写是错误的,没有任何用
引入模块需要写引入代码
需要引入的JS文件中,引入的变量/方法的代码
let a = require("导出文件的路径") //路径最后的「.js」可以省略
a.导出的变量名
a.导出的函数名
2.第三方模块定义
1.别人写好具有特定功能,可以直接使用的模块,
2.包:一般多个js文件组成,存在一个文件夹内
3.第三方模块存在形式
(1)js文件形式存在,提供实现某些功能的api接口
(2)以命令行工具存在的,辅助项目开发
新增第三方模块
1.查找模块:npmjs.com 网站
2.下载模块:Noede环境中命令行:没有红色错误信息为下载成功
安装形式 | 下载代码 | 下载位置 |
---|---|---|
本地安装:js文件 | npm install 模块名称 | 下载到命令行当前目录 |
全局安装:命令行工具 | npm install 模块名称-g | 下载到公共的目录中 |
3.下载模块:开发依赖/项目依赖
依赖关系 | 使用位置 | 代码 | 记录位置 |
---|---|---|---|
开发依赖 | 线上运营阶段不需要依赖的第三方包 | –save-dev | node_modules文件夹,package.json文件devDependencies中 |
项目依赖 | 开发阶段和线上运营解决都需要依赖的第三方包 | 正常 | node_modules文件夹,package.json文件dependencie中 |
4.下载模块:描述模块互相之间依赖关系
(1)node_modules文件夹内package-lock.json 文件
(2)解决了别人因下载最近版本导致运行不起来
5.删除模块:npm unintall package 模块名称
6.模块存储:
(1)下载后,会在当前命令行文件夹下创建node_modules文件夹,并将模块存储于此处
(2)生成记录依赖关系JS文件package.json:步骤如下
1.将命令行设置为node_modules文件夹,
2.输入代码:npm init -y
,
3.生成文件:package.json,存储依赖关系;
(3)package.json文件:
1.记录了版本信息,项目名称,作者,git地址,依赖的第三方模块
2.简化命令行方式(学一半):
//package.json文件:script单词内设置
设置:"别名单词":"实际的命令"
使用:命令行工具中:实际的命令 = npm run 别名单词
(4)传输给别人源代码时,不用传递node_modules文件
//1.复杂的依赖关系如果版本升级可能会报错
//2.传输给别人的时候太卡
在命令行输入:npm install
系统:package.json文件,查询dependencies,下载记录的模块
3.模块查找规则(自己封装+系统+第三方)
1.require(“路径.js”)
(1)程序会根据路径查找模块,并且引入模块
2.require(“路径名称”):有模块路径,但后缀被省略掉了
(1)先找当前目录下路径.js的同名文件,如果没有
(2)找路径名称的同名文件夹,找到文件夹后找index.js
(3)如果没有文件夹没有index.js,会去路径名称文件夹找package.js文件中找main选项中的文件名称.js,正常来说package.js只在根目录下,系统这时候会把路径名称文件夹当成一个包了,没有的话 npm init自动生成
(4)在没有就报错了
3.require(“没有路径和后缀,例如find”)
(1)nodejs假设他是系统模块,如果没有
(2)node_modules 文件夹查找,先查找同名js文件
(3)node_modules 文件夹没有同名js文件,同名文件夹下找,package.js文件中找main选项中的文件名称.js