哈喽大家好，我仍旧是那个可恶的蛙人。
我在北京某个角落和某人苦苦逼逼在写码，你在那里过得好的嘛，某人会给你加需要嘛。
话不多说，间接楼代码。
演示
咱们先来演示一下残缺成果
我写这个例子呢，就是我在写vue我的项目中，每次创立一个文件还得手动敲<template> <script> <style>标签，这样就很繁琐。我最近呢也在捣鼓Gulp发现它还能这样玩，"输入文件"，"模板注入"。如果对这个demo感兴趣的小伙伴持续往下看，我贴上代码。
配置环境
如果还没装Gulp环境，请到这里Gulp官网装置，上面我来说一下用到的gulp插件
npm i gulp-inject --save // 模板注入 这种模板注入只能依据正文地位来注入，所以想要注入必须有正文地位，不懂的百度参考资料一大堆npm i gulp-replace --save // 替换内容npm i gulp-rename --save // 批改文件名称gulpFile.js
const { src, dest } = require('gulp');const rename = require('gulp-rename'); // 批改代码后缀const inject = require('gulp-inject') // 模板注入const replace = require('gulp-replace') // 替换内容// 创立页面function createPage(cb) { const len = process.argv.length - 1 const pageName = process.argv[len].slice(2, process.argv[len].length) // 获取自定义文件名称参数 src('./template/template.vue') // 找到要注入的模板 .pipe(rename(`${pageName}.vue`)) // 替换成咱们终端里参数的名称 .pipe(inject(src('./template/index.vue'), { // 这里的index.vue是个空文件就行 starttag: '// start', endtag: '// end', transform() { return `<template> <div id="${pageName}"><div> // 以后文件名称作为标识id</template>` } })) .pipe(replace('// start', '')) // 将正文替换为空 .pipe(replace('// end', '')) // 将正文替换为空 .pipe(dest(__dirname + '/dist')) // 最初输入到别的目录中 cb() }exports.page = createPage // 导出工作template/template.vue
// start// end<script>export default { data() { return { } }, methods: { }}</script><style scoped lang="stylus"></style>template/index.vue
这个文件是个空文件就行