next.js: Fast-Refresh doesn't work for example using-preact

Bug report

Describe the bug

When using the example using-preact to create a new project, the Fast-Refresh doesn’t work as expected.

To Reproduce

Steps to reproduce the behavior, please provide code snippets or a repository:

Create a next.js project from using-preact-example: yarn create next-app --example using-preact using-preact-app
Run the dev server yarn dev
Change any text inside pages/index.js and save
The page shows the previous code and does not change the text

Expected behavior

On changing any text inside JSX elements it should reflect on development environment.

System information

OS: Manjaro Linux(Kernel 5.4.x)
Browser: Firefox Developer Edition
Version of Next.js: 9.4.4
Version of Node.js: 12.17.0

About this issue

Original URL
State: closed
Created 4 years ago
Reactions: 5
Comments: 16 (9 by maintainers)

Commits related to this issue

feat(examples): use next-plugin-preact on using-preact example (#18588) hey there 👋 stumbled on the [`using-preact` example](https://github.com/vercel/next.js/tree/canary/examples/using-preact) fi... — committed to vercel/next.js by deleted user 4 years ago

Most upvoted comments

I’ve opened #13976 to update the using-preact example so that it matches the latest version from nextjs-preact-demo including @JoviDeCroock’s fix. We’re likely going to publish a dedicated Next.js Preact plugin since the configuration here is nontrivial.

+16

developit on Jun 9, 2020

I’ve got a setup based on the preact example and fast refresh seems to be working but I still get this annoying warning:

warn - Fast Refresh is disabled in your application due to an outdated react version. Please upgrade 16.10 or newer! Read more: https://err.sh/next.js/react-version Do I need to just get over it 😅 or is this something you’d be open to removing/fixing/rewording?

06kellyjac on Nov 2, 2020

We’ve published next-plugin-preact @vitordino

JoviDeCroock on Oct 30, 2020

I’ve opened #13976 to update the using-preact example so that it matches the latest version from nextjs-preact-demo including @JoviDeCroock’s fix. We’re likely going to publish a dedicated Next.js Preact plugin since the configuration here is nontrivial.

Awesome! Can I support you here somehow?

wiesson on Sep 26, 2020

Hey @Timer @shakib609

I have some input yes, I fixed this issue in this PR for the demo we’re maintaining https://github.com/developit/nextjs-preact-demo/pull/16 this replaces react-fast-refresh with prefresh.

JoviDeCroock on Jun 9, 2020

I believe the Preact team has started on this @shakib609. Let’s see if @jovidecroock has some input before we proceed.

Timer on Jun 9, 2020

just found it ✨ great work guys… just opened an PR on the using-preact example to make it the official ™ way

vitordino on Oct 31, 2020

Fast Refresh is a React feature, so it’s expected to not work with Preact.

The example needs to be updated for Preact’s specialized support.

Timer on Jun 9, 2020