title: parcel is not Reloading and emitted ERR_UNHANDLED_REJECTION Exception while using react
body: <p>I'm using electron and react</p>
  <p>if there's a mistake token typo, ERR_UNHANDLED_REJECTION pops up and react reload stops.</p>
  <p>I want HMR to be maintained even if there is a token typo.</p>
  <h2> Configuration (.babelrc, package.json, cli command)</h2>
  
  <p>package.json</p>
  <pre class="lang-js prettyprint-override"><code>{
    &quot;name&quot;: &quot;boilerplate&quot;,
    &quot;version&quot;: &quot;1.0.0&quot;,
    &quot;description&quot;: &quot; React Electron Parcel Boilerplate&quot;,
    &quot;main&quot;: &quot;src/electron/index.js&quot;,
    &quot;scripts&quot;: {
      &quot;start&quot;: &quot;node scripts/start.js&quot;,
      &quot;electron&quot;: &quot;electron .&quot;,
      &quot;build&quot;: &quot;node scripts/build.js&quot;
    },
    &quot;keywords&quot;: [
      &quot;react&quot;,
      &quot;electron&quot;,
      &quot;parcel&quot;
    ],
    &quot;author&quot;: &quot;Ferenc Almasi&quot;,
    &quot;license&quot;: &quot;ISC&quot;,
    &quot;dependencies&quot;: {
      &quot;@chakra-ui/react&quot;: &quot;^1.8.3&quot;,
      &quot;@emotion/react&quot;: &quot;^11&quot;,
      &quot;@emotion/styled&quot;: &quot;^11&quot;,
      &quot;@react-icons/all-files&quot;: &quot;^4.1.0&quot;,
      &quot;add&quot;: &quot;^2.0.6&quot;,
      &quot;framer-motion&quot;: &quot;^6&quot;,
      &quot;react&quot;: &quot;17.0.1&quot;,
      &quot;react-dom&quot;: &quot;17.0.1&quot;,
      &quot;react-indiana-drag-scroll&quot;: &quot;^2.1.0&quot;,
      &quot;react-photo-gallery&quot;: &quot;^8.0.0&quot;,
      &quot;react-scripts&quot;: &quot;^5.0.0&quot;,
      &quot;react-scroll-horizontal&quot;: &quot;^1.6.6&quot;,
      &quot;recoil&quot;: &quot;^0.6.1&quot;,
      &quot;smooth-scrollbar&quot;: &quot;^8.7.4&quot;,
      &quot;yarn&quot;: &quot;^1.22.17&quot;
    },
    &quot;devDependencies&quot;: {
      &quot;electron&quot;: &quot;17.0.0&quot;,
      &quot;electron-packager&quot;: &quot;15.2.0&quot;,
      &quot;electron-reloader&quot;: &quot;1.1.0&quot;,
      &quot;electron-winstaller&quot;: &quot;4.0.1&quot;,
      &quot;parcel-bundler&quot;: &quot;1.12.4&quot;,
      &quot;sass&quot;: &quot;1.36.0&quot;
    }
  }
  </code></pre>
  <h2> Expected Behavior</h2>
  <p>Still HMR ongoing, even if have token exception.</p>
  <p>like react-scripts</p>
  <h2> Current Behavior</h2>
  <p>react reload is stopped while using &lt;/video &lt;-- mistake tag</p>
  <pre><code>&gt; boilerplate@1.0.0 electron
  &gt; electron .
    /Users/ace/Desktop/lask launhcer electron/lask_launcher_electron/src/frontend/view/LoginView.js:40:20: Unexpected token, expected &quot;jsxTagEnd&quot; (40:20)
    38 |                         &lt;source src={MinecraftTrailer} type={'video/mp4'}/&gt;
    39 |                     &lt;/video
  &gt; 40 |                     {/*&lt;Img position={'absolute'} src={MinecraftLoginView} objectFit={'none'}/&gt;*/}
       |                    ^
    41 |                     &lt;Box position={'relative'} left={'700px'} width={'500px'} height={'100vh'} bg={'rgba(0,0,0,0.5)'}
    42 |                          backdropFilter={'blur(20px)'}&gt;
    43 |                         &lt;Flex flexDirection={'column'} height={'100vh'} justifyContent={'center'} alignItems={'center'}&gt;
  node:internal/process/promises:246
            triggerUncaughtException(err, true /* fromPromise */);
            ^
  
  [UnhandledPromiseRejection: This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). The promise rejected with the reason &quot;#&lt;Object&gt;&quot;.] {
    code: 'ERR_UNHANDLED_REJECTION'
  </code></pre>
  <h2> Possible Solution</h2>
  
  <h2> Context</h2>
  <p>I'm using electron and react</p>
  <p>if there's a mistake token typo, ERR_UNHANDLED_REJECTION pops up and react reload stops.</p>
  <p>I want HMR to be maintained even if there is a token typo.</p>
  <h2> Code Sample</h2>
  <p>electron_root.js</p>
  <pre class="lang-js prettyprint-override"><code>const { app, BrowserWindow } = require('electron');
  
  try {
      require('electron-reloader')(module);
  } catch (_) {}
  
  let mainWindow;
  let loginWindow;
  
  const createWindow = () =&gt; {
      mainWindow = new BrowserWindow({
          title: &quot;Lask Launcher&quot;,
          resizable: true,
          autoHideMenuBar: true,
          width: 1738,
          height: 1080,
          titleBarStyle: 'hiddenInset',
          webPreferences: {
              nodeIntegration: true,
              contextIsolation: false,
              allowRunningInsecureContent: true,
              webSecurity: false
          }
      });
  
      mainWindow.loadFile('build/index.html');
  };
  
  const createLoginWindow = () =&gt; {
      loginWindow = new BrowserWindow({
          title: &quot;Login Window&quot;,
          resizable: true,
          autoHideMenuBar: true,
          width: 1370,
          height: 772,
          titleBarStyle: 'hiddenInset',
          webPreferences: {
              nodeIntegration: true,
              contextIsolation: false,
              allowRunningInsecureContent: true,
              webSecurity: false,
          }
      });
  
      loginWindow.loadFile('build/index.html')
  }
  
  app.commandLine.appendSwitch(&quot;autoplay-policy&quot;, &quot;no-user-gesture-required&quot;)
  app.whenReady().then(createLoginWindow);
  app.on('window-all-closed', () =&gt; app.quit());
  app.on('activate', () =&gt; {
  
      if(loginWindow === null){
          createLoginWindow()
      }
  
      // if (mainWindow === null) {
      //     createWindow();
      // }
  });
  </code></pre>
  <p>parcel bunderl js</p>
  <pre class="lang-js prettyprint-override"><code>const Bundler = require('parcel-bundler');
  
  const entry = './public/index.html';
  const options = {
      outDir: './build',
      publicUrl: './',
      sourceMaps: false,
      autoInstall: false,
      hmr: false,
      target: 'electron'
  };
  
  let electronStarted = false;
  
  (async () =&gt; {
      const bundler = new Bundler(entry, options);
  
      bundler.on('bundled', bundle =&gt; {
          if (!electronStarted) {
              electronStarted = true;
  
              require('child_process').spawn('npm', ['run', 'electron'], {
                  stdio: ['ignore', 'inherit', 'inherit'],
                  shell: true
              });
          }
      });
  
      bundler.bundle();
  })();
  </code></pre>
  <h2> Your Environment</h2>
  
  <div class="s-table-container">
  <table class="s-table">
  <thead>
  <tr>
  <th>Software</th>
  <th>Version(s)</th>
  </tr>
  </thead>
  <tbody>
  <tr>
  <td>Parcel</td>
  <td>1.12.4</td>
  </tr>
  <tr>
  <td>Node</td>
  <td>v16.13.1</td>
  </tr>
  <tr>
  <td>npm/Yarn</td>
  <td>yarn</td>
  </tr>
  <tr>
  <td>Operating System</td>
  <td>mac os</td>
  </tr>
  </tbody>
  </table>
  </div>