用gulp给vue文件添加注释

Gulp是一个自动化和增强您工作流程的工具包

利用gulp和JavaScript的灵活性来自动化缓慢、重复的工作流，并将它们组合成高效的构建管道。

建议直接输出到原有文件夹（src）然后把src替换回去 这样文件被替换后就不需要再进行手动替换了也可以输出到其他文件夹作为另一套

一般写 gulp 插件会用 through2 或者 through 这两个库
API 更加丰富，使用更加方便
但是我们的需求很简单，用 node 原生的 Transform 就可以

直接把src目录复制出来然后再覆盖一下运行命令 => gulp

var gulp = require('gulp')

const {Transform} = require('stream')

let copyright = "/**\n" +
        " * 这是注释信息 \n" +
        " * @warning 未经许可禁止私自删除版权信息.\n" +
        " */ "
let fileType = ['src/**/*.js', 'src/**/*.vue', 'src/**/*.css', 'src/**/*.scss']
let output = 'src' //建议直接原文件替换
function defaultTask (done){
    gulp.src(fileType)
            .pipe(selfPlugin())
            .pipe(gulp.dest(output));///dist文件下输出 也可以写src 原路径替换
    done()
}
const contentForFile = (file) => {
    let content = file.contents.toString() // buffer # string
    // let extension = file.extname.slice(1)//取文件类型格式
    let s = ''
    if (content.indexOf('这是注释信息') === -1) {//是否已经添加过
        s = copyright + '\n' + content
    } else {
        s = content
    }
    // file.contents 一个buffer 类型，所以把字符串转成 buffer
    let b = Buffer.from(s)
    return b
}
const selfPlugin = (options) => {
//套路写法 直接用即可
    let t = new Transform({
        objectMode: true,
        transform(file, encoding, callback) {
            // gutp 用 vinylChttps://github.com/qulpis/vinyl）来管理文件，这是一个虛拟文件格式
            // file 就是 Vinyl 类的实例
            //常用的属性有这么几个
            // contents，文件的内容，通常是 buffer 类型
            // path，文件的绝对路径
            // extname，文件的扩展名
            //因为插件只是修改文件内容，不会修改文件路径，所以只需要设買 contents 属性的值
            file.contents = contentForFile(file)
            //这足输出对象所有 key 和 valve 的写法
            // object.entries 参考 https://developer.mozilla.org/zh-CN/docs Neb /Javascript
            //             Object.entries(file).forEach(([k, v]) => {
            //                 log(`($(k}) is (${v})`)
            //             })
            //node 回调的常见写法，nuLL 表示没有报错
            // 第二个参数是file，通常我们会修改file的 contents
            return callback(null, file)
        },
    })
    return t
}


exports.default = defaultTask

以上结束

用gulp给vue文件添加注释

相关推荐