Catalog npm
Back to packageRELEASE DETAILS

0.1.1

npm

3dlink-icons

Icons library for 3d-link projects

3d-linkicon
Published23 Aug 2023
Direct dependencies10
Transitive dependenciesNot calculated

README

Current package documentation

3dlink-icons es una librería de React que proporciona una colección de íconos SVG que puedes usar en tus proyectos. Estos íconos están organizados en módulos para facilitar su importación y uso.

La librería viene con un script llamado convert-icons que convierte archivos SVG en componentes de React que se pueden usar directamente en tu código. Esta es una descripción de cómo usarlo.

Añadiendo nuevos iconos

  1. Crear una rama en tu repositorio: Para asegurar la estabilidad del código, antes de realizar cualquier cambio en la librería, debes crear una nueva rama en tu repositorio local. Esta rama debe ser distinta a main. El nombre de la rama debe seguir la convención fix/nombre-de-la-rama si solo vas a realizar reemplazos de íconos, o feat/nombre-de-la-rama si vas a añadir nuevos íconos.

    git checkout -b feat/newIcons
    
  2. Preparar los íconos: Primero, necesitas tener tus archivos SVG listos. Debes poner todos tus archivos SVG en una carpeta dentro de src/migrations. Por ejemplo, puedes crear una carpeta llamada newIcons dentro de src/migrations.

  3. Usar el comando convert-icons: Después de preparar tus íconos, puedes ejecutar el comando convert-icons para convertirlos en componentes de React. El comando se usa de la siguiente manera:

    npm run convert-icons <nombre_del_grupo> <ruta_a_la_carpeta_desde_migrations>
    

    Donde:

    • <nombre_del_grupo>: Este es el nombre del grupo o módulo de íconos. Este nombre será utilizado para crear un archivo JSX que agrupa todos los íconos convertidos y también para organizar los íconos en módulos cuando se generen las exportaciones finales.

    • <ruta_a_la_carpeta_desde_migrations>: es la ruta a la carpeta que contiene tus archivos SVG desde la carpeta migrations. Por ejemplo, si creaste una carpeta newIcons en el paso 2, esta ruta sería simplemente newIcons.

    Ejemplo de uso:

    npm run convert-icons newIcons general
    
  4. Revisar la documentación de la migración: El comando convert-icons generará una documentación para cada migración que realiza. Esta documentación, que se encuentra en migrations-logs, contiene información sobre los íconos añadidos y reemplazados durante la migración.

  5. Realizar un merge request a main: Una vez que hayas añadido tus íconos y estés satisfecho con los cambios, debes hacer push de tu rama al repositorio remoto y luego realizar un merge request a main.

    git push origin feat/newIcons
    

    Asegúrate de revisar cuidadosamente el merge request y fusionarlo en main solo cuando estés seguro de que los cambios son correctos y estables.

Generando la build final

Una vez que hayas añadido tus íconos, puedes generar la build final con el comando npm run build. Esto compilará tus componentes de React en un formato que se puede importar fácilmente en otros proyectos de React.

Durante el proceso de build, también se genera una documentación que lista todos los íconos disponibles en la librería. Esta documentación se genera a partir de una plantilla ubicada en la raíz del proyecto (library-readme-template.md) y se coloca en la carpeta dist con el nombre README.md. La documentación lista todos los íconos disponibles, organizados por módulo.

Ahora estás listo para usar y contribuir a la librería de íconos 3dlink-icons. Asegúrate de seguir estas pautas al agregar nuevos íconos para mantener la librería organizada y fácil de usar. ¡Disfrútalo!

Downloads & popularity

Awaiting observations

No metric observations yet

Download counts and popularity will appear here as the collector receives them.

Declared dependencies 10

Native requirements
10 direct targetsNot calculated transitive count
Package / targetRequirementRelationship
@babel/cli
Environment
{
  "local_name": "@babel/cli",
  "alias": false,
  "peer_metadata": null
}
^7.22.9development
@babel/core
Environment
{
  "local_name": "@babel/core",
  "alias": false,
  "peer_metadata": null
}
^7.22.9development
@babel/plugin-transform-runtime
Environment
{
  "local_name": "@babel/plugin-transform-runtime",
  "alias": false,
  "peer_metadata": null
}
^7.22.9development
@babel/preset-env
Environment
{
  "local_name": "@babel/preset-env",
  "alias": false,
  "peer_metadata": null
}
^7.22.9development
@babel/preset-react
Environment
{
  "local_name": "@babel/preset-react",
  "alias": false,
  "peer_metadata": null
}
^7.22.5development
camelcase
Environment
{
  "local_name": "camelcase",
  "alias": false,
  "peer_metadata": null
}
^7.0.1development
chalk
Environment
{
  "local_name": "chalk",
  "alias": false,
  "peer_metadata": null
}
^5.3.0development
fs-extra
Environment
{
  "local_name": "fs-extra",
  "alias": false,
  "peer_metadata": null
}
^11.1.1development
rimraf
Environment
{
  "local_name": "rimraf",
  "alias": false,
  "peer_metadata": null
}
^5.0.1development
shx
Environment
{
  "local_name": "shx",
  "alias": false,
  "peer_metadata": null
}
^0.3.4development

Distribution files

1 collected
Distribution 1

Source distribution

Source file
Checksums from source
{
  "integrity": "sha512-/TbbEzua84p8gSS0kcb7ada7lDX7BK5JFbp0YDeneB0kc6K10x6j1bvrQjHx0LbjvyN286q43JNgR6Sh6OuKYg==",
  "shasum": "46cea20400294991691a21cc9631ee264990fa0b",
  "tarball": "https://registry.npmjs.org/3dlink-icons/-/3dlink-icons-0.1.1.tgz",
  "fileCount": 19,
  "unpackedSize": 996642,
  "signatures": [
    {
      "keyid": "SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA",
      "sig": "MEYCIQDPDERNSi5XO8EU0KAn8AKgbh6XfUVEF0Jmk9tcGaIRSQIhAOQggFU0MqtCOaq+xpu+1KwBz51pBBl2Gut71F0rHAkh"
    }
  ]
}

Metadata history

Meaningful changes
Current collected state Current

Observed since 20 Oct, 19:40 UTC

No superseded metadata states collected. Unchanged observations do not create new revisions.

Record identity

package_version:294a52c474dc5f9658fd77407fdb445e1a29ffbbd6fad804f98ac3fa6935b210

Other collected versions

0.3.024 Aug0.2.023 Aug0.1.018 AugView all collected versions →