With the release of Fable 2.2 it is now (back) possible to compile .fsx
files. There are some subtle differences in this approach and in this blog post, I’d like to illustrate how your workflow could be.
Using a script file in Fable 2.2 is actually not all that different from the regular Fable approach (see minimal sample). When using webpack, point your entry to your script file and make sure that the fable-loader
is matching .fsx
as well.
[code language=”javascript”]
…
entry: "myScript.fsx",
module: {
rules: [
{
test: /\.fs(x|proj)?$/,
use: {
loader: "fable-loader"
}
}
]
}
…
[/code]
If for example, the content of the script file is merely to print something like
[code language=”fsharp”]
printfn "Works!
[/code]
Fable already can compile this to the expected console.log
statement.
Of course logging to the console bearly proves anything. How can we import some dependencies and do something useful?
This is where Paket can really shine. Next to being a great alternative to NuGet, it can also generate a script file that contains references (#r
) to all the listed dependencies.
Paket can be installed as a dotnet cli tool.
[code]
dotnet tool install –tool-path .paket Paket –add-source <a href="http://api.nuget.org/v3/index.json" rel="nofollow">http://api.nuget.org/v3/index.json</a> –framework netcoreapp2.1
[/code]
Moving forward execute
[code].paket/paket.exe init[/code]
to generate an empty
[code]paket.dependencies[/code]
.
There we can list whatever packages we need.
F.ex.
[code]
storage: none
source http://www.nuget.org/api/v2
framework: netstandard2.0
nuget Fable.Browser.Dom 1.0.0-alpha-004 alpha
nuget Fable.React 5.0.0-alpha-005 alpha
[/code]
After
[code]
.paket/paket.exe
[/code]
install, we can generate a load script via
[code].paket/paket.exe generate-load-scripts -f netstandard2.0 -t fsx[/code]
. This creates the following script file:
[code language=”fsharp”]
namespace PaketLoadScripts
#r "C:\\Users\\nojaf\\.nuget\\packages\\fable.core\\2.1.0-alpha-002\\lib\\netstandard2.0\\Fable.Core.dll"
#r "C:\\Users\\nojaf\\.nuget\\packages\\fable.browser.blob\\1.0.0-alpha-001\\lib\\netstandard2.0\\Browser.Blob.dll"
#r "C:\\Users\\nojaf\\.nuget\\packages\\fable.browser.event\\1.0.0-alpha-001\\lib\\netstandard2.0\\Browser.Event.dll"
#r "C:\\Users\\nojaf\\.nuget\\packages\\fable.browser.webstorage\\1.0.0-alpha-001\\lib\\netstandard2.0\\Browser.WebStorage.dll"
#r "C:\\Users\\nojaf\\.nuget\\packages\\fable.browser.dom\\1.0.0-alpha-004\\lib\\netstandard2.0\\Browser.Dom.dll"
#r "C:\\Users\\nojaf\\.nuget\\packages\\fable.react\\5.0.0-alpha-005\\lib\\netstandard2.0\\Fable.React.dll"
[/code]
Note that storage:none
, will reference everything from my global NuGet cache.
With a simple #load
directive, we can import the generated script.
[code language=”fsharp”]#load "../.paket/load/netstandard2.0/main.group.fsx"[/code]
And from now on we can use our dependencies.
Depending on what editor you are using, you might want to add
[code language=”fsharp”]
#if INTERACTIVE
#r "netstandard"
#endif
[/code]
below the #load
, as netstandard and fsi will only be fully supported in .NETCore 3.0.
So when does this approach make sense?
fsproj
file is a bit of an overkill.fsproj
when the need arises.Check out http://github.com/nojaf/fable-fsx-sample for a larger sample.
I hope you enjoyed this blogpost and it all makes sense. If you have any suggestions or questions please leave a comment. Want to read more about F#? Take a look at Watching files with FAKE 5
Cheers,
Florian
Get to know Axxes and our corporate culture!