Skip to content

README.example.md

Latest commit

 

History

History
114 lines (83 loc) · 2.44 KB

README.example.md

File metadata and controls

114 lines (83 loc) · 2.44 KB

package name here

tests types module install size GZip size semantic versioning Common Changelog license

<package description goes here>

See a live demo

Contents

Install

Installation instructions

npm i -S {{package-name}}

Example



API


This exposes ESM and common JS via
package.json exports field.


ESM


import '{{package-name}}'


Common JS


require('{{package-name}}')


Attributes


<all attributes here>


Events


<all events here>


CSS


Import CSS


import '{{package-name}}/css'


Or minified:


import '{{package-name}}/min/css'


Customize CSS via some variables


{{component-name}} {
    --example: pink;
}


Use


This calls the global function customElements.define. Just import, then use
the tag in your HTML.


JS


import '{{package-name}}'


HTML


<div>
    <{{component-name}}></{{component-name}}>
</div>


pre-built


This package exposes minified JS and CSS files too. Copy them to a location that is
accessible to your web server, then link to them in HTML.


copy


cp ./node_modules/{{package-name}}/dist/index.min.js ./public/{{component-name}}.min.js
cp ./node_modules/{{package-name}}/dist/style.min.css ./public/{{component-name}}.css


HTML


<head>
    <link rel="stylesheet" href="./{{component-name}}.css">
</head>
<body>
    <!-- ... -->
    <script type="module" src="./{{component-name}}.min.js"></script>
</body>