component template

component-name

Um componente da web para…

Demo | Leitura adicional

Exemplos

Exemplo de uso geral:

 < script type =" module " src =" component-name.js " > </ script >

< component-name >
  < button > Button </ button >
</ component-name >

Exemplo usando um método de fallback:

 < script type =" module " src =" component-name.js " > </ script >

< component-name >
  < button > Button </ button >
  < a href =" # " > Anchor </ a >
</ component-name >
< style >
  component-name:not(:defined) button,
  component-name:defined a {
    display: none;
  }
</ style >

Exemplo usando opções ou método de fallback adicional:

 < script type =" module " src =" component-name.js " > </ script >

< component-name attribute =" value " >
  < button > Button </ button >
</ component-name >
< style >
  component-name[attribute="value"] {
    outline: 1px solid red;
  }
</ style > 

Características

Este componente da web permite:

• Verifique se há…

Instalação

Você tem algumas opções (escolha uma delas):

1. Instale via NPM: npm install @daviddarnes/component-name
2. Faça o download da fonte manualmente do GitHub em seu projeto.
3. Pule esta etapa e use o script diretamente por meio de um CDN de terceiros (não recomendado para uso da produção)

Uso

Certifique -se de incluir o <script> em seu projeto (escolha um deles):

 <!-- Host yourself -->
< script type =" module " src =" component-name.js " > </ script > 

 <!-- 3rd party CDN, not recommended for production use -->
< script
  type =" module "
  src =" https://www.unpkg.com/@daviddarnes/[email protected]/component-name.js "
> </ script > 

 <!-- 3rd party CDN, not recommended for production use -->
< script
  type =" module "
  src =" https://esm.sh/@daviddarnes/[email protected] "
> </ script > 

Crédito

Com agradecimento às seguintes pessoas:

• Zach Leatherman para inspirar este modelo de repo componente da web