文章目录
环境变量
储存系统中目录,在命令行中执行命令的时候系统会自动去这些目录中查找命令的位置 自动找exe文件
node.js 模块化开发
- JavaScript开发弊端
文件依赖 和 命名冲突
模块化开发能解决这个问题
Node.js规定一个JavaScript文件就是一个模块,模块内部定义的变量和函数默认情况下外部无法得到
-
require返回exports对象
-
module.exports
也是一个模块
exports是module.exports的别名(地址引用关系),导出对象最终以module.exports为准
只改属性名等价,但当exports对象和module.exports对象指向的不是同一个对象时 以module.exports为准
let a = 1;
let b = 2;
exports.a = a;
module.exports.b = b;
// 此时require导出的对象是 {a:1,b:2} 指向同一个对象
// 如果直接改指向
module.exports = {
name : li
}
exports = {
age : 19
}
// 此时require 的对象是 {name: li} 即以 module.exports为准
系统模块
node运行环境提供的内置API
系统模块fs 文件操作
Node 内置模块中的 fs(文件处理模块)
fs 的英文全称是 File System。fs 模块提供了很多 api 方法,我们首先应该学习的方法是文件读取
读取和写入都是耗时操作,无法同步接收返回值,需要callback函数等待执行
文件读取:
// 导入fs模块
const fs = require('fs');
// 读取文件内容
fs.reaFile('文件路径/文件名称'[,'文件编码'],callback);
// 中括号是可选参数 回调函数等待文件读取成功后执行
// 读取上一级css目录下的index.css
fs.readFile('../css/index.css','utf-8',(err, doc)=>{
//如果文件读取发生错误 参数err的值为错误对象 否则err的值为null
// doc参数为文件内容
if(err == null){// 没有错误
//在控制台输出文件内容
console.log(doc);
}
});
node.js所有回调函数的第一个参数都是err
node.js 是错误优先函数
文件写入:
fs.writeFile('文件路径/文件名称','数据',callback);
// 写入成功后 执行callback函数
/* -----------*/
const content = '<p>正在使用fs.writeFile写入文件内容</p>';
fs.writeFile('../index.html',content, err =>{
if(err != null){ // 出错
console.log(err);
return;
}
console.log('文件写入成功');
}
当写入文件不存在时 会自动创建该文件
系统模块path 路径操作
几个常见路径
-
__dirname
:这是一个常量,表示:当前执行文件所在绝对路径。一般文件操作使用绝对路径 -
__filename
:这是一个常量。表示:当前执行文件的完整目录 + 文件名。 -
process.cwd
:获取当前执行 Node命令 时的目录名。
代码举例:
console.log(__dirname);
console.log(__filename);
console.log(process.cwd());
文件拼接
为什么要进行路径拼接:不同操作系统的路径分隔符不统一
- Windows 是 \
- Linux 是 /
如果手动拼接路径容易出错
解释:使用平台特定的分隔符作为定界符将所有给定的 path 片段连接在一起,然后规范化生成的路径。
路径拼接:
path.join('路径','路径',...)
/* ---- */
// 导入path模块
const path = require('path');
//路径拼接
let finalPath1 = path.join('itcast','a','b','c.css');
console.log(finalPath1); // itcast\a\b\c.css (起始没有/)
let finalPath2 = path.join('/itcast','a','b','c.css');
console.log(finalPath2); //\itcast\a\b\c.css (起始没有/)
let finalPath3 = path.join(__dirname, 'c.css')
console.log(finalPath3); // C:\User\a\b\c.css (js文件所在绝对路径)
require的相对路径就是相对于当前文件的路径
大多数时候相对的是命令行工具的工作目录 所以需要使用绝对路径
第三方模块
概念
别人写好的具有特定功能的直接能用的模块,由于第三方模块通常是多个文件放在一个文件夹里所以又命名包
第三方模块有两种存在形式:
- 以js文件的形式存在,提供实现项目具体功能的API接口
- 以命令行工具形式存在,辅助项目开发
获取第三方模块
npm(node package manager): node的第三方模块管理工具
下载:npm install 模块名称
下载到命令行目录下
删除:npm untinstall 模块名称
全局安装 / 本地安装
- 命令行工具:全局安装
- 库文件:本地安装
第三方模块 nodemon
nodemon是一个命令行工具
保存后自动执行(类似liveserver)
使用步骤:
- 使用npm install nodemon -g
(-g 代表全局安装) - 在命令行工具中用nodemon命令代替node命令执行文件
监控文件保存 并自动执行
ctrl + c 终止操作
第三方模块 nrm
提高速度
nrm(npm registry manager)
npm下载地址在国外吗,国内速度慢 nrm是国内下载
使用步骤:
- 使用npm install nrm -g 下载
- 查询可用下载地址列表nrm ls
- 切换npm下载地址 nrm use 下载地址名称
nrm use taobao
转换到淘宝下载地址
再 npm install
速度就很快
第三方模块 Gulp
基于node平台开发的前端构建工具
将机械化操作编写成任务,机器代替手工
能做什么
- html css js文件压缩合并
- 语法转换(es6 less)
- 公共文佳抽离
- 修改文件浏览器自动刷新
gulp使用
- npm install gulp 下载库文件(本地)
- 在项目根目录下建立gulpfile.js文件
- 重构项目的文件夹结构 src目录放置源代码文件 dist目录放置构建后文件
- 在gulpfile.js文件中编写任务
- 在命令行工具中执行gulp任务
gulp中提供的方法
- gulp.src(): 获取任务要处理的文件
- gulp.dest(): 输出文件
- gulp.task(): 简历gulp任务
- gulp.watch(): 监控文件的变化
const gulp = require('gulp');
//使用gulp.task()方法建立任务
gulp.task('first',()=>{
// 第一个参数是名字 区分每个任务用
// 获取要处理的文佳
gulp.src('./src/css/index.html').pipe(gulp.dest('./dist/css'));
//将处理后的文件输出到dist目录 如果没有目录会自动创建
//必须把要处理的代码写到pipe里
})
命令行中 gulp 任务名
执行
gulp插件
gulp本身提供的方法很少 压缩等其他功能都是通过插件实现的
- gulp-htmlmin: html文件压缩
- gulp-csso: 压缩css
- gulp-babel: JavaScript语法转化
- gulp-less: less语法转化
- gulp-ugligy: 压缩混淆JavaScript
- gulp-file-include 公共文件包含
- browsersync 浏览器实时同步
…
gulp-file-include
抽取公共代码
html中语法:
<body>
@@include('./hader.html');
</body>
…
gulp还有好多插件 查文档会用就行
也可以参考百度云下的代码demo
package.json 文件
传项目的时候不需要发 node_modules 了 太大太慢
所依赖 下载过的模块都记录在 package.json文件中了
拿到项目后直接 npm install
就可以获取所有依赖模块
在"dependencies" 属性中
scripts属性
给命令别称 遇到特别长的时候简化输入
这个例子不是很长奥
"scripts": {
"build": "nodemon app.js"
},
命令行中:
npm run build === nodemon app.js
项目依赖 / 开发依赖
-
项目依赖
类似jQuery 这种项目运行需要的称为项目依赖
使用npm install 包命令下载的文件会默认添加到package.json文件的dependencies属性中 -
开发依赖
开发中需要的模块 类似gulp 不影响项目运行
- 使用npm install 包名 --save-dev命令将包添加到package.json文件的devDependencies字段中
npm install 会下载所有依赖
npm install --production 只下载项目依赖
package-lock.json
- 锁定包的版本,确保再次下载时不会因为包版本不同而产生问题)(避免下到新版本hhh)
- 加快下载速度,因为该文件中已经记录了项目所依赖第三方包的树状结构和包的下载地址,重新安装时只需下载即可,不需要做额外的工作
Node.js中模块加载机制
模块查找规则 – 当模块拥有路径但没有后缀时
require('./find.js')
require('./find')
- require方法根据模块路径查找模块,如果是完整路径,直接引入模块。
- 如果模块后缀省略,先找同名JS文件再找同名JS文件夹
- 如果找到了同名文件夹,找文件夹中的index.js
- 如果文件夹中没有index.js就会去当前文件夹中的package.json文件中查找main选项中的入口文件
- 如果找指定的入口文件不存在或者没有指定入口文件就会报错,模块没有被找到
模块查找规则 – 当模块没有路径且没有后缀时
- Node.js会假设它是系统模块
- Node.js会去node_modules文件夹中
- 首先看是否有该名字的JS文件
- 再看是否有该名字的文件夹
- 如果是文件夹看里面是否有index.js
- 如果没有index.js查看该文件夹中的package.json中的main选项确定模块入口文件
- 否则找不到报错