question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

`preact-cli` isn't able to SSR if the app uses `@preact/signals`

See original GitHub issue

Just started to use signals in an app I created using preact-cli, but now the SSR breaks with the following error:

❯ npm run build

> my-project@0.0.0 build
> preact build

 Build  [==================  ] 92% (4.8s) chunk asset optimizationUnable to read file: /Users/rakesh.pai/code/my-project/src/src/index.ts

TypeError: Cannot read properties of null (reading '_u')
Cannot determine error position. This most likely means it originated in node_modules.

This could be caused by using DOM or Web APIs.
Pre-render runs in node and has no access to globals available in browsers.

Consider wrapping code producing error in: "if (typeof window !== "undefined") { ... }"

Alternatively use "preact build --no-prerender" to disable prerendering.

See https://github.com/preactjs/preact-cli#pre-rendering for further information.

This error message itself isn’t very useful (and I don’t know why there’s an additional /src in the file path), but this error doesn’t occur and the build runs successfully if I remove signals.

The usage of signals is very minimal:

import { computed, signal } from '@preact/signals';

const currentState = signal('idle');

const isFormEnabled = computed(() => currentState.value !== 'loading');

const SomeComponent = () => (
  <form>
    <input type="text" disabled={!isFormEnabled.value} />
  </form>
)

Am I doing something wrong?

Issue Analytics

  • State:closed
  • Created a year ago
  • Reactions:1
  • Comments:7 (3 by maintainers)

github_iconTop GitHub Comments

2reactions
marvinhagemeistercommented, Sep 22, 2022

Fixed by #198

1reaction
rschristiancommented, Sep 18, 2022

This error message itself isn’t very useful (and I don’t know why there’s an additional /src in the file path)

Sorry about that. Getting useful stack traces out of content built with Webpack has always been rather difficult, though I do spot a couple obvious issues and will try to spend some time on that.

The actual error position is in ../src/index.ts. Our error message incorrectly assumes it’s in your source code, and so prepends /Users/rakesh.pai/code/my-project/src/, hence the double src.

Not sure what the actual issue is, just speaking to the error message itself at the moment.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Server-Side Rendering - Preact
Server-Side Rendering (often abbreviated as "SSR") allows you to render your application to an HTML string that can be sent to the client...
Read more >
SERVE SSR BUILD · Issue #940 · preactjs/preact-cli - GitHub
We build the project, as normal: preact build; We create a new server.js file which loads the built SSR bundle from step 1:...
Read more >
Preact - What Is It & When to Use It? | Codete Blog
Learn what is Preact, how it's different from the top JavaScript framework React, when to use it – and last but not least...
Read more >
I'd advocate most people avoid this if their intention is to write an app ...
As an example, you can use native css variables during development and compile em away for production. ... [1] https://github.com/developit/preact-cli.
Read more >
Newest 'preact-router' Questions - Stack Overflow
The preact-router tag has no usage guidance. ... If you go to my Preact app on https://startupguide.vercel.app/ and click “Name Generator”, ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found