Templates throw error on sw-debug.js

[mattrossman]

Someone brought this up in #2224 but it was closed without resolution. I've started projects with:

yarn create snowpack-app my-app --template @snowpack/app-template-react
and
yarn create snowpack-app my-app --template @snowpack/app-template-react-typescript

A simple yarn start in either project produces a 404 error for /sw-debug.js

This probably shouldn't be happening in a starter template, so how should this be resolved? Starting this as a discussion per @FredKSchott's request.

[melissamcewen]

Hi @mattrossman, apologies for the delay. I wonder if we fixed this somehow because I just tried yarn create snowpack-app my-app --template @snowpack/app-template-react-typescript and it seems to work for me. If it doesn't, can you give us some details on. your environment?

[mattrossman]

@melissamcewen I see the same error on my Macbook running node v14.15.4 and yarn v1.22.4

[SampsonM]

I've got almost the same issue using the same command as above -npx create-snowpack-app my-app --template @snowpack/app-template-react-typescript

The minor difference being the file shown is sw.js.

Node - v12.16.3
NPM - v6.14.4

Also followed the react tutorial and got the same error.

[jessaleks]

I have the same error.

[tduyng]

I have same error too. I try to handle NotFoundPage as when I work normally with React & webpack :

//....
     <Switch>
        <Route
          exact
          path={PATH.HOME}
          render={() => <Redirect to={PATH.ADMIN} />}
        />
        <Route exact path={PATH.ADMIN} component={AdminPage} />
        <Route component={NotFoundPage} />
      </Switch>

But the error 404 always pass on console [snowpack] [404] /path-not-found

[tduyng]

Finally I try to update fallback routes from snowpack.config.js:

// snowpack.config.js
routes: [
    /* Enable an SPA Fallback in development: */
    { match: 'routes', src: '.*', dest: '/index.html' },
  ],

And it solved this problem for me.

[zgoda]

This is related to Preact's debug service worker. Something activates if your app runs on port 8080 (default) or any other you had Preact app running previously. Even their own unbundled tool WMR shows the same symptoms. It has nothing with javascript, you will get such request event in your Python WSGI app if you start it on port 8080.

Run your non-Preact app on any other port for quick workaround, bug them if this makes you angry and you want this fixed.

[algoflows]

running on port 3000 seems to work :)