RATIU5 Comments - Answer Overflow

RATIU5

Explore posts from servers

SSolidJS TTCTheo's Typesafe Cult HHono

Posts Comments

SSolidJS

•Created by RATIU5 on 1/2/2025 in #support

Wrapping SolidStart: JSX is an unknown file extension

No luck so far, I've tried everything I could think of but can't get past this latest error.

3 replies

SSolidJS

•Created by RATIU5 on 1/2/2025 in #support

Wrapping SolidStart: JSX is an unknown file extension

Update: I fixed several errors by filling out this app config for SolidStart:

const app = defineConfig({
  appRoot: path.resolve(__dirname, '../src'),
  server: {
    handler: entryServerPath,
  },
  ssr: true,
  vite: {
    plugins: [solid({ ssr: true })],
    esbuild: {
      loader: 'jsx',
    },
    optimizeDeps: {
      esbuildOptions: {
        loader: {
          '.js': 'jsx',
        },
      },
    },
    resolve: {
      preserveSymlinks: true,
      conditions: ['solid', 'development', 'browser'],
      extensions: [
        '.mjs',
        '.js',
        '.mts',
        '.ts',
        '.jsx',
        '.tsx',
        '.json',
      ],
      alias: {
        // ...
      },
    },
  },
});

const app = defineConfig({
  appRoot: path.resolve(__dirname, '../src'),
  server: {
    handler: entryServerPath,
  },
  ssr: true,
  vite: {
    plugins: [solid({ ssr: true })],
    esbuild: {
      loader: 'jsx',
    },
    optimizeDeps: {
      esbuildOptions: {
        loader: {
          '.js': 'jsx',
        },
      },
    },
    resolve: {
      preserveSymlinks: true,
      conditions: ['solid', 'development', 'browser'],
      extensions: [
        '.mjs',
        '.js',
        '.mts',
        '.ts',
        '.jsx',
        '.tsx',
        '.json',
      ],
      alias: {
        // ...
      },
    },
  },
});

But I'm getting this odd error:

2:11:10 PM [vite] Pre-transform error: Failed to load url @solidjs/start/server (resolved id: /home/projects/sb1-k8bui6zy/packages/app/node_modules/@solidjs/start/server) in /home/projects/sb1-k8bui6zy/packages/app/src/entry-server.tsx. Does the file exist?
example:dev:  2:11:11 PM [vite] Error when evaluating SSR module /@fs/home/projects/sb1-k8bui6zy/packages/app/src/entry-server.tsx: failed to import "@solidjs/start/server"
example:dev:  |- TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".jsx" for /home/projects/sb1-k8bui6zy/node_modules/.pnpm/@[email protected][email protected][email protected][email protected]/node_modules/@solidjs/start/dist/server/index.jsx

2:11:10 PM [vite] Pre-transform error: Failed to load url @solidjs/start/server (resolved id: /home/projects/sb1-k8bui6zy/packages/app/node_modules/@solidjs/start/server) in /home/projects/sb1-k8bui6zy/packages/app/src/entry-server.tsx. Does the file exist?
example:dev:  2:11:11 PM [vite] Error when evaluating SSR module /@fs/home/projects/sb1-k8bui6zy/packages/app/src/entry-server.tsx: failed to import "@solidjs/start/server"
example:dev:  |- TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".jsx" for /home/projects/sb1-k8bui6zy/node_modules/.pnpm/@[email protected][email protected][email protected][email protected]/node_modules/@solidjs/start/dist/server/index.jsx

Anyone got ideas?

3 replies

SSolidJS

•Created by RATIU5 on 10/15/2024 in #support

How do I run an effect every change except initialization?

You're right; my signal isn't updating elsewhere in my code. Considering this thread as solved.

5 replies

SSolidJS

•Created by RATIU5 on 10/15/2024 in #support

How do I run an effect every change except initialization?

Hmmm. Can't seem to reporduce in the playground. Let me check my code again

5 replies

SSolidJS

•Created by RATIU5 on 10/12/2024 in #support

Solid.js does not render children in a `<For>` loop correctly

Well thanks for both of your assistance!

28 replies

SSolidJS

•Created by RATIU5 on 10/12/2024 in #support

Solid.js does not render children in a `<For>` loop correctly

That's true. It also happens with children as well. If this can't be fixed, I guess I can just render them with Solid instead.

28 replies

SSolidJS

•Created by RATIU5 on 10/12/2024 in #support

Solid.js does not render children in a `<For>` loop correctly

If I am understanding you, I think so

28 replies

SSolidJS

•Created by RATIU5 on 10/12/2024 in #support

Solid.js does not render children in a `<For>` loop correctly

I replicated this issue in this StackBlitz project here: https://stackblitz.com/edit/withastro-astro-hj9dxh?file=src%2Fcomponents%2FRenderListInSolid.tsx

28 replies

SSolidJS

•Created by RATIU5 on 10/12/2024 in #support

Solid.js does not render children in a `<For>` loop correctly

For posterity looking more into this problem, more info will be tracked here: https://github.com/withastro/astro/issues/12212

28 replies

SSolidJS

•Created by RATIU5 on 10/12/2024 in #support

Solid.js does not render children in a `<For>` loop correctly

I'll file a bug report on the Astro side. See if this is a probem with the rendering/transformation of Astro components to Solid.js components.

28 replies

SSolidJS

•Created by RATIU5 on 10/12/2024 in #support

Solid.js does not render children in a `<For>` loop correctly

It gives me a DOM element/node that looks like this:

<astro-slot name="trashIcon">
  <svg
    width="20"
    height="20"
    viewBox="0 0 24 24"
    slot="trashIcon"
    data-icon="trash"
    data-astro-source-file="/path/to/project/node_modules/.pnpm/[email protected]/node_modules/astro-icon/components/Icon.astro"
    data-astro-source-loc="117:44"
  >
    <symbol
      id="ai:local:trash"
      data-astro-source-file="/path/to/project/node_modules/.pnpm/[email protected]/node_modules/astro-icon/components/Icon.astro"
      data-astro-source-loc="124:28"
      ><g
        fill="none"
        stroke="currentColor"
        stroke-linecap="round"
        stroke-linejoin="round"
        stroke-width="1.5"
        ><path stroke="none" d="M0 0h24v24H0z"></path><path
          d="M4 7h16m-10 4v6m4-6v6M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2l1-12M9 7V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v3"
        ></path></g
      ></symbol
    ><use
      xlink:href="#ai:local:trash"
      data-astro-source-file="/path/to/project/node_modules/.pnpm/[email protected]/node_modules/astro-icon/components/Icon.astro"
      data-astro-source-loc="125:10"></use>
  </svg>
</astro-slot>

<astro-slot name="trashIcon">
  <svg
    width="20"
    height="20"
    viewBox="0 0 24 24"
    slot="trashIcon"
    data-icon="trash"
    data-astro-source-file="/path/to/project/node_modules/.pnpm/[email protected]/node_modules/astro-icon/components/Icon.astro"
    data-astro-source-loc="117:44"
  >
    <symbol
      id="ai:local:trash"
      data-astro-source-file="/path/to/project/node_modules/.pnpm/[email protected]/node_modules/astro-icon/components/Icon.astro"
      data-astro-source-loc="124:28"
      ><g
        fill="none"
        stroke="currentColor"
        stroke-linecap="round"
        stroke-linejoin="round"
        stroke-width="1.5"
        ><path stroke="none" d="M0 0h24v24H0z"></path><path
          d="M4 7h16m-10 4v6m4-6v6M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2l1-12M9 7V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v3"
        ></path></g
      ></symbol
    ><use
      xlink:href="#ai:local:trash"
      data-astro-source-file="/path/to/project/node_modules/.pnpm/[email protected]/node_modules/astro-icon/components/Icon.astro"
      data-astro-source-loc="125:10"></use>
  </svg>
</astro-slot>

28 replies

SSolidJS

•Created by RATIU5 on 10/12/2024 in #support

Solid.js does not render children in a `<For>` loop correctly

I feel like this is a common problem. Maybe not. I'm still digging through docs to see if there is anything said about this.

28 replies

SSolidJS

•Created by RATIU5 on 10/12/2024 in #support

Solid.js does not render children in a `<For>` loop correctly

Darn, I get TypeError: props.trashIcon.cloneNode is not a function.

28 replies

SSolidJS

•Created by RATIU5 on 10/12/2024 in #support

Solid.js does not render children in a `<For>` loop correctly

Thanks for the suggestion. I'll give that a try now.

28 replies

SSolidJS

•Created by RATIU5 on 10/12/2024 in #support

Solid.js does not render children in a `<For>` loop correctly

Oh really? Hmm. May have to see if this might be a bug in the Astro community. Or if there is a certain way to accomplish this in Solid that's more "standard" when dealing with this problem.

28 replies

SSolidJS

•Created by RATIU5 on 10/12/2024 in #support

Solid.js does not render children in a `<For>` loop correctly

Are you saying to make the prop passed into this component a function? So the new props type would look like this?

type CartProps = {
  cartIcon: JSX.Element;
  trashIcon: () => JSX.Element;
};

type CartProps = {
  cartIcon: JSX.Element;
  trashIcon: () => JSX.Element;
};

I haven't found a successful way to do that, as Astro is handling the prop injection. I just get a JSX-like element from the props object.

28 replies

SSolidJS

•Created by RATIU5 on 10/12/2024 in #support

Solid.js does not render children in a `<For>` loop correctly

Tried this: const renderTrashIcon = () => props.trashIcon;, still results in one (the last) icon being rendered in the list.

28 replies

SSolidJS

•Created by RATIU5 on 10/12/2024 in #support

Solid.js does not render children in a `<For>` loop correctly

For extra information, I am using this as a framework component from within Astro, and trashIcon is coming as a named slot from Astro. I don't think this has anything to do with this problem, but it could.

28 replies

HHono

•Created by RATIU5 on 9/5/2024 in #help

Creating custom webhooks

I'll look into that, thank you!

5 replies

SSolidJS

•Created by RATIU5 on 3/25/2023 in #support

How can I skip the first effect run with createEffect?

It works now, thank you!

5 replies

Gaming

Programming