blob: 571bcfa91c0ab694f221ca93bafd99ad311cddb7 [file] [log] [blame] [view]
Kevin Lubicke1b36fe2018-08-02 11:30:33 -04001A WASM version of Skia's PathOps toolkit.
2
Kevin Lubickbe5091c2018-08-31 10:45:18 -04003To use the library, run `npm install pathkit-wasm` and then simply include it:
Kevin Lubicke1b36fe2018-08-02 11:30:33 -04004
Kevin Lubickbe5091c2018-08-31 10:45:18 -04005 <script src="/node_modules/pathkit-wasm/bin/pathkit.js"></script>
Kevin Lubicke1b36fe2018-08-02 11:30:33 -04006 PathKitInit({
Kevin Lubickbe5091c2018-08-31 10:45:18 -04007 locateFile: (file) => '/node_modules/pathkit-wasm/bin/'+file,
Kevin Lubicke1b36fe2018-08-02 11:30:33 -04008 }).then((PathKit) => {
9 // Code goes here using PathKit
10 });
11
12PathKit comes in two parts, a JS loader and the actual WASM code. The JS loader creates
13a global `PathKitInit` that can be called to load the WASM code. The `locateFile` function
14is used to tell the JS loader where to find the .wasm file. By default, it will
15look for /pathkit.wasm, so if this is not the case, use `locateFile` to configure
16this properly.
17The `PathKit` object returned through the .then() callback is fully loaded and ready to use.
18
Kevin Lubickf14a3c02018-08-22 09:35:32 -040019See the [API page](https://skia.org/user/modules/pathkit) and
Kevin Lubickc7d05712018-08-31 10:03:23 -040020[example.html](https://github.com/google/skia/blob/master/modules/pathkit/npm-wasm/example.html)
Kevin Lubickf14a3c02018-08-22 09:35:32 -040021for details on how to use the library.
Kevin Lubicke1b36fe2018-08-02 11:30:33 -040022
23Using PathKit and WebPack
24-------------------------
25
26WebPack's support for WASM is still somewhat experimental, but PathKit can be
27used with a few configuration changes.
28
29In the JS code, use require():
30
Kevin Lubickbe5091c2018-08-31 10:45:18 -040031 const PathKitInit = require('pathkit-wasm/bin/pathkit.js')
Kevin Lubicke1b36fe2018-08-02 11:30:33 -040032 PathKitInit().then((PathKit) => {
33 // Code goes here using PathKit
34 })
35
36Since WebPack does not expose the entire `/node_modules/` directory, but instead
37packages only the needed pieces, we have to copy pathkit.wasm into the build directory.
Kevin Lubickb3d0e3e2018-08-03 12:24:06 -040038One such solution is to use [CopyWebpackPlugin](https://github.com/webpack-contrib/copy-webpack-plugin).
Kevin Lubicke1b36fe2018-08-02 11:30:33 -040039For example, add the following plugin:
40
41 config.plugins.push(
42 new CopyWebpackPlugin([
Kevin Lubickbe5091c2018-08-31 10:45:18 -040043 { from: 'node_modules/pathkit-wasm/bin/pathkit.wasm' }
Kevin Lubicke1b36fe2018-08-02 11:30:33 -040044 ])
45 );
46
47If webpack gives an error similar to:
48
Kevin Lubickbe5091c2018-08-31 10:45:18 -040049 ERROR in ./node_modules/pathkit-wasm/bin/pathkit.js
Kevin Lubicke1b36fe2018-08-02 11:30:33 -040050 Module not found: Error: Can't resolve 'fs' in '...'
51
52Then, add the following configuration change to the node section of the config:
53
54 config.node = {
55 fs: 'empty'
Kevin Lubick30cc00c2018-08-03 10:26:00 -040056 };