arielsalminen / vue-design-system

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

added Vds prefix to Vue Components to avoid conflict with standard HTML elements #178

Open ludij opened 5 years ago

ludij commented 5 years ago

Problem: when using Vue Design System on a static website, there's a conflict between components which have the same name as a standard HTML element (i.e. <Button> and <button>). This results in the standard HTML element being displayed instead of the Vue component.

Solution: renaming all Vue components by adding a prefix 'Vds', i.e. 'VdsButton' for a button component.

Extra: in the examples (here and here) the component names should be changed as well. In the static website example, it would be best to use kebab-case for the components, i.e. <vds-nav-bar> instead of <NavBar> and to add a recommendation for using kebab-case in the README.