Watch and reaload for polymer serve / polyserve?

Question

I'm trying to figure out a way to make polyserve / polymer-cli to reload my browser each time a "watched" file changes but I haven't found anything apart of adding Livereload to the HTMLs files that I think is going to be a mess due that when developing web components I load separate HTML files.

Unlisted

There's a PR in progress for this feature. You could wait for that to land, or update your build to use gulp and add a live reload plugin (such as browsersync). You could also peek at Polymer Starter Kit 1.3.0 (old) to learn from their browsersync usage. – Bora

Answer 1

For auto reloading using Polymer CLI as a server in your project you should have node / yarn installed. Then you need to install browser-sync locally.

npm install -D browser-sync

or

yarn add browser-sync --dev

Your package.json file will need to look something like:

{
  "name": "MY-ELEMENT",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "scripts": {
    "start": "npm run serve | npm run watch",
    "serve": "polymer serve --port 8080",
    "test": "polymer test",
    "watch": "browser-sync start --proxy localhost:8080 --open --startPath \"components/MY-ELEMENT\" --files \"**/*.html\""
  },
  "devDependencies": {
    "browser-sync": "^2.18.13"
  }
}

(If its a regular Polymer app you should remove the --startPath argument as that is for Polymer component development)

Fountain

Thanks a lot! It worked. If anybody run the server under https like me remember to pass --https to browser-sync to work properly. – Unlisted

If someone is using polymer-cli and request for live-reload, I think that means he/she already has npm or yarn installed. – Fritzie

Answer 2

I'm using polyserve-watch which watches, serves and reloads webcomponents using polyserve and browser-sync``.

Best regards

Zibet

polymer-watch Unpublished On Sat Aug 15 2020 15:53:36 GMT+0800 (China Standard Time) developer.aliyun.com/mirror/npm/package/polyserve-watch. – Nationwide

Yes you don't need it anymore. I have unpublished it because you have a lot of better tools like es-dev-server – Zibet