Component type

On the documentation I saw this example :

import { type Component } from "solid-js";

const MyTsComponent(): Component = () => {
  return (
    <div>
      <h1>This is a TypeScript component</h1>
    </div>
  );
}

export default MyTsComponent;

import { type Component } from "solid-js";

const MyTsComponent(): Component = () => {
  return (
    <div>
      <h1>This is a TypeScript component</h1>
    </div>
  );
}

export default MyTsComponent;

It should not be const MyTsComponent = (): Component => { ? Maybe it is a reserved syntax handled by the solid transpilator ? (sorry if there are some english errors)

9 Replies

Brendonovich•3w ago

Ah that should be

import { type Component } from "solid-js";

const MyTsComponent: Component = () => {
  return (
    <div>
      <h1>This is a TypeScript component</h1>
    </div>
  );
}

export default MyTsComponent;

import { type Component } from "solid-js";

const MyTsComponent: Component = () => {
  return (
    <div>
      <h1>This is a TypeScript component</h1>
    </div>
  );
}

export default MyTsComponent;

GyomeOP•3w ago

Ok but what is the différence between const MyTsComponent: Component = () and const MyTsComponent = (): Component ?

Brendonovich•3w ago

The second isn't valid Oh actually no

GyomeOP•3w ago

It is specific to solid or typescript compliant ?

Brendonovich•3w ago

const MyTsComponent: Component means 'this function is a component', const MyTsComponent = (): Component means 'this function returns a component' but const MyTsComponent(): Component = () isn't valid typescript and the docs need to be updated it's a typescript thing

GyomeOP•3w ago

Ok I don't have a big experience I checked on the doc yesterday but nothing was related to this syntax : https://www.tutorialsteacher.com/typescript/arrow-function

TypeScript Arrow Functions

GyomeOP•3w ago

I will search more further, I didn't pay attention but it was not the ts documentation Sorry for that

Atila•3w ago

this: const MyTsComponent() is definitely wrong and not supported in Solid in any way... Definitely a typo. can you create an issue or make a PR to fix or give us a url of where you found this ?

Erik Demaine•3w ago

Done: https://github.com/solidjs/solid-docs/pull/975

Gaming

Programming

Component type