HMR

HMR (Hot Module Replacement) allows you to apply changes without restarting a plugin.

Note: A plugin should be running to get HMR working.

To enable HMR the following steps are needed:

  1. Create webpack.ui.config.js file and add the following code:
var configure = require('react-figma-webpack-config/hmr');
module.exports = configure();
  1. Create ui.html file add the following code:
<script type="text/javascript" src="http://localhost:8080/ui.js"></script>
  1. Change starting script at package.json:
-"webpack:watch": "webpack --watch"
+"webpack:watch": "webpack && webpack-dev-server --config webpack.ui.config.js"
  1. Add the following code to React entry point file (it's src/ui.tsx usually):
...
// @ts-ignore
if (module.hot) {
// @ts-ignore
module.hot.accept();
}

See full example here.