更新全局组件存放目录，更新plop模版

Author: hooray

plop-templates/component/index.hbs

@@ -1,10 +1,6 @@
 <template>
     <div>
-        {{#if isGlobal}}
-        <!-- 全局组件：<{{ properCase name }} /> -->
-        {{else}}
-        <!-- 组件：<{{ properCase name }} /> -->
-        {{/if}}
+        <!-- 组件内容区 -->
     </div>
 </template>
 
@@ -17,7 +13,6 @@ export default {
     data() {
         return {}
     },
-    created() {},
     mounted() {},
     methods: {}
 }

plop-templates/component/prompt.js

@@ -1,6 +1,36 @@
+const fs = require('fs')
+
+function getFolder(path) {
+    let components = []
+    const files = fs.readdirSync(path)
+    files.forEach(function(item) {
+        let stat = fs.lstatSync(path + '/' + item)
+        if (stat.isDirectory() === true && item != 'components') {
+            components.push(path + '/' + item)
+            components.push.apply(components, getFolder(path + '/' + item))
+        }
+    })
+    return components
+}
+
 module.exports = {
     description: '创建组件',
     prompts: [
+        {
+            type: 'confirm',
+            name: 'isGlobal',
+            message: '是否为全局组件',
+            default: false
+        },
+        {
+            type: 'list',
+            name: 'path',
+            message: '请选择组件创建目录',
+            choices: getFolder('src/views'),
+            when: answers => {
+                return !answers.isGlobal
+            }
+        },
         {
             type: 'input',
             name: 'name',
@@ -12,25 +42,20 @@ module.exports = {
                     return true
                 }
             }
-        },
-        {
-            type: 'confirm',
-            name: 'isGlobal',
-            message: '是否为全局组件',
-            default: false
         }
     ],
     actions: data => {
-        const name = '{{properCase name}}'
+        let path = ''
+        if (data.isGlobal) {
+            path = 'src/components/{{properCase name}}/index.vue'
+        } else {
+            path = `${data.path}/components/{{properCase name}}/index.vue`
+        }
         const actions = [
             {
                 type: 'add',
-                path: `src/components/${data.isGlobal ? 'global/' : ''}${name}/index.vue`,
-                templateFile: 'plop-templates/component/index.hbs',
-                data: {
-                    name: data.name,
-                    isGlobal: data.isGlobal
-                }
+                path: path,
+                templateFile: 'plop-templates/component/index.hbs'
             }
         ]
         return actions

plop-templates/page/index.hbs

@@ -1,21 +1,18 @@
 <template>
     <div>
-        {{#if isLayout}}
-        <!-- 布局页面：{{ properCase name }} -->
-        <RouterView />
-        {{else}}
-        <!-- 页面：{{ properCase name }} -->
-        {{/if}}
+        <page-header title="{{ cname }}" />
+        <page-main>
+            页面内容区域
+        </page-main>
     </div>
 </template>
 
 <script>
 export default {
-    props: {},
+    name: '{{ properCase componentName }}',
     data() {
         return {}
     },
-    created() {},
     mounted() {},
     methods: {}
 }

plop-templates/page/prompt.js

@@ -1,45 +1,56 @@
+const path = require('path')
+const fs = require('fs')
+
+function getFolder(path) {
+    let components = []
+    const files = fs.readdirSync(path)
+    files.forEach(function(item) {
+        let stat = fs.lstatSync(path + '/' + item)
+        if (stat.isDirectory() === true && item != 'components') {
+            components.push(path + '/' + item)
+            components.push.apply(components, getFolder(path + '/' + item))
+        }
+    })
+    return components
+}
+
 module.exports = {
     description: '创建页面',
     prompts: [
         {
             type: 'list',
-            name: 'type',
-            message: '请选择页面类型',
-            choices: ['view', 'layout'],
-            default: 'view'
-        },
-        {
-            type: 'input',
-            name: 'viewPath',
-            message: '请输入页面存放路径(./views/???)',
-            when: answers => {
-                return answers.type == 'view'
-            }
+            name: 'path',
+            message: '请选择页面创建目录',
+            choices: getFolder('src/views')
         },
         {
             type: 'input',
             name: 'name',
-            message: '请输入页面名称',
-            default: 'index',
+            message: '请输入文件名',
             validate: v => {
                 if (!v || v.trim === '') {
-                    return '页面名称不能为空'
+                    return '文件名不能为空'
                 } else {
                     return true
                 }
             }
+        },
+        {
+            type: 'input',
+            name: 'cname',
+            message: '请输入页面中文名称',
+            default: '默认页面'
         }
     ],
     actions: data => {
-        const path = data.type == 'view' ? `views/${data.viewPath}` : 'layout'
+        let relativePath = path.relative('src/views', data.path)
         const actions = [
             {
                 type: 'add',
-                path: `src/${path}/${data.name}.vue`,
+                path: `${data.path}/{{dotCase name}}.vue`,
                 templateFile: 'plop-templates/page/index.hbs',
                 data: {
-                    name: data.name,
-                    isLayout: data.type == 'layout'
+                    componentName: `${relativePath} ${data.name}`
                 }
             }
         ]

plop-templates/store/prompt.js

@@ -5,7 +5,6 @@ module.exports = {
             type: 'input',
             name: 'name',
             message: '请输入模块名称',
-            default: 'index',
             validate: v => {
                 if (!v || v.trim === '') {
                     return '模块名称不能为空'

plopfile.js

@@ -1,4 +1,5 @@
 module.exports = function(plop) {
+    plop.setWelcomeMessage('请选择需要创建的模式：')
     plop.setGenerator('page', require('./plop-templates/page/prompt'))
     plop.setGenerator('component', require('./plop-templates/component/prompt'))
     plop.setGenerator('store', require('./plop-templates/store/prompt'))

src/components/global/ExampleNotice/index.js renamed to src/components/ExampleNotice/index.js

@@ -1,15 +1,15 @@
 /**
  * 全局组件自动注册
  *
- * 全局组件统一放在 ./global 目录下，需要注意各个组件按文件夹区分，文件夹名称与组件名无关联
+ * 全局组件各个组件按文件夹区分，文件夹名称与组件名无关联，但建议与组件名保持一致
  * 文件夹内至少保留一个文件名为 index 的组件入口，例如 index.vue
  * 普通组件必须设置 name 并保证其唯一，自动注册会将组件的 name 设为组件名，可参考 SvgIcon 组件写法
  * 如果组件是通过 js 进行调用，则确保组件入口文件为 index.js，可参考 ExampleNotice 组件
  */
 
 import Vue from 'vue'
 
-const componentsContext = require.context('./global', true, /index.(vue|js)$/)
+const componentsContext = require.context('./', true, /index.(vue|js)$/)
 componentsContext.keys().forEach(file_name => {
     // 获取文件中的 default 模块
     const componentConfig = componentsContext(file_name).default

src/components/global/ExampleNotice/main.vue renamed to src/components/ExampleNotice/main.vue

@@ -6,7 +6,7 @@
 </template>
 
 <script>
-import ExampleList from '@/components/ExampleList'
+import ExampleList from './components/ExampleList/index'
 
 export default {
     components: {