CDN

<link href="https://unpkg.com/weavvcss@1.0.3/dist/weavv-1.0.3.min.css" rel="stylesheet" rel="preload" as="style" media="all" defer>

HTML

@import "https://unpkg.com/weavvcss@1.0.3/dist/weavv-1.0.3.min.css";

CSS

Note: The CDN build is a published version and always behind the latest update at the Github repository. (See Utility Map for new changes.)

Note: The CDN build file size is huge, ideal for prototyping. Unrecommended to use in production. Learn more about how to reduce the framework size efficiently. (See Reduce File Size )

Note: Using CDN does not have the benefit to use the @extend directive. (See Extract Utility Classes )

Package Manager

# YARN
$ yarn add weavvcss
# NPM
$ npm i weavvcss

TERMINAL

You can include the WEAVV CSS file from the node_modules directory with an HTML <link> tag or import the weavv.scss into .scss file with @import directive.

import 'weavvcss';

JavaScripts

@import 'node_modules/weavvcss/weavv';

SCSS

<link href="node_modules/weavvcss/dist/weavv-1.0.3.min.css" rel="stylesheet" rel="preload" as="style" media="all" defer>

HTML

Note: The node_modules is a published version and always behind the latest update at the Github repository.

Note: The CDN build file size is huge, ideal for prototyping. Unrecommended to use in production. Learn more about how to reduce the framework size efficiently. (See Reduce File Size )

CLI

Create an empty project on the go with an example template, written with the Vanilla JS web component. Optional to use HTML inline CSS class or to use SASS with @extend directive to extract WEAVV CSS classes semantically.

To create a new project, run:

# YARN
$ yarn create weavv-cli my-new-project
# NPM
$ npx weavv-cli my-new-project

TERMINAL

The CLI gives you an optional tool to quickly installs and sets up a new frontend project with essential build tools such as preprocessors, postprocessors, etc. Use the tool for the production-ready build.

If you install the weavv-cli package to run locally, simply run weavv <project_name>,

# YARN
$ yarn global add weavv-cli
# NPM
$ npm i -g weavv-cli
# USAGE
$ weavv my-new-project

TERMINAL

Note: The CLI always comes with the latest build, including the unpublished changes.