Node.js
Node.js 是一个跨平台JavaScript 运行环境,使开发者可以搭建服务器端的 JavaScript 应用程序。作用:使用Node.js编写服务器端程序
编写数据接口,提供网页资源浏览功能等等
前端工程化:为后续学习Vue和React等框架做铺垫.
node.js
建议大家装nvm来控制node版本
1. Node.js 是什么?
基于Chrome 的 V8 引擎封装,独立执行JavaScript 代码的环境
2. Node.js 与浏览器环境的JS最大区别?
Node.js 环境中没有 BOM 和 DOM
3. Node.js 有什么用?
编写后端程序:提供数据和网页资源等
前端工程化:集成各种开发中使用的工具和技术
4. Node.js 如何执行代码?
在 VSCode 终端中输入: node xxx.js 回车即可执行(注意路径)
fs模块-读写文件
模块:类似插件,封装了方法/属性
fs模块:封装了与本机文件系统进行交互的,方法/属性语法:
1.加载fs模块对象
const fs=require('fs')/fs是模块标识符:模块的名字
2.写入文件内容 fs.writeFile('文件路径','写入内容',err=>{ //写入后的回调函数})
3.读取文件内容
fs.readFile('文件路径',(err,data)=>{ //读取后的回调函数
//data 是文件内容的Buffer 数据流 })
/**目标:基于 fs 模块读写文件内容
1. 加载 fs 模块对象
2,写入文件内容
3. 读取文件内容
*/
// 1. 加载 fs 模块对象
const fs = require('fs')
//2. 写入文件内容
fs.writeFile('./test.txt', 'hello, Node.js', (err) => {
if (err) console.log(err)
else console.log('写入成功')
})
然后就会出现一个txt文件,里面写的hello node.js
//3.读取文件内容
fs.readFile('./test.txt',(err,data)=>{
if(err) console.log(err)
else console.log(data)//68 65 6c 6f........是一个buffer 16进制数据流
else console.log(data.toString())读出来为空是因为读写是异步的,把读那段嵌套在写的else就可以了
})
默认会覆盖,除非设置成追加模式
老师就是想告诉我们:用path模块实现路径处理,可以解决默认路径非调试文件路径的问题
找不到就会弹出-4058,一个绝对路径和相对路径闹麻了
注意,注意,注意:html中的js的每一句需要分号,不然压缩后会报错,js需要规范书写格式
resultStr是写入内容的参数,又不是回调函数的参数
/* 目标1:压缩 html 代码
* 需求:把回车符 \r,换行符 \n 去掉,写入到新 html 文件中
*1.1读取源 html 文件内容
*1.2正则替换字符串
* 1.3 写入到新的 html 文件中
*/
// 1.1 读取源 html 文件内容
const fs = require('fs')
const path = require('path')
fs.readFile(path.join(_dirname, 'public/index.html'),(err, data)=>{
if(err) console.log(err)
else {
const htmlStr = data.toString()
//1.2正则替换字符串
const resultStr = htmlStr.replace(/[\r\n]/g,'')
console.log(resultStr)
// 1.3 写入到新的 html 文件中
fs.writeFile(path.join(_dirname, 'dist/index.html'), resultStr, err =>{
if (err) console.log(err)
else console.log'写入成功')
})
}
})
url端口号
URL:统一资源定位符,简称网址,用于访问服务器里的资源
端口号:标记服务器里不同功能的服务程序
端口号范围:0-65535之间的任意整数
http://hmajax.itheima.net:80/api/province
协议 域名 端口号 资源路径
注意:http协议,默认访问80端口
web服务
const http=require('http')
const server=http.createServer()
// 1.2监听request请求事件,设置响应头和响应体
server.on('request', (req, res) => {
//设置响应头—内容类型—普通文本以及中文编码格式
res.setHeader('Content-Type', 'text/plain; charset=utf-8')
// 设置响应体内容,结束本次请求与响应
res.end('欢迎使用 Node.js 和 http 模块创建的Web服务')
})
// 1.3配置端口号并启动Web服务
server.listen(3000, () => {
console.log('Web服务启动成功了')
})
防火墙也出来了,就会出现网络服务,想要终止,只要ctrl+c即可
在浏览器打开localhost:3000即可打开
浏览时钟例子
req是你向服务器请求的数据对象,res则是服务器对客户端发出的响应内容,以及相应格式对象
const fs = require('fs')
const path = require('http')
// 1,基于http模块,创建Web服务
const http = require('http')
const server = http.createServer()
server.on('request', (req, res) => {
// 2. 使用 req.url 获取请求资源路径,并读取 index.html 里字符申内容返回给请求方
if (req.url === '/index.html') {
fs.readFile(path.join(__dirname, 'dist/index.html'), (err, data) => {
if (err) console.log(err)
else {
// 设置响应内容类型—html超文本字符串,让浏览器解析成标签网页等
res.setHeader('Content—Type', 'text/html;charset=utf—8')
res.end(data.toString())
}
})
} else {
// 3.其他路径,暂时返回不存在提示
res.setHeader('Content—Type', 'text/plain;charset=utf—8')
res.end('你要访问的资源不存在')
}
})
server.listen(8080, () => {
console.log('Web 服务启动成功了')
})
模块化
什么是模块化?
定义:
CommonJS 模块是为Nodejs打包JavaScript代码的原始方式。Nodejs还支持浏览器和其他JavaScript 运行时使用的 ECMAScript模块标准。 在Node.js中,每个文件都被视为一个单独的模块。
概念:项目是由很多个模块文件组成的
好处:提高代码复用性,按需加载,独立作用域使用:需要标准语法导出和导入进行使用
commonjs标准
需求:定义utils.js模块,封装基地址和求数组总和的函数
使用:
1 . 导出:modiule.exports = {}
2 .导入:require('模块名或路径‘)
const baseURL = 'http://hmajax.itheima.net'
const getArraySum = arr => arr.reduce((sum, val) => sum += val, 0)
module.exports = {
对外属件名1: baseURL,
时外属性名2: getArraySum
}
模块名或路径:
/内置模块:直接写名字(例如:fs, path, http)
/自定义模块:写模块文件路径(例如:./utils.js)
不带大括号,是简写,如果带了大括号,记得return值
ECMAscript标准,命名导出导入
1.Node.js支持哪2种模块化标准? >CommonJS标准语法(默认)
>ECMAScript 标准法
2.ECMAScript 标准,命名导出和导入的语法? >导出:export 修饰定义的语句
>导入:import{同名变量}from'模块名或路径'
3.ECMAScript 标准,默认导出和导入的语法? >导出: export default {}
>导入:import变量名from'模块名或路径
包
软件包管理npm
1 .初始化清单文件:npm init -y (得到 package json文件,有则略过此命令)
2 .下载软件包 :npmi软件包名称
3 .使用软件包
在空白文件夹,终端npm init -y,然后npm i dayjs即可
1,报错 idealTree:05: sill idealTree buildDeps看2
2.在终端打npm cache verify清一下npm内存再重新下载dayjs
/**
* 目标:使用 npm 下载 dayjs 软件包来格式化日期时间
*1.(可选)初始化项目清单文件,命令:npm init -y
*2.下载软件包到当前项目,命令:npmi软件包名称
*3.使用软件包
*/
//3,使用软件包
const dayjs = require('dayjs')
const nowDateStr = dayjs().format('YYYY-MM-DD')
console.log(nowDateStr)
安装所有依赖
传输时,就是因为这些包的积极太大上传下载太浪费时间,软件包会舍弃
输入npm i,下载package.json的所有软件包
npm -全局软件包nodemon
软件包区别:
本地软件包:当前项目内使用,封装属性和方法,存在于node_modules
全局软件包:本机所有项目使用,封装命令和工具,存在于系统设置的位置
nodemon作用:替代node命令,检测代码更改,自动重启程序
使用:
1 .安装:npm i nodemon - g ( -g代表安装到全局环境中)
2 .运行:nodemon待执行的目标js文件
需求:启动准备好的项目,修改代码保存后,观察自动重启应用程序
输入server.js,打开服务,会显示nodemon的状态
Node.js与Webpack-14.npm全局软件包-nodemon_哔哩哔哩_bilibili,大量的弹幕可以帮助你