feature: add create template (#1762)
This commit is contained in:
parent
a9b4467472
commit
896b7369bf
|
@ -13,7 +13,8 @@
|
||||||
"lint": "eslint --ext .js,.vue src",
|
"lint": "eslint --ext .js,.vue src",
|
||||||
"test": "npm run lint",
|
"test": "npm run lint",
|
||||||
"test:unit": "vue-cli-service test:unit",
|
"test:unit": "vue-cli-service test:unit",
|
||||||
"svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml"
|
"svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml",
|
||||||
|
"new": "plop"
|
||||||
},
|
},
|
||||||
"husky": {
|
"husky": {
|
||||||
"hooks": {
|
"hooks": {
|
||||||
|
@ -87,6 +88,7 @@
|
||||||
"lint-staged": "7.2.2",
|
"lint-staged": "7.2.2",
|
||||||
"mockjs": "1.0.1-beta3",
|
"mockjs": "1.0.1-beta3",
|
||||||
"node-sass": "^4.9.0",
|
"node-sass": "^4.9.0",
|
||||||
|
"plop": "2.3.0",
|
||||||
"runjs": "^4.3.2",
|
"runjs": "^4.3.2",
|
||||||
"sass-loader": "^7.1.0",
|
"sass-loader": "^7.1.0",
|
||||||
"script-ext-html-webpack-plugin": "2.1.3",
|
"script-ext-html-webpack-plugin": "2.1.3",
|
||||||
|
|
|
@ -0,0 +1,26 @@
|
||||||
|
{{#if template}}
|
||||||
|
<template>
|
||||||
|
<div />
|
||||||
|
</template>
|
||||||
|
{{/if}}
|
||||||
|
|
||||||
|
{{#if script}}
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: '{{ properCase name }}',
|
||||||
|
props: {},
|
||||||
|
data() {
|
||||||
|
return {}
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {},
|
||||||
|
methods: {}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
{{/if}}
|
||||||
|
|
||||||
|
{{#if style}}
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
{{/if}}
|
|
@ -0,0 +1,55 @@
|
||||||
|
const { notEmpty } = require('../utils.js')
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
description: 'generate vue component',
|
||||||
|
prompts: [{
|
||||||
|
type: 'input',
|
||||||
|
name: 'name',
|
||||||
|
message: 'component name please',
|
||||||
|
validate: notEmpty('name')
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'checkbox',
|
||||||
|
name: 'blocks',
|
||||||
|
message: 'Blocks:',
|
||||||
|
choices: [{
|
||||||
|
name: '<template>',
|
||||||
|
value: 'template',
|
||||||
|
checked: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '<script>',
|
||||||
|
value: 'script',
|
||||||
|
checked: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'style',
|
||||||
|
value: 'style',
|
||||||
|
checked: true
|
||||||
|
}
|
||||||
|
],
|
||||||
|
validate(value) {
|
||||||
|
if (value.indexOf('script') === -1 && value.indexOf('template') === -1) {
|
||||||
|
return 'Components require at least a <script> or <template> tag.'
|
||||||
|
}
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
actions: data => {
|
||||||
|
const name = '{{properCase name}}'
|
||||||
|
const actions = [{
|
||||||
|
type: 'add',
|
||||||
|
path: `src/components/${name}/index.vue`,
|
||||||
|
templateFile: 'plop-templates/component/index.hbs',
|
||||||
|
data: {
|
||||||
|
name: name,
|
||||||
|
template: data.blocks.includes('template'),
|
||||||
|
script: data.blocks.includes('script'),
|
||||||
|
style: data.blocks.includes('style')
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
|
||||||
|
return actions
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,9 @@
|
||||||
|
exports.notEmpty = name => {
|
||||||
|
return v => {
|
||||||
|
if (!v || v.trim === '') {
|
||||||
|
return `${name} is required`
|
||||||
|
} else {
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,26 @@
|
||||||
|
{{#if template}}
|
||||||
|
<template>
|
||||||
|
<div />
|
||||||
|
</template>
|
||||||
|
{{/if}}
|
||||||
|
|
||||||
|
{{#if script}}
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: '{{ properCase name }}',
|
||||||
|
props: {},
|
||||||
|
data() {
|
||||||
|
return {}
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {},
|
||||||
|
methods: {}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
{{/if}}
|
||||||
|
|
||||||
|
{{#if style}}
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
{{/if}}
|
|
@ -0,0 +1,55 @@
|
||||||
|
const { notEmpty } = require('../utils.js')
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
description: 'generate a view',
|
||||||
|
prompts: [{
|
||||||
|
type: 'input',
|
||||||
|
name: 'name',
|
||||||
|
message: 'view name please',
|
||||||
|
validate: notEmpty('name')
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'checkbox',
|
||||||
|
name: 'blocks',
|
||||||
|
message: 'Blocks:',
|
||||||
|
choices: [{
|
||||||
|
name: '<template>',
|
||||||
|
value: 'template',
|
||||||
|
checked: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '<script>',
|
||||||
|
value: 'script',
|
||||||
|
checked: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'style',
|
||||||
|
value: 'style',
|
||||||
|
checked: true
|
||||||
|
}
|
||||||
|
],
|
||||||
|
validate(value) {
|
||||||
|
if (value.indexOf('script') === -1 && value.indexOf('template') === -1) {
|
||||||
|
return 'View require at least a <script> or <template> tag.'
|
||||||
|
}
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
actions: data => {
|
||||||
|
const name = '{{name}}'
|
||||||
|
const actions = [{
|
||||||
|
type: 'add',
|
||||||
|
path: `src/views/${name}/index.vue`,
|
||||||
|
templateFile: 'plop-templates/view/index.hbs',
|
||||||
|
data: {
|
||||||
|
name: name,
|
||||||
|
template: data.blocks.includes('template'),
|
||||||
|
script: data.blocks.includes('script'),
|
||||||
|
style: data.blocks.includes('style')
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
|
||||||
|
return actions
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,7 @@
|
||||||
|
const viewGenerator = require('./plop-templates/view/prompt')
|
||||||
|
const componentGenerator = require('./plop-templates/component/prompt')
|
||||||
|
|
||||||
|
module.exports = function(plop) {
|
||||||
|
plop.setGenerator('view', viewGenerator)
|
||||||
|
plop.setGenerator('component', componentGenerator)
|
||||||
|
}
|
Loading…
Reference in New Issue