Skip to content

Custom CSS property is accessible in the editor but not when compiling #89

Closed
@inosik

Description

@inosik
let divStyle =
  [
    Width "100px"
    Height "100px"
    Custom ("background", "red")
  ]
div [ Style divStyle ] []

This works fine in the editor and when doing dotnet build, but Fable emits this error:

ERROR in ./src/App.fs
G:/projects/demo/src/App.fs(129,12): (129,18) error FSHARP: The value or constructor 'Custom' is not defined. Maybe you want one of the following:
   CustomEqualityAttribute
 @ ./src/CSSDemo.fsproj 1:0-25 1:0-25
 @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/CSSDemo.fsproj

The problem is this:

#if !FABLE_COMPILER
| Custom of string * obj
#else
/// If you are searching for a way to provide a value not supported by this DSL then use something like: CSSProp.Custom ("align-content", "center")
static member inline Custom (key: string, value: obj) : SVGAttr = !!(key, value)
#endif

I guess the DLL in the NuGet package (v3.1.2) was compiled without FABLE_COMPILER, so it contains this union case. But when compiling using Fable, it picks up the source file and can't find the union case, because Fable defines FABLE_COMPILER. To fix the error, you have to use CSSProp.Custom.

Also, why does the static method return an SVGAttr instead of a CSSProp?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions