Recovery from SystemJS error

[ArmorDarks]

Is it possible to somehow automatically recover from SystemJS error?

For example, if there were a typo in imported file, we've got following error:

Error: (SystemJS) http://localhost:3000/source/scripts/main.js: Unexpected token (18:6)
      16 |     return React.createElement('div', null, [
      17 |       React.createElement('div', null, 'test')
    > 18 |       React.createElement(Second, null, null)
         |       ^
      19 |     ])
      20 |   }
      21 | }

Hot reloading not working after this error until whole page will be reloaded, which takes quite a lot of time for large apps.

[alexisvincent]

Recovery is actually built into systemjs-hot-reloader. Which version are you running?

[alexisvincent]

Potentially the only thing we don't account for is if importing fails on the very first load of the app. But after that it should recover.

[ArmorDarks]

Hm, in my case nothing happens after hitting syntax error. Chokidar emits change event on change, but hot-reloader does not react on changes until full page refresh.

[alexisvincent]

Which version are you running. Also what is the output after enabling systemjs-hmr debug. (localStorage.debug = "systemjs-hmr:*" in console). Including a refresh

[ArmorDarks]

I'm using system-hot-reloader 1.1.0

Also what is the output after enabling systemjs-hmr debug. (localStorage.debug = "systemjs-hmr:*" in console)

That's displayed right after the load:

This is on reload:

This is after cleaning console and introducing syntax error (I removed , in array):

And when I remove error and resave file, shows:

Same message will be on all other attempts to resave without reloading whole page:

[alexisvincent]

Hmm, which version of SystemJS are you running? There was a bug with the old version of SystemJS.

Also, notice the warning at the top. You need to load systemjs-hot-reloader after SystemJS itself has run.

[ArmorDarks]

Wow, I didn't notice that JSPM beta.41 already came out yesterday... my SystemJS indeed was old, now I've updated to v0.20.10 Dev.

This fixed a lot of issues, but particular case with syntax error still there. But now it behaves differently:

On error introduction:

And when error has been fixed, it keep showing like it still exist:

Any attempts to resave file with fixed error will just show again messages from last screenshot.

Also, notice the warning at the top. You need to load systemjs-hot-reloader after SystemJS itself has run.

Well, I'm quite sure that I do load it after SystemJS, but it still shows up.

My configuration:

Don't mind @ in the beginning. Those are just mapping for Browser Sync routes, so that it could serve files properly (our files served not from same directory as jspm):

[peteruithoven]

I'm also experiencing this issue. I've tried to make a simple example: https://github.com/peteruithoven/hot-reloader-error-recovery

[alexisvincent]

Thanks, will sort this out this weekend. Have a deadline for Friday evening 🍕

[ArmorDarks]

I actually found out that workflow with this hot reloader much more enjoyable than with jspm build --watch even with this issue in-place, so I'm sold out anyway

[alexisvincent]

Apologies that I haven't been present. Have major deadlines for Friday. Will be pushing forwards next week.

[ArmorDarks]

No need for that, it isn't your work after all!

[kanoshin]

@alexisvincent sorry for bothering. This bug seriously interrupts development :(. Have you been able to fix it? Do you need help to fix it?

[isitrita]

Hi, @alexisvincent , I would also love to see this thing to be fixed! Fix for this issue will make development much less painful

[alexisvincent]

Sorry guys, been in a heavy deadline crunch for the past couple of months. Going to try get a look at this in the coming week or so.

[kanoshin]

@alexisvincent after recent system.js update hot reload is able to recover from transpilation errors. I think you can close this bug.

[ArmorDarks]

Yeap, seems so.