【Node.js】 - 概念 fs path模块 压缩HTML代码

一、概念

Node.js是一个跨平台javaScript运行环境，使开发者可以搭建服务器端的JavaScript应用程序

作用：

1.编写数据接口，提供网页资源浏览功能等等

2.前端工程化

二、什么是前端工程化

开发项目直到上线，过程中集成的所有工具和技术

Node.js是前端工程化的基础(因为Node.js可以主动读取前端代码内容)

三、Node.js为何能执行JS

首先：浏览器能执行JS代码，依靠的是内核中的V8引擎（C++程序）

其次：Node.js是基于ChromeV8引擎进行封装（运行环境）

区别：都支持ECMAScript标准语法，Node.js有独立的API

注意：Node.js环境没有DOM和BOM等

四、代码示例

console.log('Hello,Node.js')
for (let i = 0; i < 3; i++) {
    console.log(6)
}

在集成终端输入node +相对路径(也就是该文件夹下的某一个文件名字)

五、Node.js中的fs模块

1.概念

模块：类似插件，封装了方法/属性

fs模块封装了与本机文件系统进行交互的方法/属性

2.语法

1.加载fs模块对象

2.写入文件

3.读取文件内容

const fs = require('fs') // fs是模块标识符：模块的名字
fs.writeFile('文件路径','写入内容',err => {
    //写入后的回调函数
})

fs.readFile('文件路径',(err,data) =>{
    //读取后的回调函数
    //data 是文件内容的 Buffer 数据流
})

3.代码示例

const fs = require('fs')
fs.writeFile('./test.txt', 'hello,node.js', (err) => {
    if (err) {
        console.log(err)
    } else {
        console.log('写入成功')
    }
})
fs.readFile('./test.txt', (err, data) => {
    if (err) console.log(err)
    //data是buffer 16进制数据流对象
    else console.log(data.toString())
})

六、path模块-路径处理

1.为何使用path模块

在Node.js代码中，相对路径是根据终端所在路径来查找的，可能无法找到你想要的文件

我们用一个例子来说明

我在nodejs文件夹下的03文件夹下的index.js代码中想读取nodejs文件夹下的test.txt里的内容

const fs = require('fs')
// 1. 引入 path 模块对象
const path = require('path')
fs.readFile(path.join('../test.txt'), (err, data) => {
  if (err) console.log(err)
  else console.log(data.toString())
})

为什么会报错呢？因为此时我们终端的位置在nodejs这个位置，此时终端只会从该位置开始向父级文件去查找

2.解决方法

在Node.js代码中，使用绝对路径

——dirname内置变量(获取当前模块目录-绝对路径)

注意：path.join()会使用特定于平台的分隔符，作为定界符，将所有给定的路径片段连接在一起

3.语法

1.加载path模块

2.使用path.join方法，拼接路径                             

示例代码如下：

onst fs = require('fs')
// 1. 引入 path 模块对象
const path = require('path')
// 2. 调用 path.join() 配合 __dirname 组成目标文件的绝对路径
console.log(__dirname)
fs.readFile(path.join(__dirname, '../test.txt'), (err, data) => {
  if (err) console.log(err)
  else console.log(data.toString())
})

七、案列

/**
 * 目标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('写入成功')
    })
  }
})