This is the project hosting my FableConf 2017 presentation files and projects
- dotnet SDK 2.0 or higher
- node.js 6.11 or higher
- A JS package manager: yarn or npm
npm comes bundled with node.js, but we recommend to use at least npm 5. If you have npm installed, you can upgrade it by running
npm install -g npm
.
Although is not a Fable requirement, on macOS and Linux you'll need Mono for other F# tooling like Paket or editor support.
In the commands below, yarn is the tool of choice. If you want to use npm, just replace
yarn
bynpm
in the commands.
- Install JS dependencies:
yarn install
- Move to
src
folder:cd src
- Install F# dependencies:
dotnet restore
- Start Fable daemon and Webpack dev server:
dotnet fable yarn-start
- In your browser, open: http://localhost:8080/
Paket is the package manager used for F# dependencies. It doesn't need a global installation, the binary is included in the .paket
folder. Other Paket related files are:
- paket.dependencies: contains all the dependencies in the repository.
- paket.references: there should be one such a file next to each
.fsproj
file. - paket.lock: automatically generated, but should be committed to source control, see why.
- Nuget.Config: prevents conflicts with Paket in machines with some Nuget configuration.
Paket dependencies will be installed in the
packages
directory. See Paket website for more info.
- package.json: contains the JS dependencies together with other info, like development scripts.
- yarn.lock: is the lock file created by yarn.
- package-lock.json: is the lock file understood by npm 5, if you use it instead of yarn.
JS dependencies will be installed in
node_modules
. See yarn and/or npm websites for more info.
Webpack is a bundler, which links different JS sources into a single file making deployment much easier. It also offers other features, like a static dev server that can automatically refresh the browser upon changes in your code or a minifier for production release. Fable interacts with Webpack through the fable-loader
.
- webpack.config.js: is the configuration file for Webpack. It allows you to set many things: like the path of the bundle, the port for the development server or Babel options. See Webpack website for more info.