@devingen/alaca

Alaca

Alaca is a web component library built with StencilJS.

Uses Unicons from Iconscout for icons for testing.

Getting Started

For development

npm install
npm start

It'll boot a web app that has code examples in it.

Local CDN

To use the development output locally in another project;

• Install the http-server; npm install --global http-server
• Serve the local cdn by cd dist && http-server -p 8000 --cors
• Place this in index.html <script src='http://localhost:8000/alaca.js'></script>
• Place the <dvn-theme-provider> right inside <body/>
• Put any dvn component inside the theme provider. Ex: <dvn-button>Login</dvn-button>

Production

To build the component for production, run:

npm run build

Tests

To run the unit tests for the components, run:

npm test

To run the e2e tests generating screenshots, run:

npm run test.screenshot

Need help? Check out our docs here.

Naming Components

When creating new component tags, use dvn prefix like dvn-progress, dvn-button etc.

Using this component

Script tag

• Publish to NPM
• Put a script tag similar to this <script src='https://unpkg.com/@devingen/alaca@0.0.1/dist/alaca.js'></script> in the head of your index.html
• Then you can use the element anywhere in your template, JSX, html etc

Node Modules

• Run npm install @devingen/alaca --save
• Put a script tag similar to this <script src='node_modules/devingen/dist/alaca.js'></script> in the head of your index.html
• Then you can use the element anywhere in your template, JSX, html etc

In a stencil-starter app

• Run npm install @dvn/alaca --save
• Add an import to the npm packages import dvn-progress;
• Then you can use the element anywhere in your template, JSX, html etc