Vue CSS Objects

CSS Objects implementation in VueJS with Normandy CSS class naming.

Features

---

• Stateless Vue components
• Import just the required components
• Fully tested using Jest
• BEM-naming classes

Installation

---

npm install --save vue-objects

Usage

---

import { Media } from 'vue-objects'

You can check out all the available components in src/lib.js.

This package provides the necessary CSS styles to render each object properly, but it's not mandatory to import them: you can use whatever style provider you want to use. Just make sure to map correctly all the classes generated by vue-objects.

Contributing

---

Want to contribute?

# install dependencies
npm install

# serve demo site with hot reload at localhost:8080
npm start

# unit tests
npm test (or npm run tdd)

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report

For detailed explanation on how things work, checkout the guide and docs for vue-loader.

How can I add more components to this library?

---

Fork the repo, and then:

1. Add your brand new component in src/components/ folder. Develop and test it.

2. Make your component available by exporting it from src/lib.js.

3. Add it to the demo/ app. Make sure to add import it in demo/index.js and add a new route in demo/router/routes.js.

4. Once registered and routed, showcase it by placing a demo in demo/. You're done!

Why is /dist folder not gitignored?

---

The dist folder is removed from .gitignore so that it's available on npm and user's who want the minified built distribution of this library can grab it (located in /lib subfolder). Also docs site built distribution is made available in the same folder (located in /docs subfolder).

This package was created using vue-template-library package. For further clarifications refer to its README.