Tengo experiencia en F#, pero soy nuevo en Fable (y Javascript, npm, webpack, etc.). En mi aplicación, intento llamar a una biblioteca Javascript externa llamada cardsJS para mostrar las cartas. Sin embargo, esta biblioteca requiere JQuery, por lo que no estoy seguro de cómo llamarla desde Fable/F#.

Para ser específicos, una de las funciones de Javascript expuestas por la biblioteca es:

 // Gets the ID of the card, eg "KS" for the king of spades. cid: function (card) { var s = card.attr('src'); return s.substring(s.length - 6, s.length - 4); },

En cardsJS, una tarjeta es solo un elemento HTML img , así que traté de importar la función cid en mi código de Fable a través de:

 type ICardsJS = abstract member cid : HTMLImageElement -> string let iCardsJS : ICardsJS = importDefault "cardsJS/cards.js"

Sin embargo, cuando llamo a iCardsJS.cid(card) esta manera, aparece un error de tiempo de ejecución de Javascript:

 Uncaught TypeError: card.attr is not a function at Object.cid (cards.js:30:26)

El problema aquí es que la biblioteca aparentemente espera un objeto JQuery , en lugar del elemento DOM sin procesar, por lo que puede llamar a la función attr del objeto. Así que supongo que mi interfaz de F# en realidad debería verse así:

 type ICardsJS = abstract member cid : JQueryThing??? -> string

Si estuviera escribiendo en Javascript sin formato, podría envolver el elemento DOM como un objeto JQuery, así: $(card) . ¿Cómo puedo lograr lo mismo en Fable? Estoy seguro de que necesito importar JQuery a mi código F# de alguna manera, pero no conozco el conjuro correcto. La única pista que he encontrado hasta ahora es este problema , que sugiere algo como:

 let jq : obj = importDefault "jquery" let jqCard = jq $ card

Pero eso no se compila en Fable 3:

 error FSHARP: Value restriction. The value 'jqCard' has been inferred to have generic type val jqCard : obj

Creo que el problema es que jq tiene el tipo incorrecto ( obj en lugar de algún tipo de interfaz IJQuery ) y el compilador cree que $ es de Fable.Core.JsInterop :

 ///<summary> /// Destructure and apply a tuple to an arbitrary value. /// Eg `myFn $ (arg1, arg2)` in JS becomes `myFn(arg1, arg2)` ///</summary> val ($) : callee: obj -> args: obj -> 'a