Command line interface to handle updating (via Vue CLI?)

[arielsalminen]

Started the discussion about this in Vue Design System’s Gitter (https://gitter.im/vueds/Lobby) with @elevatebart, but thought it might make sense to move the discussion here instead.

Vue CLI Plugin Development Guide: https://github.com/vuejs/vue-cli/blob/dev/docs/plugin-dev.md

[arielsalminen]

This is kind of related: https://github.com/viljamis/vue-design-system/issues/84

[arielsalminen]

I think this is probably the next focus area.

[elevatebart]

Starting to set up the scene for this feature, I am trying to wrap my head around what should be abstracted and what should be kept.

Here is what I think should be abstracted

• build folder containing webpack configs
• config folder that contain a lot of config that are necessary for the system to function -> I believe the font family should be a design token
• docs/utils, docs/components, docs.styles.scss & docs.helper.js maybe the src/assets/icons

And here is what should be in the template

• src folder, maybe without the router which will be dealt with by vue-cli
• docs/*.md files to adapt or translate documentation

[NOTA]: Abstracted does not mean hardcoded. Abstracted objects can still be configured through conf file or the vue.config.js

[elevatebart]

@viljamis, I would love to read your thoughts about this little program of mine. If I understood your system well enough, I will start coding.

One last thing, I think using yarn workspaces would be useful in order to deal with workspaces in a more sensible way. I does not mean users have to use yarn, just that we would have it easier for testing the plugin.

Your call Viljami ;-)

[arielsalminen]

@elevatebart So… If you look at the whole structure, I think the important parts are:

├─ src
│   ├─ tokens
│   ├─ elements
│   ├─ patterns
│   ├─ templates
│   ├─ styles
│   ├─ utils
│   ├─ assets
│   │   └─ icons
├─ docs
│   ├─ utils
│   └─ components
│       ├─ tokens
│       └─ status
├─ config
└─ build

• src is pretty important since it creates the whole project structure, has the initial tokens and even the system.js file that imports everything and is used for lib build. But yeah, we don’t probably want the router f.ex.
• docs as well since it hosts the Styleguidist specific things like the styles and components shown in the documentation.
• I guess config + build just need to be there.

And more…

The parts I’m wondering about live in the project root dir:

• package.json since it includes a lot of necessary logic like all the build and run commands and dependencies needed + also configuration for Babel and ESLint.
• Prettier and postcss configuration in the root dir.

[arielsalminen]

@elevatebart I don’t have previous experience with Yarn workspaces, but if you think that would make things easier for us then I think we should try it!

What else do you need from me to get started?