Blitz: NextJs: Error: The default export is not a React Component in page: "/<projects>"

[sondh0127]

What is the problem?

Error: The default export is not a React Component in page: "/projects"

Steps to Reproduce

1. blitz new testsave
2. cd testsave
3. blitz generate all project name:string
4. blitz db migrate
5. code . Open with Vscode Editor

6. blitz start

7. signup/ login with an account

8. go to /projects
9. Try to change something or just save "app/projects/index.tsx"
10. Repeat step 9 sometime.(3-4) => Got error
11. Try to save again => Ok: page refresh the new page

• When adding more pages, this error happens over and over

Versions

debug: blitzPkgPath: /home/sondh0127/Dev/learning/portnew/node_modules/blitz/dist/index.js
debug: cliPkgPath: /home/sondh0127/Dev/learning/portnew/node_modules/@blitzjs/cli/lib/src/index.js 

Linux 5.4 | linux-x64 | Node: v14.6.0

blitz: 0.21.1 (global)
blitz: 0.21.1 (local)

  Package manager: yarn 
  System:
    OS: Linux 5.4 Ubuntu 20.04.1 LTS (Focal Fossa)
    CPU: (4) x64 Intel(R) Core(TM) i5-6440HQ CPU @ 2.60GHz
    Memory: 1.54 GB / 15.53 GB
    Shell: 5.8 - /usr/bin/zsh
  Binaries:
    Node: 14.6.0 - ~/.nvm/versions/node/v14.6.0/bin/node
    Yarn: 1.22.4 - ~/.nvm/versions/node/v14.6.0/bin/yarn
    npm: 6.14.7 - ~/.nvm/versions/node/v14.6.0/bin/npm
    Watchman: Not Found
  npmPackages:
    @prisma/cli: 2.6.0 => 2.6.0 
    @prisma/client: 2.6.0 => 2.6.0 
    blitz: 0.21.1 => 0.21.1 
    react: 0.0.0-experimental-7f28234f8 => 0.0.0-experimental-7f28234f8 
    react-dom: 0.0.0-experimental-7f28234f8 => 0.0.0-experimental-7f28234f8 
    typescript: 3.9.7 => 3.9.7 

Other

Please include applicable logs and screenshots that show your problem.

[flybayer]

Thanks for reporting this @sondh0127! A few others have reported similar things. Someone just needs to dig in and figure out what's going on.

[sondh0127]

The problem is around the .blitz/caches/dev/pages/**/*

When I change a page, the cache removes all content of the page in the folder above before putting new content.

[flybayer]

Oh very interesting. Thanks for figuring that out!

@ryardley can you take a look at this? 👆

[flybayer]

@ryardley bump

[ryardley]

Struggling to reproduce this on macOS. Suspecting this might be OS dependent. Perhaps anyone who has experienced this bug could provide their os?

[hardfire]

Couldn't reproduce this on Ubuntu as well. Thought, I can recall bumping into this issue in the past but it was always intermittent.

• Try to change something or just save "app/projects/index.tsx"
  *
  I changed the app/projects/pages/projects/index.tsx file.

Here's my blitz --version (P.S. also tested this on a project on 0.21.1 (local) )

Linux 5.4 | linux-x64 | Node: v12.14.0                                    

blitz: 0.21.1 (global)                                                    
blitz: 0.22.2-canary.0 (local)                                            

  Package manager: yarn                                                   
  System:                                                                 
    OS: Linux 5.4 Ubuntu 20.04.1 LTS (Focal Fossa)                        
    CPU: (4) x64 Intel(R) Core(TM) i7-6600U CPU @ 2.60GHz                 
    Memory: 1.47 GB / 7.45 GB                                             
    Shell: 5.0.17 - /bin/bash                                             
  Binaries:                                                               
    Node: 12.14.0 - ~/app/node/bin/node                                   
    Yarn: 1.22.4 - /usr/bin/yarn                                          
    npm: 6.13.4 - ~/app/node/bin/npm                                      
    Watchman: 4.9.0 - /usr/local/bin/watchman                             
  npmPackages:                                                            
    @prisma/cli: 2.x => 2.7.1                                             
    @prisma/client: 2.x => 2.7.1                                          
    blitz: canary => 0.22.2-canary.0                                      
    react: 0.0.0-experimental-7f28234f8 => 0.0.0-experimental-7f28234f8    
    react-dom: 0.0.0-experimental-7f28234f8 => 0.0.0-experimental-7f28234f8 
    typescript: 3.x => 3.9.7 

[flybayer]

@sondh0127 can you provide any more details on how to reproduce this?

[nyn0x]

Same for me on windows
If I edit a component page I got : Error: The default export is not a React Component in page: "/<projects>"
If I edit a component use in a page I got: Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

same as @sondh0127, the file is empty in .../.blitz/caches/dev/app/**/file.tsx

```Windows 10 | win32-x64 | Node: v12.18.3

blitz: 0.21.1 (global)
blitz: 0.21.1 (local)

Package manager: yarn
System:
OS: Windows 10 10.0.18362
CPU: (4) x64 Intel(R) Core(TM) i5-4570 CPU @ 3.20GHz
Memory: 7.46 GB / 15.95 GB
Binaries:
Node: 12.18.3 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.4 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
npm: 6.13.6 - C:\Program Files\nodejs\npm.CMD
Watchman: Not Found
npmPackages:
@prisma/cli: 2.6.2 => 2.6.2
@prisma/client: 2.6.2 => 2.6.2
blitz: 0.21.1 => 0.21.1
react: 0.0.0-experimental-7f28234f8 => 0.0.0-experimental-7f28234f8
react-dom: 0.0.0-experimental-7f28234f8 => 0.0.0-experimental-7f28234f8
typescript: 3.9.7 => 3.9.7```

[sondh0127]

@sondh0127 can you provide any more details on how to reproduce this?

I think Steps to Reproduce is enough to produce the error. But I can confirm that this might depend on the machine specification. Since I can't reproduce this on my friend computer 💻

[ryardley]

It could have something to do with the way that vinyl-fs writes streams to disk or it could be a crash somewhere during write that isn’t being surfaced. Running a mv to place the file will fix 1 but not 2. In either case I need to somehow deterministically reproduce this.

[hasparus]

Okay, same issue on my Pop_OS! with Node 14, and @beerose's MacOS with Node 12.

Sometimes while we change files, Blitz just needs a double or triple save to properly refresh instead of showing this error.

⇝ blitz --version

Linux 5.4 | linux-x64 | Node: v14.10.1

blitz: 0.23.4 (local)

  Package manager: yarn 
  System:
    OS: Linux 5.4 Pop!_OS 20.04 LTS
    CPU: (4) x64 Intel(R) Core(TM) i7-6600U CPU @ 2.60GHz
    Memory: 1.51 GB / 15.31 GB
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 14.10.1 - /tmp/yarn--1601768594683-0.6569711132266067/node
    Yarn: 1.22.5 - /tmp/yarn--1601768594683-0.6569711132266067/yarn
    npm: 6.14.8 - ~/.nvm/versions/node/v14.10.1/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  npmPackages:
    @prisma/cli: 2.x => 2.8.0 
    @prisma/client: 2.x => 2.8.0 
    blitz: latest => 0.23.4 
    react: 0.0.0-experimental-7f28234f8 => 0.0.0-experimental-7f28234f8 
    react-dom: 0.0.0-experimental-7f28234f8 => 0.0.0-experimental-7f28234f8 
    typescript: 4.x => 4.0.3