1. 在package.json中，写入脚本
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"temp": "node util/template.js"
},
2.在util/template文件夹下，创建通用模版。
main.html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no,minimal-ui,viewport-fit=cover">
<meta content="yes" name="apple-mobile-web-app-capable">
<meta content="black" name="apple-mobile-web-app-status-bar-style">
<meta name="format-detection" content="telephone=no, email=no">
<meta name="W_design" content="750">
<!-- 页面 page id start-->
<meta name="WT.pagetitle" content=""></meta>
<meta name="WT.pageID" content=""></meta>
<!-- 页面 page id end-->
<title></title>
<script src="./static/base/js/flexible.js"></script>
</head>
<body>
<noscript>
<strong>浏览器版本过低，无法支持此页面，请升级页面；</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
----------------------
main.js:
import Vue from 'vue'
import App from './main.vue'
Vue.config.productionTip = false
new Vue({
render: h => h(App),
}).$mount('#app')
---------------------
main.vue:
<template>
<div class="app">
</div>
</template>
<script>
export default {
data() {
return {
};
},
methods: {
},
components: {
}
};
</script>
<style type="text/css" lang="scss" scoped>
</style>
-------------------
3. 在util路径下，创建template.js执行脚本
/**
* 通过模版创建页面
*/
const path = require('path');
const fs = require('fs');
const readlineSync = require('readline-sync');
// 输入需要创建的页面名称
let pageName = readlineSync.question('enter your page name: ');
// 目标模块目录的地址
const pagePath = path.resolve(__dirname, '../src/pages', pageName);
console.log('pagePath',pagePath)
// 模板地址
const templatePath = path.resolve(__dirname, '../util/template');
console.log('templatePath',templatePath)
// 判断目标页面目录是否存在
if (fs.existsSync(pagePath)) {
// 存在指定页面，提示错误并退出程序
console.error(`${pageName} page is exists`)
process.exit()
}
// 创建目标页面目录
fs.mkdirSync(pagePath);
// 需要复制的文件
const copyFiles = ['main.html', 'main.js', 'main.vue'];
const copy = (source) => {
for (const item of source) {
// 读取模板中对应文件的内容
let fileText = fs.readFileSync(path.join(templatePath, item));
// 写入到目标页面中对于的文件中
fs.writeFileSync(path.join(pagePath, item), fileText)
}
}
// 执行复制操作
copy(copyFiles);
console.log('Successful page creation!');
--------------------
/**
* 通过模版创建页面
*/
const path = require('path');
const fs = require('fs');
const readlineSync = require('readline-sync');
// 输入需要创建的页面名称
let pageName = readlineSync.question('enter your page name: ');
// 目标模块目录的地址
const pagePath = path.resolve(__dirname, '../src/pages', pageName);
console.log('pagePath',pagePath)
// 模板地址
const templatePath = path.resolve(__dirname, '../util/template');
console.log('templatePath',templatePath)
// 判断目标页面目录是否存在
if (fs.existsSync(pagePath)) {
// 存在指定页面，提示错误并退出程序
console.error(`${pageName} page is exists`)
process.exit()
}
// 创建目标页面目录
fs.mkdirSync(pagePath);
// 需要复制的文件
const copyFiles = ['main.html', 'main.js', 'main.vue'];
const copy = (source) => {
for (const item of source) {
// 读取模板中对应文件的内容
let fileText = fs.readFileSync(path.join(templatePath, item));
// 写入到目标页面中对于的文件中
fs.writeFileSync(path.join(pagePath, item), fileText)
}
}
// 执行复制操作
copy(copyFiles);
console.log('Successful page creation!');