skia2/modules/pathkit/npm-asmjs
Kevin Lubick d66553ba8c [pathkit] Publish 1.0.0
The API has been stable for long enough to start using major versions.

Change-Id: I70bb75c6f4b51d2d76b933898608ee2efc155f3b
Bug: skia:8216
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/503738
Reviewed-by: Joe Gregorio <jcgregorio@google.com>
2022-02-04 13:11:08 +00:00
..
CODE_OF_CONDUCT.md [canvaskit] Add files needed for npm release 2018-12-17 17:21:34 +00:00
CONTRIBUTING.md [canvaskit] Add files needed for npm release 2018-12-17 17:21:34 +00:00
example.html Reland "[pathkit] Reorganize to be more like CanvasKit" 2022-02-04 13:10:43 +00:00
LICENSE [canvaskit] Add files needed for npm release 2018-12-17 17:21:34 +00:00
package.json [pathkit] Publish 1.0.0 2022-02-04 13:11:08 +00:00
README.md Fix some master -> main references in docs 2021-09-27 14:52:24 +00:00

An asm.js version of Skia's PathOps toolkit.

To use the library, run npm install pathkit-asmjs and then simply include it:

<script src="/node_modules/pathkit-asmjs/bin/pathkit.js"></script>
PathKitInit({
    locateFile: (file) => '/node_modules/pathkit-asmjs/bin/'+file,
}).then((PathKit) => {
    // Code goes here using PathKit
});

PathKit comes in two parts, a JS loader and the actual WASM code. The JS loader creates a global PathKitInit that can be called to load the WASM code. The locateFile function is used to tell the JS loader where to find the .js.mem file. By default, it will look for /pathkit.js.mem, so if this is not the case, use locateFile to configure this properly. The PathKit object returned upon resolution of the PathKitInit Promise is fully loaded and ready to use.

See the API page and example.html for details on how to use the library.

Using PathKit and WebPack

WebPack's support for asm.js should be straight-forward, since it's just another JS library. PathKit can be used with just a few configuration changes.

In the JS code, use require():

const PathKitInit = require('pathkit-asmjs/bin/pathkit.js')
PathKitInit().then((PathKit) => {
    // Code goes here using PathKit
})

Since WebPack does not expose the entire /node_modules/ directory, but instead packages only the needed pieces, we have to copy pathkit.mem into the build directory. One such solution is to use CopyWebpackPlugin. For example, add the following plugin:

config.plugins.push(
    new CopyWebpackPlugin([
        { from: 'node_modules/pathkit-asmjs/bin/pathkit.js.mem' }
    ])
);

If webpack gives an error similar to:

ERROR in ./node_modules/pathkit-asmjs/bin/pathkit.js
Module not found: Error: Can't resolve 'fs' in '...'

Then, add the following configuration change to the node section of the config:

config.node = {
    fs: 'empty'
};