nodejs 通过gulp、gulp-ejs利用模板生成文件

后端 2019-11-30T16:21:10 浏览:58

在日常做项目的时候,总是有一类增删改查的页面出现率都是极其高的,因为项目采用了分层的思想构建,每次新建一个模块都需要重复复制更改好几处文件,因此我想做一个简单的脚手架来快速生成页面(按照某一模板),在其上面进行具体业务修改进而提高开发效率。

1.技术栈

技术栈很简单,这里选用的是gulp和gulp-ejs(当然同类的实现方法也有很多,有原生的或者百度的fis3,gulp-rename和gulp-clean 这2个可有可无,这里只是用作对生成后的文件进行重命名和删除作用。

package.json

{
  "name": "temtofile",
  "version": "1.0.0",
  "description": "通过初始化模板生成指定的文件",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "mla.xin",
  "license": "ISC",
  "devDependencies": {
    "gulp": "^4.0.2",
    "gulp-clean": "^0.4.0",
    "gulp-ejs": "^4.1.2",
    "gulp-rename": "^1.4.0"
  }
}

执行npm install 安装相关依赖

2.配置gulpfile.js

const gulp = require('gulp');
const gulp_ejs = require('gulp-ejs');
const gulp_rename = require("gulp-rename");
const gulp_clean = require('gulp-clean');
gulp.task('clean', function() {
    return gulp.src('dist')
        .pipe(gulp_clean());
});
gulp.task('build',async()=>{
    const data = {
        moduleName : "服务项目",
        moduleClass : "Service",
        moduleObj : "service"
    };
    await gulp.src(['templates/*/*.{html,js}']) 
    .pipe(gulp_ejs(data))
    .pipe(gulp_rename(function (path) {
        path.basename = data.moduleObj;
    }))
    .pipe(gulp.dest('dist'));
})

执行gulp build 即可根据模板文件生成指定的文件。

时间大概1s就可以解决问题,人工操作可不是这么点时间了,而且容易出错。