ehealth-pillar
v1.5.4
Published
A framework of eHealth designed utility classes
Downloads
5
Readme
Quick Start
Step 1: Install the framework
$ npm install ehealth-pillar --save
Or by CDN directly in your HTML <head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ehealth-pillar/output.css">
Step 2: Import style library
@import '~ehealth-pillar/output.css';
// Custom styles go here if needed
Prototyping (for eHealth Employees)
SASS support is also included
Develop
- Clone this project
$ git clone <user-repo>
- Build with dependencies
$ npm install
- Create
*.html
file at project root and reference design library and JS bundle.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Playground</title>
<link rel="stylesheet" href="./output.css">
</head>
<body>
<!-- Your Lovely Work here -->
<script src="./output.js"></script>
</body>
</html>
- Run NPM script to watch for file changes
$ npm run watch
5a. Live Reload with VSCode Using the Live server extension simply right click on html file and 'Open with Live Server'.
5b. Live Reload with Http Server
$ http-server
Build
As you develop, the files will automatically be compiled and extracted to individual files
output.css
for CSS styles
output.js
for JS
Optional Build Plugins to be enabled:
- cssnano for css optimization such as minifying, removing comments, etc.
- purgecss for removing all unused styles
- babel for transpiling JS code to ES5
- terser for js optimization
The above plugins are disabled for development but should be used when deploying to production. Make sure all function calls found in plugins: []
in rollup.config.js
are enabled.
TODO: set environment variables for DEV and PROD