Hyperapp: HMR with parcel in 1.2.6

Created on 9 Jun 2018 · 14Comments · Source: jorgebucaran/hyperapp

Parcel with 1.2.5 works great with HMR. With the update to 1.2.6 for some reason HMR is broken and I have to restart the app every time I save something?

Bug

Source

knipferrc

All 14 comments

@knipferrc I'd like to get to the bottom of this and find a fix if there's really an issue. I have a similar problem with parcel, but only when developing Hyperapp, not _with_ Hyperapp. Could you investigate more?

jorgebucaran on 9 Jun 2018

@knipferrc What's the error message by the way?

I'm seeing this a lot (almost every time I change Hyperapp source code), not my app's code.

Cannot read property '__esModule' of null

https://github.com/parcel-bundler/parcel/issues/927

jorgebucaran on 9 Jun 2018

Yeah sure I can investigate. I actually dont get any errors.

knipferrc on 10 Jun 2018

Honestly I have no idea what I did but it seems to be working now for some reason.

knipferrc on 12 Jun 2018

Actually, same here, true story. Very odd. 😆

jorgebucaran on 13 Jun 2018

😄1

Same here, writing garbage code do trigger the error overlay but once fixed or on adding new lines of code HMR does not seem to trigger the page reload. Reloading manually the page still shows the updates though. Hope this feedback helps as I can't investigate any further.

aminnairi on 20 Jun 2018

@aminnairi I haven't had the same error again. I can edit apps, _as well_ as Hyperapp's source—which I'm modifying a lot as I prepare to release 2.0α—and everything works like a charm.

I can't suggest anything concrete since I don't know what fixed things for me, but try removing parcel's cache, node_modules/ and reinstalling dependencies again.

jorgebucaran on 20 Jun 2018

I tried removing the cache, using the --no-cache option, removing the node_modules folder and ran yarn again with no luck. Everything seems to be working except the live reloading which is just a minor inconvenience. I guess this will be fixed when the 2.x.x.

aminnairi on 21 Jun 2018

Thanks, @aminnairi. To clarify, you do mean parcel 2.x?

jorgebucaran on 21 Jun 2018

No, I'm currently using the version 1.9.2 from Parcel. I added it with yarn add --dev parcel-bundler. I'll try with version 2 if I can add it to my packages.

aminnairi on 21 Jun 2018

@aminnairi Ah, okay. I meant when you commented:

I guess this will be fixed when the 2.x.x

You mean parcel 2.x.x and not Hyperapp 2.x.

jorgebucaran on 21 Jun 2018

Oh yes I meant parcel 2 !

aminnairi on 21 Jun 2018

😄1

3rd attemp now working

Okay, I think i've an idea of why it was not working. I always tried to manually install hyperapp when it should be automatically installed by parcel-bundler (I guess there are some hooks, not really sure as I haven't digged into the core of parcel-bundler). The --no-cache could have helped also (not really 100% sure).

So now, everything is working fine, even the live reloading.

`package.json`

{
  "name": "ultra-secret-ultimate-package-final-extend-premium-deluxe-edition-final-v2",
  "version": "1.0.0",
  "main": "index.js",
  "repository": "[email protected]:aminnairi/...",
  "author": "Amin NAIRI <[email protected]>",
  "license": "MIT",
  "scripts": {
    "start": "parcel --no-cache index.html"
  },
  "dependencies": {
    "hyperapp": "^1.2.6", <--- Automatically installed by parcel
    "parcel-bundler": "^1.9.2"
  }
}

`index.jsx`

import { h, app } from 'hyperapp';

const Title = () => <h1>Amin NAIRI</h1>

app( {}, {}, () => (
  <Title />
), document.getElementById('app') );

`index.html`

<!doctype html>
<html>
  <head>
    <title>Amin NAIRI</title>
  </head>
  <body>
    <div id='app'></div>
  </body>
  <script src='index.jsx'></script>
</html>

aminnairi on 21 Jun 2018

Thanks, @aminnairi!