rabbit_rabbit
rabbit_rabbit15mo ago

Provide own default error page in Fresh

Hello! I'm seeing the following error
pragma cannot be set when runtime is automatic at https://deno.land/x/fresh@1.0.1/src/server/default_error_page.tsx:1:1
pragma cannot be set when runtime is automatic at https://deno.land/x/fresh@1.0.1/src/server/default_error_page.tsx:1:1
Can I provide my own default error page instead of this one to sidestep this error? I tried making such a page at routes/default_error_page.tsx, but that didn't work Something that could be related, but that I'm confused about is that this refers to fresh@1.0.1 when my import_map.json specifies fresh@1.1.4
{
"imports": {
"$fresh/": "https://deno.land/x/fresh@1.1.4/",
"kysely": "https://esm.sh/kysely@0.24.2",
"kysely-deno-postgres": "https://deno.land/x/kysely_deno_postgres@v0.4.0/mod.ts",
"preact": "https://esm.sh/preact@10.11.0",
"preact/": "https://esm.sh/preact@10.11.0/",
"preact-render-to-string": "https://esm.sh/preact-render-to-string@5.2.4",
"@preact/signals": "https://esm.sh/*@preact/signals@1.0.3",
"@preact/signals-core": "https://esm.sh/*@preact/signals-core@1.0.1",
"fresh_session": "https://deno.land/x/fresh_session@0.2.0/mod.ts",
"redis": "https://deno.land/x/redis@v0.29.2/mod.ts"
}
}
{
"imports": {
"$fresh/": "https://deno.land/x/fresh@1.1.4/",
"kysely": "https://esm.sh/kysely@0.24.2",
"kysely-deno-postgres": "https://deno.land/x/kysely_deno_postgres@v0.4.0/mod.ts",
"preact": "https://esm.sh/preact@10.11.0",
"preact/": "https://esm.sh/preact@10.11.0/",
"preact-render-to-string": "https://esm.sh/preact-render-to-string@5.2.4",
"@preact/signals": "https://esm.sh/*@preact/signals@1.0.3",
"@preact/signals-core": "https://esm.sh/*@preact/signals-core@1.0.1",
"fresh_session": "https://deno.land/x/fresh_session@0.2.0/mod.ts",
"redis": "https://deno.land/x/redis@v0.29.2/mod.ts"
}
}
Any ideas? Thanks in advance!
39 Replies
javi
javi15mo ago
The error means that in deno.jsonc you have set jsx runtime to automatic, but you also have set a pragma on the file. This was the way to do it on the early versions of fresh. Remove the following lines and you’ll be good to go.
/** @jsx h */
import { h } from "preact";
// rest of the code…
/** @jsx h */
import { h } from "preact";
// rest of the code…
Edit: You’re also probably looking for this https://fresh.deno.dev/docs/concepts/error-pages
rabbit_rabbit
rabbit_rabbit15mo ago
Perfect, this is exactly what I was looking for. Thanks @jaboolo !
javi
javi15mo ago
you're welcome! <:cookie_deno:1002977285734932480>
rabbit_rabbit
rabbit_rabbit15mo ago
I'm trying to implement that, but I'm still confused — I added a page routes/_404.tsx that looks like this
import { UnknownPageProps } from "$fresh/server.ts";

export default function NotFoundPage({ url }: UnknownPageProps) {
return <p>404 not found: {url.pathname}</p>;
}
import { UnknownPageProps } from "$fresh/server.ts";

export default function NotFoundPage({ url }: UnknownPageProps) {
return <p>404 not found: {url.pathname}</p>;
}
Yet I'm still seeing that when pushing to heroku something appears to be implicitly requiring the default_error_page.tsx:1:1 Note that the fresh versions aren't aligned. Do you know what might be going on @jaboolo ?
git push heroku main
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Building on the Heroku-22 stack
remote: -----> Using buildpack: https://github.com/chibat/heroku-buildpack-deno
remote: -----> https://github.com/chibat/heroku-buildpack-deno app detected

...

remote: Stuck? Join our Discord https://discord.gg/deno
remote: Download https://deno.land/x/fresh@1.1.4/server.ts
remote: Download https://deno.land/x/fresh@1.1.4/src/server/mod.ts

...

remote: Download https://deno.land/std@0.177.0/node/_crypto/crypto_browserify/asn1.js/decoders/pem.js
remote: Download https://deno.land/std@0.177.0/node/_crypto/crypto_browserify/asn1.js/constants/der.js
remote: error: pragma cannot be set when runtime is automatic at https://deno.land/x/fresh@1.0.1/src/server/default_error_page.tsx:1:1
git push heroku main
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Building on the Heroku-22 stack
remote: -----> Using buildpack: https://github.com/chibat/heroku-buildpack-deno
remote: -----> https://github.com/chibat/heroku-buildpack-deno app detected

...

remote: Stuck? Join our Discord https://discord.gg/deno
remote: Download https://deno.land/x/fresh@1.1.4/server.ts
remote: Download https://deno.land/x/fresh@1.1.4/src/server/mod.ts

...

remote: Download https://deno.land/std@0.177.0/node/_crypto/crypto_browserify/asn1.js/decoders/pem.js
remote: Download https://deno.land/std@0.177.0/node/_crypto/crypto_browserify/asn1.js/constants/der.js
remote: error: pragma cannot be set when runtime is automatic at https://deno.land/x/fresh@1.0.1/src/server/default_error_page.tsx:1:1
javi
javi15mo ago
Is your repo public? If not, can you send me your import_map.json and deno.jsonc files?
rabbit_rabbit
rabbit_rabbit15mo ago
It's private, here you are!
{
"imports": {
"$fresh/": "https://deno.land/x/fresh@1.1.4/",
"kysely": "https://esm.sh/kysely@0.24.2",
"kysely-deno-postgres": "https://deno.land/x/kysely_deno_postgres@v0.4.0/mod.ts",
"preact": "https://esm.sh/preact@10.11.0",
"preact/": "https://esm.sh/preact@10.11.0/",
"preact-render-to-string": "https://esm.sh/preact-render-to-string@5.2.4",
"@preact/signals": "https://esm.sh/*@preact/signals@1.0.3",
"@preact/signals-core": "https://esm.sh/*@preact/signals-core@1.0.1",
"fresh_session": "https://deno.land/x/fresh_session@0.2.0/mod.ts",
"redis": "https://deno.land/x/redis@v0.29.2/mod.ts"
}
}
{
"imports": {
"$fresh/": "https://deno.land/x/fresh@1.1.4/",
"kysely": "https://esm.sh/kysely@0.24.2",
"kysely-deno-postgres": "https://deno.land/x/kysely_deno_postgres@v0.4.0/mod.ts",
"preact": "https://esm.sh/preact@10.11.0",
"preact/": "https://esm.sh/preact@10.11.0/",
"preact-render-to-string": "https://esm.sh/preact-render-to-string@5.2.4",
"@preact/signals": "https://esm.sh/*@preact/signals@1.0.3",
"@preact/signals-core": "https://esm.sh/*@preact/signals-core@1.0.1",
"fresh_session": "https://deno.land/x/fresh_session@0.2.0/mod.ts",
"redis": "https://deno.land/x/redis@v0.29.2/mod.ts"
}
}
I don't have a deno.jsonc, here's my deno.json
{
"tasks": {
"start": "DENO_TLS_CA_STORE=system deno run -A --unsafely-ignore-certificate-errors --watch=static/,routes/ dev.ts"
},
"importMap": "./import_map.json",
"compilerOptions": {
"jsx": "react-jsx",
"jsxImportSource": "preact"
},
"lock": false
}
{
"tasks": {
"start": "DENO_TLS_CA_STORE=system deno run -A --unsafely-ignore-certificate-errors --watch=static/,routes/ dev.ts"
},
"importMap": "./import_map.json",
"compilerOptions": {
"jsx": "react-jsx",
"jsxImportSource": "preact"
},
"lock": false
}
javi
javi15mo ago
Are you sure you have deleted all pragmas? These are comments at the top of the files, such as
/** @jsx h */
/** @jsx h */
rabbit_rabbit
rabbit_rabbit15mo ago
In my own source files yes, although something implicitly seems to be importing this file: https://deno.land/x/fresh@1.0.1/src/server/default_error_page.tsx?source=#L1
rabbit_rabbit
rabbit_rabbit15mo ago
There you can see the pragma at the top
javi
javi15mo ago
Yup, that's the second weird stuff, normally fresh v1.0.1 shouldnt get imported
rabbit_rabbit
rabbit_rabbit15mo ago
Yeah, I'm confused by that Is there a way to trace what packages are importing what?
javi
javi15mo ago
I'm going to check one thing, I can kinda imagine what's causing it
rabbit_rabbit
rabbit_rabbit15mo ago
perfect, I appreciate you!
javi
javi15mo ago
Does it work locally? Like, is the problem happening when you push and it builds
rabbit_rabbit
rabbit_rabbit15mo ago
it works locally, the problem appears to be on push & install
javi
javi15mo ago
Alright I've just checked https://github.com/chibat/heroku-buildpack-deno, do you have the runtime.txt file set to 1.32.4(latest) or similar?
rabbit_rabbit
rabbit_rabbit15mo ago
oh!? I don't have one yet. Let me add one trying that now... Okay, when I set 1.32.4 that didn't work, but v1.32.4 got further, so it's clearly recognizing the runtime.txt file. That said, I'm seeing the same error
Compressing objects: 100% (12/12), done.
Writing objects: 100% (13/13), 2.68 KiB | 2.68 MiB/s, done.
Total 13 (delta 6), reused 0 (delta 0), pack-reused 0
remote: Updated 51 paths from 65beea9
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Building on the Heroku-22 stack
remote: -----> Using buildpack: https://github.com/chibat/heroku-buildpack-deno
remote: -----> https://github.com/chibat/heroku-buildpack-deno app detected
remote: -s v1.32.4
remote: ######################################################################## 100.0%
remote: Archive: /tmp/build_6806f633/.heroku/bin/deno.zip
remote: inflating: /tmp/build_6806f633/.heroku/bin/deno
remote: Deno was installed successfully to /tmp/build_6806f633/.heroku/bin/deno
remote: Manually add the directory to your $HOME/.bashrc (or similar)
remote: export DENO_INSTALL="/tmp/build_6806f633/.heroku"
remote: export PATH="$DENO_INSTALL/bin:$PATH"
remote: Run '/tmp/build_6806f633/.heroku/bin/deno --help' to get started
remote:
remote: Stuck? Join our Discord https://discord.gg/deno
remote: Download https://deno.land/x/fresh@1.1.4/server.ts
remote: Download https://deno.land/x/fresh@1.1.4/src/server/mod.ts

...

remote: error: pragma cannot be set when runtime is automatic at https://deno.land/x/fresh@1.0.1/src/server/default_error_page.tsx:1:1
Compressing objects: 100% (12/12), done.
Writing objects: 100% (13/13), 2.68 KiB | 2.68 MiB/s, done.
Total 13 (delta 6), reused 0 (delta 0), pack-reused 0
remote: Updated 51 paths from 65beea9
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Building on the Heroku-22 stack
remote: -----> Using buildpack: https://github.com/chibat/heroku-buildpack-deno
remote: -----> https://github.com/chibat/heroku-buildpack-deno app detected
remote: -s v1.32.4
remote: ######################################################################## 100.0%
remote: Archive: /tmp/build_6806f633/.heroku/bin/deno.zip
remote: inflating: /tmp/build_6806f633/.heroku/bin/deno
remote: Deno was installed successfully to /tmp/build_6806f633/.heroku/bin/deno
remote: Manually add the directory to your $HOME/.bashrc (or similar)
remote: export DENO_INSTALL="/tmp/build_6806f633/.heroku"
remote: export PATH="$DENO_INSTALL/bin:$PATH"
remote: Run '/tmp/build_6806f633/.heroku/bin/deno --help' to get started
remote:
remote: Stuck? Join our Discord https://discord.gg/deno
remote: Download https://deno.land/x/fresh@1.1.4/server.ts
remote: Download https://deno.land/x/fresh@1.1.4/src/server/mod.ts

...

remote: error: pragma cannot be set when runtime is automatic at https://deno.land/x/fresh@1.0.1/src/server/default_error_page.tsx:1:1
javi
javi15mo ago
Alright, I see. Just a quick question, have you tried deno deploy?
rabbit_rabbit
rabbit_rabbit15mo ago
I haven't yet — I have an existing set of configs (redis, postgres) in Heroku and so I'm seeing about porting the project there for now
javi
javi15mo ago
Understood. I recommend trying deploy, it doesn't depend on 3rd packages to bundle stuff, so it just works, and really good if you ask me other than that I cant think of anything else for your issue
rabbit_rabbit
rabbit_rabbit15mo ago
Appreciate the advice. Going back to a prior question — is there a way to trace the dependency tree to see what might be importing fresh@1.0.1 ?
javi
javi15mo ago
The issue is happening on the build step for heroku. One thing you can do, if theres a way to hook a script is to run deno vendor, and grep fresh@1.0.1 to see whats importing it Nonetheless this is really hacky
rabbit_rabbit
rabbit_rabbit15mo ago
Thanks for this — perhaps if I also include a lock file that might help
javi
javi15mo ago
indeed, that's a good one let me know if using a lock works
rabbit_rabbit
rabbit_rabbit15mo ago
I was previously seeing issues with that, but perhaps now with the deno version set to be my local version that might have been the cause of issues I'll try that
remote: Download https://deno.land/std@0.177.0/node/_crypto/crypto_browserify/asn1.js/decoders/der.js
remote: Download https://deno.land/std@0.177.0/node/_crypto/crypto_browserify/asn1.js/decoders/pem.js
remote: Download https://deno.land/std@0.177.0/node/_crypto/crypto_browserify/asn1.js/constants/der.js
remote: error: The source code is invalid, as it does not match the expected hash in the lock file.
remote: Download https://deno.land/std@0.177.0/node/_crypto/crypto_browserify/asn1.js/decoders/der.js
remote: Download https://deno.land/std@0.177.0/node/_crypto/crypto_browserify/asn1.js/decoders/pem.js
remote: Download https://deno.land/std@0.177.0/node/_crypto/crypto_browserify/asn1.js/constants/der.js
remote: error: The source code is invalid, as it does not match the expected hash in the lock file.
javi
javi15mo ago
That's super weird at this point let me check what that gh module's doing
rabbit_rabbit
rabbit_rabbit15mo ago
I appreciate your checking
javi
javi15mo ago
Have you tried using the module locally? https://github.com/chibat/heroku-deno-getting-started#running-locally If it doesnt work, then its that module messing up with the imports nvm thats not what I thought it did
rabbit_rabbit
rabbit_rabbit15mo ago
Ah yeah, that just seems to try the sample project not actually run the build locally
javi
javi15mo ago
Yeah Imma just deploy a project i have and debug hahah
rabbit_rabbit
rabbit_rabbit15mo ago
hahaha, nice one! Definitely let me know if you want to pair on that or want any other notes/assistance from me. I also have view-related stuff I can work on, just to say I'm sure you have other responsibilities and so just know I'm not blocked immediately by this. For what it's worth — I'm able to reproduce the issue locally without having anything to do with Heroku like so
$ deno cache --reload main.ts
error: pragma cannot be set when runtime is automatic at https://deno.land/x/fresh@1.0.1/src/server/default_error_page.tsx:1:1
$ deno cache --reload main.ts
error: pragma cannot be set when runtime is automatic at https://deno.land/x/fresh@1.0.1/src/server/default_error_page.tsx:1:1
javi
javi15mo ago
Okay so then it’s not heroku related, that’s great. Is the fresh project newly created? If not give this a shot: https://fresh.deno.dev/docs/concepts/updating
Updating Fresh | fresh docs
Fresh regularly releases new versions of the framework. This page explains how to update your project.
rabbit_rabbit
rabbit_rabbit15mo ago
Thanks for passing this along @jaboolo . I tried using that step to update the packages, but unfortunately am still seeing the exact same error (few packages were changed and only minor version #'s as the project is quite new)
rabbit_rabbit
rabbit_rabbit15mo ago
Okay, the problem is definitely with fresh-session as you can see the import statements here: https://github.com/xstevenyung/fresh-session/blob/main/src/deps.ts
GitHub
fresh-session/deps.ts at main · xstevenyung/fresh-session
Dead simple cookie-based session for Deno Fresh. Contribute to xstevenyung/fresh-session development by creating an account on GitHub.
javi
javi15mo ago
No worries, I was puzzled too but in the end it makes sense, an old package. You should choose another module <:cookie_deno:1002977285734932480>
rabbit_rabbit
rabbit_rabbit15mo ago
For sure, thanks for all your help along the way. Is there a better package for session management in fresh? I was looking around the docs and nothing seemed obvious. In the meanwhile I'm just pointing to a forked version of that repo with dependencies updated
javi
javi15mo ago
I cant think of it, but the package seems to pass the state in the context and access that from all routes, shouldnt be that hard to implement
rabbit_rabbit
rabbit_rabbit15mo ago
Makes sense — thanks again!
javi
javi15mo ago
Youre welcome! Good luck