All of your Animator projects live in ~/.haiku/projects/YOURUSERNAME/PROJECTNAME — and the project files are plain JavaScript.

You can symlink them into your code projects (React/Vue/Angular), for example with npm link or yarn link , and then any changes you make in Animator will propagate through your dev project.

You will find instructions on how to embed your animation on the "Publish" modal.

You can also do this by command line:

cd ~/.haiku/projects/YOUR_ANIMATOR_USERNAME/YOUR_ANIMATOR_PROJECT_NAME
npm link
cd YOUR_CODEBASE
npm link @haiku/YOUR_LOWERCASE_USERNAME-YOUR_LOWERCASE_PROJECT_NAME


This will create a symlink from where your Animator project sits on disk to your node_modules directory inside your codebase.  As long as your dev server is configured to reload upon changes in node_modules (often but not always the case), you should see your codebase reload any time you make changes to that Animator project, including from the Animator-watched Sketch file.

Tip: The Angular compiler doesn’t follow symlinks by default, so if you’re not using symlinks already, you’ll probably need to add the preserveSymlinks build option to your angular.json.

See here for details: https://github.com/angular/angular-cli/issues/10735#issuecomment-387636803 

Did this answer your question?