Files
yoga/javascript
Nick Gerleman 0d03d8a06d Manage native build toolchain (#1506)
Summary:
Pull Request resolved: https://github.com/facebook/yoga/pull/1506

In order to build the website, you must build a Yoga binary. This usually requires installing native toolchains.

We have warning messages for these right now, but an even better solution is to just manage the dependencies ourselves. This does that, bringing in specific CMake and Ninja binaries from NPM, and caching a local copy of Emscripten during the build.

A downside is that the CMake packages are chunky, so we add 130MB to node_modules (for a repo total around 350MB). This also delays acquiring Emscripten (which is even chunkier) in CI builds until it is needed, and I added some caching for it as well.

The upside of JS users being able to run and test (inc the website) without installing and managing their own versions of toolchains is a real time-saver though, and is probably worth it.

allow-large-files

Reviewed By: yungsters

Differential Revision: D52013026

fbshipit-source-id: 3d307f751463a21c5e5d5b98b8e9e63db9d3d52e
2023-12-12 09:06:58 -08:00
..
2023-12-12 09:06:58 -08:00

yoga-layout

This package provides prebuilt WebAssembly bindings for the Yoga layout engine.

Usage

import {Yoga, Align} from 'yoga-layout';

const node = Yoga.Node.create();
node.setAlignContent(Align.Center);

Objects created by Yoga.<>.create() are not automatically garbage collected and should be freed once they are no longer in use.

// Free a config
config.free();

// Free a tree of Nodes
node.freeRecursive();

// Free a single Node
node.free();

Using TypeScript

This package provides out-of-the-box TypeScript typings so long as tsc is configured to support ESM resolution. It is recommended to set moduleResolution: 'bundler' or moduleResolution: node16 in your tsconfig.json according to your environment.

ES Modules

yoga-layout is only provided as an ES Module, relying on top-level await. This allows providing a synchronous API, while still allowing async WebAssembly compilation in browsers, and will allow eventual usage of ESM/WASM interop.

Contributing

Requirements

  1. Emscripten SDK
  2. CMake >= 3.13
  3. (Optional) ninja, for faster builds

Building

git clone https://github.com/facebook/yoga.git
cd yoga/javascript
yarn install
yarn build

Testing

# Build and test all entrypoints
yarn test

# Build and test a specific entrypoint
yarn test:asmjs-sync