search

arielsalminen / vue-design-system

An open source tool for building UI Design Systems with Vue.js
https://vueds.com
MIT License
2.17k stars 224 forks source link

Guidance for using customized Design System as an npm module from a private git repository #69

Closed ryanberg closed 5 years ago

ryanberg commented 6 years ago

We're intending to use Vue Design System as the starting point for our internal design system.
As recommended in the Getting Started wiki, we'll be publishing our customized version as a new package that our main website will import.

I'm struggling to arrive at the "right" approach to accomplish the following:

Is there a specific approach you're intending teams building on a foundation of vue-design-system to use?

ryanberg commented 6 years ago

For the moment, I've up and running using the instructions from How to fork to a private gitlab instance.

arielsalminen commented 6 years ago

@ryanberg Thanks for the suggestion and questions. This is an important topic that I’ve been also pondering lately. Definitely needs documentation. This is related to issue #62 as well.

There's no “easy” upgrade path right now as this project is more of a boilerplate/a set of tools that you take and start using and customizing to your own organizations needs (at least this is how I feel).

I think for now, the best way to go depends on the level of customization that you’ll want to do to the system.

There’s a suggestion here which is true for Vue Design System as well (since it’s structure is very similar to current Vue Webpack Template): https://github.com/vuejs-templates/webpack/issues/1166

jkarttunen commented 6 years ago

Seconded. I'd say preferred way for vue.js project is just using vue-cli, and adding stuff you need, like using progressive web app template. Now my problem is, how do I add VDS to an app created with vue-cli?

arielsalminen commented 6 years ago

@jkarttunen The preferred way to use Vue Design System is as a private NPM dependency, so it shouldn’t require much changes to your existing apps. See instructions in Getting Started: https://github.com/viljamis/vue-design-system/wiki/getting-started#using-design-system-as-an-npm-module

ryanberg commented 6 years ago

There's no “easy” upgrade path right now as this project is more of a boilerplate/a set of tools that you take and start using and customizing to your own organizations needs (at least this is how I feel).

Yeah, I suspect that the further down this road I go, the less want/need I'll have for updates to vue-design-system. But for now, while our custom system is not yet in production, and you seem to be making rapid progress on the boilerplate, I'll be greedy and pull down as many of the improvements as I can.

arielsalminen commented 6 years ago

@ryanberg Definitely. That’s kind of the approach I’ve used with my clients as well. Started off with this, but then, depending on their organizations needs, we will start customizing things like the build processes and building new features on top of this.

arielsalminen commented 5 years ago

I’ve added some more guidance and examples now related to this: https://github.com/viljamis/vue-design-system#examples.

Separately, we’re planning on starting a task to make the updating of the system easier via vue-cli or similar. As that is tracked in another issue (https://github.com/viljamis/vue-design-system/issues/83), I will be closing this one.