什么是Node.js
Node.js 是一个免费的、开源的、跨平台的 JavaScript 运行时环境,使开发者可以搭建服务器端的JavaScript应用程序
概念: 使用Node.js编写后端程序 // 支持前端工程化
后端程序:提供接口和数据 ,网页资源
前端工程化 :对代码压缩 ,转译,整合测试 自动部署(使用各种工具,提升效率)
Node.js为何能执行js?
浏览器能执行js代码,依靠的是内核中的v8引擎(c++程序)
Node.js是基于Chrome V8引擎 进行封装(运行环境)
区别:都支持ECMAScript标准语法,Node.js有独立的api (Node环境没有DOM和Bom)
Node.js安装
https://nodejs.org/dist/v18.17.0/ 下一步安装
注意:
1: 安装在非中文路径下
2.无需勾选安装其他的配置软件
检测是否安装成功
windows+r 打开cmd中断 输入node -v 命令 查看版本号
使用node.js
新建js文件,编写代码,在node环境下运行
在vscode集成终端中,输入node xxx.js 回车执行
console.log("hello")
for(let i = 0;i<3;i++){
console.log(6)
}
fs模块-读写文件
模块:类似插件,封装了方法/属性
fs模块:封装了与本机文件系统进行交互的 方法/属性
加载fs模块
const fs = require('fs')
写入文件内容
fs.writeFile('文件路径','写入内容',err=>{
//写入后的回调函数
})
读取文件内容
fs.readFile('文件路径',(err,data)=>{
//写入后的回调函数
//data文件内容的Buffer数据流
})
path模块--路径处理
在node.js中,使用绝对路径
__dirname
模块内置变量(获取当前模块目录名)
案例-压缩前端 html
压缩前端代码,让浏览器加载网页更快
前端工程化 :对代码压缩 ,转译,整合测试 自动部署(使用各种工具,提升效率)
需求:把回车符 和换行符去掉 进行压缩,写入到新html中
- 读取html文件内容
- 正则替换字符串
- 写入到新的html文件中
public/index.html
javascript
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div class="box">
<ul>
<li>111</li>
<li>222</li>
<li>333</li>
</ul>
</div>
</body>
</html>
public/index,js
javascript
console.log('123');
for (let i = 0; i < 4; i++) {
console.log(i);
}
build.js
javascript
/*
需求:把public/index.html里的回车符,和换行符去掉,进行压缩,写入到新dist/index.html中
- 读取html文件内容
- 正则替换字符串
- 写入到新的html文件中
需求:压缩js里的代码,并整合到html中一起运行
1.读取js文件内容
2.正则替换内容
3.拼接html内容写入到 dist/index.html
*/
const fs = require('fs')
const path = require('path')
// 把public / index.html里的回车符,和换行符去掉,进行压缩,写入到新dist / index.html中
fs.readFile(path.join(__dirname, 'public', 'index.html'), (err, data) => {
const htmlStr = data.toString()
// console.log(htmlStr);
// 正则替换字符串
const resultStr = htmlStr.replace(/[\r\n]/g, '')
// console.log(resultStr);
fs.readFile(path.join(__dirname, 'public', 'index.js'), (err, data1) => {
const jsStr = data1.toString()
// console.log(jsStr);
// 正则替换字符串
const jsResultStr = jsStr.replace(/[\r\n]/g, '').replace(/console.log\('.+'\);/g, '')
// console.log(jsResultStr);
// 写入到新的html文件中
fs.writeFile(path.join(__dirname, 'dist', 'index.html'), resultStr + jsResultStr, err => {
if (err) { console.log(err); }
else { console.log('压缩成功'); }
})
})
})
URL中的端口号
URL :统一资源定位符,简称网址,用于访问网络上的资源
端口号:标记服务器里对应服务程序(0-65535的整数)
http://xxxx.com:88/api/login
http模块--创建web服务
基于http模块编写程序,返回给请求方 'hello world'
- 引入http模块,创建web服务对象
- 监听request请求事件,对本次请求,做一些响应处理
- 启动web服务监听对应端口号
- 运行本服务在终端,用浏览器发起请求
案例:基于web服务,开发提供省份列表数据的接口,了解后端的代码工作过程