Home

Awesome

ts2fable npm version

Fable parser for TypeScript declaration files.

Usage

Install it with yarn or npm. With yarn it is:

yarn global add ts2fable

With npm it is:

npm install -g ts2fable

Run the ts2fable command on a TypeScript file and also specify the F# output file. The F# namespace in taken from the output filename. In this example, it is Yargs.

yarn add @types/yargs --dev
ts2fable node_modules/@types/yargs/index.d.ts src/Yargs.fs

You can also use --export(or -e) option to collect from multiple tsfiles

In below sample: All the related ts files in npm packages uifabric and office-ui-fabric-react will be compiled to OfficeReact.fs as a bundle

ts2fable node_modules/office-ui-fabric-react/lib/index.d.ts test-compile/OfficeReact.fs -e uifabric office-ui-fabric-react

You can find more information about how to interact with JavaScript from F# here. Please note the parser is not perfect and some tweaking by hand may be needed. Please submit bugs as issues on GitHub.

Online Version

You can also try an in-browser version here

The online version will be updated automatically when commits is merged

Contributing

Succesfull builds on the master branch are uploaded and tagged as next. You can help us test these builds by installing them with:

yarn global add ts2fable@next

or build directly from source:

-require esm is needed, because fable outputs code with ES modules.
If you want to run ts2fable directly without esm (ECMAScript module loader):

Test Suites

Run both test suites: ./fake.cmd build -t CliTest

Debug Test:

Sample Test:

only "duplicated variable exports" <| fun _ ->
    let tsPaths = ["node_modules/reactxp/dist/web/ReactXP.d.ts"]
    let fsPath = "test-compile/ReactXP.fs"
    testFsFiles tsPaths fsPath  <| fun fsFiles ->
        fsFiles
        |> getTopVariables
        |> List.countBy(fun vb -> vb.Name)
        |> List.forall(fun (_,l) -> l = 1)
        |> equal true

Web-App

Conventions

Some JavaScript/TypeScript features have no direct translation to F#. Here is a list of common workarounds adopted by the parser to solve these problems:

type CanvasRenderingContext2D =
    abstract fillStyle: U3<string, CanvasGradient, CanvasPattern> with get, set

let ctx: CanvasRenderingContext2D = failwith "dummy"
ctx.fillStyle <- U3.Case1 "#FF0000"
type CanvasRenderingContext2DType =
    abstract prototype: CanvasRenderingContext2D with get, set
    [<Emit("new $0($1...)")>] abstract Create: unit -> CanvasRenderingContext2D
type Express =
    inherit Application
    abstract version: string with get, set
    abstract application: obj with get, set
    [<Emit("$0($1...)")>] abstract Invoke: unit -> Application