@fairyxtopia/assets v1.0.0
Documentação da Engine de Assets
Introdução
É uma engine desenvolvida para automatizar o processamento e a conversão de ativos digitais, como ícones, em formatos utilizáveis para desenvolvimento web. Essa engine é especialmente útil para transformar arquivos SVG em componentes ou objetos JavaScript. Estrutura do Projeto
O projeto é organizado da seguinte maneira:
.gitignore: Define arquivos e diretórios ignorados pelo Git.
README.md: Documentação inicial do projeto.
package.json e package-lock.json: Metadados e dependências do projeto.
node_modules: Dependências instaladas do projeto.
yarn.lock: Trava as versões das dependências para consistência.
src: Código-fonte da engine.
assets/icons: Armazena os ícones ou outros ativos SVG.
build.js: Script principal para processar os ativos.
utils/svgToJS.js: Script para converter SVGs em JavaScript.Funcionalidades dos Scripts
build.js:
Função: Automatiza o processamento de ativos.
Processo: Itera sobre os tipos de ativos definidos e utiliza svgToJS para convertê-los.
Importância: Simplifica o gerenciamento de ativos, facilitando a integração em projetos.
svgToJS.js:
Função: Converte arquivos SVG em JavaScript.
Processo: Normaliza nomes de arquivos e transforma o conteúdo SVG.
Importância: Permite a utilização eficiente de ativos gráficos em desenvolvimento web.Processo de Geração de Assets
Preparação de Ativos: Os ativos, como ícones SVG, são armazenados na pasta assets/icons.
Execução do Build: Ao rodar o script build.js, ele processa os ativos definidos.
Conversão de SVG para JS: Cada arquivo SVG é convertido em um formato JavaScript utilizável pelo script svgToJS.js.
Output Final: Os ativos JavaScript são armazenados em um diretório de saída especificado, prontos para uso em projetos web.Como Usar
Coloque os ativos SVG na pasta apropriada (assets/icons).
Execute o script build.js para processar os ativos.
Utilize os ativos JavaScript gerados em seus projetos web.Conclusão
A "Meiuca Assets" oferece uma solução robusta para a gestão e transformação de ativos gráficos, otimizando o fluxo de trabalho e garantindo a utilização eficiente de recursos visuais em projetos de desenvolvimento web. Esta engine é ideal para projetos que exigem um gerenciamento consistente e automatizado de uma grande quantidade de ativos gráficos.
Instale as dependências (uso o Npm para gerenciar os pacotes):
npmPara fazer o build da aplicação:
npm run buildA pasta gerada é a dist.
Para publicar o pacote:
npm publish --access public