RedMadRobot / figma-export

Command line utility to export colors, typography, icons and images from Figma to Xcode / Android Studio project
MIT License
726 stars 114 forks source link

Failed when export colors #49

Closed codechallengeios closed 3 years ago

codechallengeios commented 3 years ago

When I export I get this error. What I can do?

Using FigmaExport to export colors.
Fetching colors. Please wait...
Error: keyNotFound(CodingKeys(stringValue: "color", intValue: nil), Swift.DecodingError.Context(codingPath: [CodingKeys(stringValue: "nodes", intValue: nil), _JSONKey(stringValue: "95:32", intValue: nil), CodingKeys(stringValue: "document", intValue: nil), CodingKeys(stringValue: "fills", intValue: nil), _JSONKey(stringValue: "Index 1", intValue: 1)], debugDescription: "No value associated with key CodingKeys(stringValue: \"color\", intValue: nil) (\"color\").", underlyingError: nil))
subdan commented 3 years ago

There is an error in you Figma file. Read Design requirements documentation.

Did you publish Styles to your Team Library?

image

Could you give me access to your Figma file?

codechallengeios commented 3 years ago

Yes, Styles is publish. I invited to Figma file

subdan commented 3 years ago

Thanks. Could you please also send me your figma-export.yaml file?

codechallengeios commented 3 years ago

Is default file.

---
figma:
  # Identifier of the file containing light color palette, icons and light images. To obtain a file id, open the file in the browser. The file id will be present in the URL after the word file and before the file name.
  lightFileId: AJIT3c1UuqQYqyk3FPjjq7
  # [optional] Identifier of the file containing dark color palette and dark images.
  #darkFileId: KfF6DnJTWHGZzC912345

# [optional] Common export parameters
common:
  colors:
    # RegExp pattern for color name validation before exporting
    nameValidateRegexp: '^[a-zA-Z_]+$' # RegExp pattern for: background, background_primary, widget_primary_background
  icons:
    # Name of the Figma's frame where icons components are located
    figmaFrameName: Colors
    # RegExp pattern for icon name validation before exporting
    nameValidateRegexp: '^(ic)_(\d\d)_([a-z0-9_]+)$' # RegExp pattern for: ic_24_icon_name, ic_24_icon
  images:
    # Name of the Figma's frame where image components are located
    figmaFrameName: Illustrations
    # RegExp pattern for image name validation before exporting
    nameValidateRegexp: '^(img)_([a-z0-9_]+)$' # RegExp pattern for: img_image_name

# [optional] iOS export parameters
ios:
  # Path to xcodeproj
  xcodeprojPath: "./Example.xcodeproj"
  # Xcode Target containing resources and corresponding swift code
  target: "UIComponents"
  # Absolute or relative path to the Assets.xcassets directory
  xcassetsPath: "./Resources/Assets.xcassets"
  # Is Assets.xcassets located in the main bundle?
  xcassetsInMainBundle: true

  # Parameters for exporting colors
  colors:
    # How to export colors? Use .xcassets and UIColor extension (useColorAssets = true) or extension only (useColorAssets = false)
    useColorAssets: True
    # [required if useColorAssets: True] Name of the folder inside Assets.xcassets where to place colors (.colorset directories)
    assetsFolder: Colors
    # Color name style: camelCase or snake_case
    nameStyle: camelCase
    # [optional] Absolute or relative path to swift file where to export UIKit colors (UIColor) for accessing from the code (e.g. UIColor.backgroundPrimary)
    colorSwift: "./Sources/UIColor+extension.swift"
    # [optional] Absolute or relative path to swift file where to export SwiftUI colors (Color) for accessing from the code (e.g. Color.backgroundPrimary)
    swiftuiColorSwift: "./Source/Color+extension.swift"

  # Parameters for exporting icons
  icons:
    # Image file format: pdf or svg
    format: pdf
    # Name of the folder inside Assets.xcassets where to place icons (.imageset directories)
    assetsFolder: Icons
    # Icon name style: camelCase or snake_case
    nameStyle: camelCase
    # [optional] An array of icon names that will supports Preseve Vecotor Data
    preservesVectorRepresentation:
    - ic24TabBarMain
    - ic24TabBarEvents
    - ic24TabBarProfile
    # [optional] Absolute or relative path to swift file where to export icons (SwiftUI’s Image) for accessing from the code (e.g. Image.illZeroNoInternet)
    swiftUIImageSwift: "./Source/Image+extension_icons.swift"
    # [optional] Absolute or relative path to swift file where to generate extension for UIImage for accessing icons from the code (e.g. UIImage.ic24ArrowRight)
    imageSwift: "./Example/Source/UIImage+extension_icons.swift"

  # Parameters for exporting images
  images:
    # Name of the folder inside Assets.xcassets where to place images (.imageset directories)
    assetsFolder: Illustrations
    # Image name style: camelCase or snake_case
    nameStyle: camelCase
    # [optional] Absolute or relative path to swift file where to export images (SwiftUI’s Image) for accessing from the code (e.g. Image.illZeroNoInternet)
    swiftUIImageSwift: "./Source/Image+extension_illustrations.swift"
    # [optional] Absolute or relative path to swift file where to generate extension for UIImage for accessing illustrations from the code (e.g. UIImage.illZeroNoInternet)
    imageSwift: "./Example/Source/UIImage+extension_illustrations.swift"

  # Parameters for exporting typography
  typography:
    # [optional] Absolute or relative path to swift file where to export UIKit fonts (UIFont extension).
    fontSwift: "./Source/UIComponents/UIFont+extension.swift"
    # [optional] Absolute or relative path to swift file where to export SwiftUI fonts (Font extension).
    swiftUIFontSwift: "./Source/View/Common/Font+extension.swift"
    # Should FigmaExport generate UILabel for each text style (font)? E.g. HeaderLabel, BodyLabel, CaptionLabel
    generateLabels: true
    # Relative or absolute path to directory where to place UILabel for each text style (font) (Requred if generateLabels = true)
    labelsDirectory: "./Source/UIComponents/"
subdan commented 3 years ago

figma-export doesn't support gradient Color Style. You have a Color Style with a gradient Content/Inverse_Link. Exclude this Color Style from exporting by typing none in the description field of the Color Style.

Example:

Screen Shot 2020-12-03 at 14 25 32
codechallengeios commented 3 years ago

Thanks, it works