请勿搬运谢谢

一、fs的基本应用

fs模块是Node.js提供一组文件操作API，用于对系统文件及目录进行读写操作。

const fs = require('fs') 

1.1 判断dist目录是否存在

讯享网fs.exists('文件夹路径', result => console.log(result)) //异步 const exists = fs.existsSync('文件夹路径') //同步 

1.2 创建文件夹

fs.mkdir('文件夹路径') //异步 fs.mkdirSync('文件夹路径') //同步 

1.3 读取文件

讯享网//异步读取 fs.readFile('文件路径', (err, file) => { 
    if (!err) console.log(file.toString()) // 打印文件内容  }) // 通过异步读取文件内容 //同步读取 const file = fs.readFileSync('文件路径') 

1.4 写入文件

默认写入方式是直接覆盖源文件，先清空文件再写入

// 通过异步读取文件 fs.readFile('文件路径', (err, file) => { 
    if (!err) fs.writeFile('文件路径', file, () => { 
   }) // 通过异步写入文件 }) // 同步写入文件 const code = fs.readFileSync('文件路径') // 同步读取文件 fs.writeFileSync('文件路径', code) 

追加写入

讯享网const code = fs.readFileSync('文件路径') fs.writeFileSync('文件路径', code, { 
    flag: 'a' }) 

增加flag属性进行标识，当flag的值为a时，表示追加写入

二、path的基本应用

path模块是Node.js提供的用于处理文件路径的函数集合。

const path = require('path') 

2.1 生成绝对路径

讯享网const OutPath=path..resolve('追加路径1','追加路径2') 

path.resolve()的工作机制：
从左往右依次拼装路径；
如果参数为相对路径，则会将相对路径拼接起来，再加上当前目录的绝对路径合并成一个完整路径；
如果参数为绝对路径，则会以最后一个参数的绝对路径为准；
如果参数既有绝对路径也有相对路径，则会按照从左向后的顺序进行拼接。

2.2生成相对路径

const absolutePath = path.resolve('src', 'vue/path/index.js') console.log(path.relative('./', absolutePath)) console.log(path.relative(absolutePath, './')) //. src/vue/path/index.js //. ../../../.. 

三、bubel基本应用

buble是一款类似babel的ES编译器

3.1 buble命令行模式

全局安装
npm i -g buble
使用
bable 文件路径

3.2 buble Api模式

安装库
npm i -D buble
创建执行文件 buble-build.js

讯享网const buble = require('buble') const fs = require('fs') const path = require('path') const codePath = path.resolve('需要编译js文件路径') // 获取代码的绝对路径 const file = fs.readFileSync(codePath) // 获取缓冲区文件内容 const code = file.toString() // 将缓冲区文件转为文本格式 const result = buble.transform(code) // 通过buble编译代码 //buble.transfomrm()方法传入的参数必须是String类型 console.log(result.code) // 打印buble编译的代码 

四、静态类型检查

flow是Javascript静态代码类型检查器，Vue.js应用flow进行类型检查

4.1 引入库
npm i -D flow-bin
4.2 修改package.json，在scripts中添加flow指令：

{ 
    "scripts": { 
    "test": "echo \"Error: no test specified\" && exit 1", "flow": "flow" } 

4.3 初始化flow
npm run flow init
flow只会检查代码顶部添加了/* @flow */或// flow的源码
4.4 检查当前目录下的文件
npm run flow
就会对类型错误的自动纠正
4.5 使node支持静态类型检查
npm i -D @babel/plugin-transform-flow-strip-types
.babelrc配置文件，增加flow插件的支持

讯享网{ 
    "presets": [ "@babel/preset-env" ], "plugins": [ "@babel/plugin-transform-flow-strip-types" ] } 

执行babel-node
babel-node 文件目录

讯享网

五、zlib的基本应用

zlib.gzip(buffer[, options], callback)
参数的含义如下：
buffer：需要压缩文件的buffer
options：参数，可以为空
callback：压缩成功后的回调函数

使用

fs.readFile('./dist/index-cjs.js', (err, code) => { 
    if (err) return console.log('原文件容量:' + code.length) zlib.gzip(code, (err, zipped) => { 
    if (err) return console.log('gzip压缩后容量:' + zipped.length) }) } 

六 terser的基本应用

terser是一个Javascript代码的压缩和美化工具
1.全局安装
npm i -g terser
2.通过terser压缩文件：
terser dist/index-cjs.js
如果先输入参数再输入文件，建议增加双短划线（–）进行分割：
terser -c -m -o dist/index-cjs.min.js -- dist/index-cjs.js

各参数的含义如下：
-c / --compress：对代码格式进行压缩
-m / --mangle：对变量名称进行压缩
-o / --output：指定输出文件路径

加入-c后
变量定义更加紧凑；
将if判断改为了三目运算符；
console.log时直接将变量替换为值。

加入-m后
主要修改了变量的名称，如random函数中的形参base变成了a

terser API模式

引入库
npm i -D terser
创建执行js文件 index.js

讯享网const fs = require('fs') const terser = require('terser') const code = fs.readFileSync('需要压缩的文件路径').toString() // 同步读取代码文件 const minifyCode = terser.minify(code, { 
    // 通过terser.minify进行最小化压缩 output: { 
    ascii_only: true // 仅支持ascii字符，非ascii字符将转成\u格式 }, compress: { 
    pure_funcs: ['func'] // 如果func的返回值没有被使用，则进行替换 } }) console.log(minifyCode.code) 

执行
node index.js

rollup-plugin-vue

打包对vue文件的支持
npm i -D rollup-plugin-vue
引入插件

rollup-plugin-postcss

打包对css文件的支持
npm i -D rollup-plugin-postcss
引入插件

sass

打包对sass文件的支持
npm i -D sass

参考链接 ：链接