Error with BrowserFS while rendering a React app

[amitnovick]

🐛 bug report

Description of the problem

This React project works for me on my local environment. Tried to upload it and this issue happens on the provided URL below.

Might be related to this open issue at BrowserFS

Attached image showing what it looks like.

Error: EIO: Initialize BrowserFS with a file system using BrowserFS.initialize(filesystem)

11 stack frames were expanded.
C
https://codesandbox.io/static/js/sandbox.3fc888ce.js:1:220188
Worker.<anonymous>
https://codesandbox.io/static/js/sandbox.3fc888ce.js:1:223203
g
https://codesandbox.io/static/js/common-sandbox.730613df.chunk.js:1:207992
Generator._invoke
https://codesandbox.io/static/js/common-sandbox.730613df.chunk.js:1:207780
Generator.e.(anonymous function) [as next]
https://codesandbox.io/static/js/common-sandbox.730613df.chunk.js:1:208171
u
https://codesandbox.io/static/js/common-sandbox.730613df.chunk.js:1:2891
a
https://codesandbox.io/static/js/common-sandbox.730613df.chunk.js:1:2980
(anonymous function)
https://codesandbox.io/static/js/common-sandbox.730613df.chunk.js:1:3019
new r
https://codesandbox.io/static/js/common-sandbox.730613df.chunk.js:1:71362
Worker.<anonymous>
https://codesandbox.io/static/js/common-sandbox.730613df.chunk.js:1:2822
Worker.<anonymous>
https://codesandbox.io/static/js/sandbox.3fc888ce.js:1:224364

How has this issue affected you? What are you trying to accomplish?

Trying to demonstrate an issue that I raised on emotion's repo

Link to sandbox: link included

Your Environment

Software	Name/Version
Сodesandbox	PROD-1541005726-0dba21e
Browser	Chromium 70.0.3538.77 (Official Build)
Operating System	Built on Ubuntu , running on LinuxMint 18.3 (64-bit)

[amitnovick]

Update: previous error message is gone, here is the new error message:

On the dev server which create-react-app uses it works fine outside CodeSandbox, despite VSCode giving this warning:

Could not find a declaration file for module 'emotion/macro'.

[rahulparmar339]

change import statement from import { css } from "emotion/macro"; to import { css } from "emotion"; in style.css file it worked for me

[amitnovick]

change import statement from import { css } from "emotion/macro"; to import { css } from "emotion"; in style.css file it worked for me

Hi, thanks for trying it out! that suggestion does solve the error for me as well.

The truth is I already knew that it solves it (that's why I kept it in commented out).

However, There is still a reason why I wanted to keep this issue open, though.

There is an inconsistency between the build produced by CodeSandbox and the build I use with my dev server.

As you can see from the attached image, the build i'm using with the dev server works, whereas the CodSandbox build doesn't work.

This means that the build is not reproducible, at least across these two environments (my local dev environment and the CodeSandbox-generated environment).

Is this a CodeSandbox issue? I can't tell! there are so many moving parts at play here.

I could look into the specific versions of the dependencies I'm using and see if the exact same versions were used for the CodeSandbox environment. It could also be a build tool-specific issue, like npm, or Node.js, really I have no clue just guessing.

[CompuIves]

This one has been fixed!

[amitnovick]

This one has been fixed!

Yep just verified that the bug is gone :v:

The behaviour is consistent with create-react-app environment I showed in previous comment: