README.md
1 An asm.js version of Skia's PathOps toolkit.
2
3 To use the library, run `npm install pathkit-asmjs` and then simply include it:
4
5 <script src="/node_modules/pathkit-asmjs/bin/pathkit.js"></script>
6 PathKitInit({
7 locateFile: (file) => '/node_modules/pathkit-asmjs/bin/'+file,
8 }).ready().then((PathKit) => {
9 // Code goes here using PathKit
10 });
11
12 PathKit comes in two parts, a JS loader and the actual WASM code. The JS loader creates
13 a global `PathKitInit` that can be called to load the WASM code. The `locateFile` function
14 is used to tell the JS loader where to find the .js.mem file. By default, it will
15 look for /pathkit.js.mem, so if this is not the case, use `locateFile` to configure
16 this properly.
17 The `PathKit` object returned upon resolution of the .ready() Promise is fully loaded and ready to use.
18
19 See the [API page](https://skia.org/user/modules/pathkit) and
20 [example.html](https://github.com/google/skia/blob/master/modules/pathkit/npm-asmjs/example.html)
21 for details on how to use the library.
22
23 Using PathKit and WebPack
24 -------------------------
25
26 WebPack's support for asm.js should be straight-forward, since it's just another JS library. PathKit can be
27 used with just a few configuration changes.
28
29 In the JS code, use require():
30
31 const PathKitInit = require('pathkit-asmjs/bin/pathkit.js')
32 PathKitInit().ready().then((PathKit) => {
33 // Code goes here using PathKit
34 })
35
36 Since WebPack does not expose the entire `/node_modules/` directory, but instead
37 packages only the needed pieces, we have to copy pathkit.mem into the build directory.
38 One such solution is to use [CopyWebpackPlugin](https://github.com/webpack-contrib/copy-webpack-plugin).
39 For example, add the following plugin:
40
41 config.plugins.push(
42 new CopyWebpackPlugin([
43 { from: 'node_modules/pathkit-asmjs/bin/pathkit.js.mem' }
44 ])
45 );
46
47 If webpack gives an error similar to:
48
49 ERROR in ./node_modules/pathkit-asmjs/bin/pathkit.js
50 Module not found: Error: Can't resolve 'fs' in '...'
51
52 Then, add the following configuration change to the node section of the config:
53
54 config.node = {
55 fs: 'empty'
56 };
57