Gutenberg Blocks Development – Live Reload

As I never menaged to set up WordPress/Scripts –hot I prefer to use Browser Sync

Install NPM

After instaling NPX Create block run:

  npm install browser-sync npm-run-all --save-dev

Then in the package.json update scripts section

  "scripts": {
    "preview": "npm-run-all --parallel sync start",
    "sync": "browser-sync start -p 'dev-wordpress.local' --files '**/*.php' 'build/*.js' 'build/*.css'",
    "build": "wp-scripts build",
    "packages-update": "wp-scripts packages-update",
    "plugin-zip": "wp-scripts plugin-zip",
    "start": "wp-scripts start"
  },

Replace ‘dev-wordpress.local’ with your local websute URL