HTML Como aplicar os design do package.json na página WEB

[G_Andrade]

Boa noite, estou com uma dúvida, apos eu instalar um pacote do tipo npm install @material no meu html, como eu faço para aplicá-lo na minha página como se fosse um <link> ou um <script>?

[GabrielSennaMs]

Bom o npm é um gerenciador de pacotes, quando você pede para ele instalar um pacote, ele automaticamente começa a baixar os arquivos do pacote, esses arquivos ficam salvos na pasta "node_modules", essa pasta fica onde você executou o comando npm, como ele é um gerenciador de pacotes ele usa o arquivo package.json como base para gerenciar os pacotes e seu projeto.

 

O comando 

npm install @material

é incorreto, esse comando somente é usado para baixa pequenas partes do material design e ele deve ser complementado com / e o nome da parte desejada.

Exemplo:

npm install @material/button

Se você deseja baixar o material design completo, Recomento você a usar o comando:

npm install material-components-web

Para adicionar ele a sua página, entre na pasta "node_modules" depois em "material-components-web" depois em "dist", dentro dessa pasta você vai encontra os arquivos do material design como os arquivos reduzido(.mim) e os arquivos não reduzidos e os arquivo de mapa, depois é só adicionar o link para essa pasta ou copiar os arquivos desejados, recomendo você a copiar os arquivos "material-components-web.min.css" e "material-components-web.min", o resto você não vai usar.

 

Você também pode usar o CDN para adicionar o material design na sua página web, sem a necessidade de usar o npm.

<link href="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.css" rel="stylesheet">
<script src="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.js"></script>