#Component name is "NoName"

1 messages · Page 1 of 1 (latest)

quaint granite
#

I'm doing https://bun.sh/docs/runtime/loaders#jsx right now and I've created a react.tsx file, where I've copy/pasted the given code:

  return (
    <body>
      <h1 style={{ color: 'red' }}>{props.message}</h1>
    </body>
  );
}

console.log(<Component message="Hello world!" />);

At first, when I ran bun run react.tsx I got the error error: Cannot find module "react/jsx-dev-runtime" from "/root/projects/bun/quickstart/react.tsx"

Then I ran bun add react and the command ran successfully

But when running bun run react.tsx, the output is: <NoName message="Hello world!" />

I would've expected it to be <Component message="Hello world!" />, or <react message="Hello world!" />

I've tried changing the file name to Component.tsx, but it didn't change the output, the first part is still "NoName".

Any idea why this might be happening?

I tried running
bun add react/jsx-dev-runtime

which led to bun add v1.0.18 (36c316a2) :mag: react [2/2] GET https://api.github.com/repos/react/jsx-dev-runtime/tarball/ - 404 error: react/jsx-dev-runtime failed to resolve

Bun
File types – Runtime | Bun Docs

Bun's runtime supports JavaScript/TypeScript files, JSX syntax, Wasm, JSON/TOML imports, and more.

wind ingot
quaint granite
#

No solution since August.. damn

wind ingot
#

its cause they prioritize more important issues

#

and node compatibility

quaint granite
#

for some reason I get <Component... instead of <NoName... now after adding import React from 'react';
Though, when I remove it, I still get it. No idea what "fixed" it

#

Alright it wasn't the import React from 'react', it's adding export to the function.
So essentially export function Component... instead of function Component...