[Suggestion] Command to generate boilerplates like Components/Stores/etc

[skyronic]

vue make:component TodoItemComponent

can create a component in the right place with the right boilerplate. This can also be applied to vuex, where a single command can generate multiple files.

I personally feel it'll be best if the boilerplates are defined in the template repos itself rather than in vue-cli but i'm filing the issue here.

[JasinYip]

It looks like Laravel! 😃

[skyronic]

Yup, it's a very small feature in laravel but really enhances the workflow because the tiny details are quickly taken care of... I can see this aligning nicely with what I can imagine vue's philosophy is.

[jbruni]

Hmmm... just like php artisan... we could have commands provided by vue-cli itself, as well as commands provided by the templates... in both cases we as end-users would run them through vue-cli.

[acacha]

+1 Awesome

[etcha]

+1

[chrisvfritz]

@skyronic While I have nothing against Laravel, my guess is that vue-cli is trying to emulate npm-style commands instead, so something like vue make component TodoItemComponent (space instead of colon) might be more appropriate. Then as a non-Laravel developer, make also has me thinking of Makefiles, so I'd personally prefer generate or create instead.

I do foresee a complication though. This kind of feature would probably only be really useful with a config file, so that users could modify:

• the components directory
• whether components should be generated with a style element
• whether style elements should be scoped
• which lang to use for the style element
• which lang to use for the script
• which lang to use for the template

User-defined snippets a simpler alternative?

I have enjoyed generators in frameworks like Rails, Ember, etc - but honestly, I think single-file generators are often overkill. Text editors typically allow the definition of extension-scoped snippets, so in Atom for example, this does quite nicely:

'.text.vue':
  'Vue Component':
    prefix: 'vc'
    body: """
      <template>
        ${1}
      </template>

      <script>
        export default {
          data () {
            return {${2}}
          }
        }
      </script>

      <style lang="scss" scoped>
        ${3}
      </style>
    """

[skyronic]

@chrisvfritz I agree with you completely, and to be honest, I do have snippets for my use right now.

But there are a lot of people who might not use sublime, or are comfortable setting up snippets or want something that "just works". Also I agree that using npm style spaces are better, that's the approach i've adopted in my initial work on this (you can see an example in #41 )

Additionally, we might want to later add commands which touch multiple files.

[chrisvfritz]

@skyronic Ah, I hadn't seen that you'd started work on it! I very much like the way you've handled the configuration. 😃

[zigomir]

Can we have a discussion instead of feature label here? :) I just closed #41 since we're not going in that direction.

Main reason is we want vue-cli to be focused on delivering template as starting point.
Also, my (personal) reason is I don't see file creation as a bottleneck, while deciding on all the options (JS Fatigue™) up front as big one.

[chrisvfritz]

@zigomir Good idea. Done. 😃

[ispal]

I've been browsing through https://github.com/vuejs/awesome-vue and one problem I see is that there's no unified way to build components/plugins. I've many many different ways of doing them. Some linking directly to .vue files and some of them to bundled file which I assume is preferred. Would love to see an official starter template for plugin/components that are shared through eg. npm. Any thoughts?