Thanks to visit codestin.com
Credit goes to github.com

Skip to content

More information about including the filePath of a specific sprite in the SPRITES_META variable #143

@Volosojui

Description

@Volosojui

Hi! I tried to follow the instructions here https://neodx.pages.dev/svg/group-and-hash.html to add a hash to the sprite file name and then use its name with hash in my Icon component (filePath), but I ran into trouble with the fact that SPRITES_META did not include filePath. After some searching I realized that to generate filePath you need to specify either size or viewBox in the metadata.runtime (https://github.com/secundant/neodx/blob/main/libs/svg/src/plugins/metadata.ts#L66-L91).

Maybe it should be included in the official documentation in the second step at https://neodx.pages.dev/svg/group-and-hash.html

Below are the configs that generate sprites containing hashes in their names but with and without the filePath key in SPRITES_META

SPRITES_META does not include the filePath:

svg({
  root: 'src/assets',
  output: 'public/sprites',
  fileName: '{name}.{hash:8}.svg',
  metadata: {
    path: 'src/shared/ui/components/icon/sprite.gen.ts',
  },
  resetColors: {
    replaceUnknown: 'currentColor',
  },
}),

SPRITES_META includes the filePath:

svg({
  root: 'src/assets',
  output: 'public/sprites',
  fileName: '{name}.{hash:8}.svg',
  metadata: {
    path: 'src/shared/ui/components/icon/sprite.gen.ts',
    runtime: {
      size: true
    }
  },
  resetColors: {
    replaceUnknown: 'currentColor',
  },
}),

And thanks for your project!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions