Launching the example with a today updated deno installation (deno 1.0.2, v8 8.4.300, typescript 3.9.2) fails with following errors:
deno run --allow-net--allow-read--reload"https://raw.githubusercontent.com/asos-craigmorten/deno-react-base-server/master/example/entrypoint.tsx">> error.txt
Download https://raw.githubusercontent.com/asos-craigmorten/deno-react-base-server/master/example/entrypoint.tsx
Compile https://raw.githubusercontent.com/asos-craigmorten/deno-react-base-server/master/example/entrypoint.tsx
Download https://raw.githubusercontent.com/asos-craigmorten/deno-react-base-server/master/mod.tsx
Compile https://raw.githubusercontent.com/asos-craigmorten/deno-react-base-server/master/mod.tsx
error: TS2307 [ERROR]: Cannot find module 'https://dev.jspm.io/react@16.13.1' or its corresponding type declarations.
import React from "https://dev.jspm.io/react@16.13.1";
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
at https://raw.githubusercontent.com/asos-craigmorten/deno-react-base-server/master/mod.tsx:1:19
TS2307 [ERROR]: Cannot find module 'https://dev.jspm.io/react-dom@16.13.1/server' or its corresponding type declarations.
import ReactDOMServer from "https://dev.jspm.io/react-dom@16.13.1/server";
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
at https://raw.githubusercontent.com/asos-craigmorten/deno-react-base-server/master/mod.tsx:2:28
TS7006 [ERROR]: Parameter '_req' implicitly has an 'any' type.
app.use(browserBundlePath, (_req, res, _next)=>{
~~~~
at https://raw.githubusercontent.com/asos-craigmorten/deno-react-base-server/master/mod.tsx:27:31
TS7006 [ERROR]: Parameter 'res' implicitly has an 'any' type.
app.use(browserBundlePath, (_req, res, _next)=>{
~~~
at https://raw.githubusercontent.com/asos-craigmorten/deno-react-base-server/master/mod.tsx:27:37
TS7006 [ERROR]: Parameter '_next' implicitly has an 'any' type.
app.use(browserBundlePath, (_req, res, _next)=>{
~~~~~
at https://raw.githubusercontent.com/asos-craigmorten/deno-react-base-server/master/mod.tsx:27:42
TS7006 [ERROR]: Parameter '_req' implicitly has an 'any' type.
app.use("/", (_req, res, _next)=>{
~~~~
at https://raw.githubusercontent.com/asos-craigmorten/deno-react-base-server/master/mod.tsx:31:17
TS7006 [ERROR]: Parameter 'res' implicitly has an 'any' type.
app.use("/", (_req, res, _next)=>{
~~~
at https://raw.githubusercontent.com/asos-craigmorten/deno-react-base-server/master/mod.tsx:31:23
TS7006 [ERROR]: Parameter '_next' implicitly has an 'any' type.
app.use("/", (_req, res, _next)=>{
~~~~~
at https://raw.githubusercontent.com/asos-craigmorten/deno-react-base-server/master/mod.tsx:31:28
Found 8 errors.
I'm unfortunatelly not an expert in deno. Do you have already an idea to solve these problems?
Really sorry about that! I may have missed something when copying snippets from IDE to blog post! Alternatively it may be the Deno version - I tested this with Deno 1.0.0, and I know the newer versions broke some dependencies with type errors (namely the EVT Deno library had issues with v1.0.1 at one point!) - I’ll take a look when I can next, make fixes, and get back to you as soon as possible :)
In the meantime, you can try and see if it’s a Deno version by downgrading Deno to v1.0.0 - there instructions on how to install specific versions here: github.com/denoland/deno_install#i... (I’ll test myself as well!)
deno run --allow-net--allow-read--reload"https://raw.githubusercontent.com/asos-craigmorten/deno-react-base-server/master/example/entrypoint.tsx"
Appears to be broken for versions >= 1.0.1, so there must have been an accidental breaking change in Deno?
For now, the code should work fine on v1.0.0 (just tested) and I'll look to get it updated to be compatible with these latest versions of Deno :)
Further to my last comment, the easiest way to change to a specific version of Deno is to use the upgrade command:
deno upgrade --version 1.0.0
Edit:
I have found the relevant issues, and they should hopefully be resolved by the Deno team in the next Deno release. In the meantime I have updated the article to provide guidance on how to set Deno version to 1.0.0, added links to the issues and will look to update the code samples to support v1.0.1 and v1.0.2.
Edit 2:
Code and article updated to support Deno v1.0.2 🦕 🥳. Unfortunately Deno v1.0.1 support won't be possible due to a bug in the Deno core.
Oh no! 😢I’ll take another look - the underlying problem (as far as I know) is a bug in Deno which will be released in 1.0.3, check out github.com/denoland/deno/issues/5772
For now I believe v1.0.0 should be fine, so can downgrade in the meantime to get started.
Another open issue is that the unstable Import Map feature of Deno doesn’t play nicely with React atm - see github.com/denoland/deno/issues/5815
Off the top of my head, one thing to try is to use the Deno Types hint:
c. Cleared my Deno cache in case I had managed to get the module previously and cache it:
deno info
And then deleting everything inside the directories listed for Remote modules cache and TypeScript compiler cache.
d. Created an app.tsx and server.tsx as per this article.
e. Ran the following command:
deno run --allow-net ./server.tsx
And voila, errors:
Compile ~/server.tsx
error: TS2307 [ERROR]: Cannot find module 'https://dev.jspm.io/react@16.13.1' or its corresponding type declarations.
import React from "https://dev.jspm.io/react@16.13.1"; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
at ~/server.tsx:1:19
TS2307 [ERROR]: Cannot find module 'https://dev.jspm.io/react-dom@16.13.1/server' or its corresponding type declarations.
import ReactDOMServer from "https://dev.jspm.io/react-dom@16.13.1/server"; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
at ~/server.tsx:2:28
Found 2 errors.
In this instance, adding the @deno-types directive (though a good thing to do to get the React types) does nothing to solve the issue because Deno has the current bug that it's typescript compiler ignores all .tsx and .jsx files (see github.com/denoland/deno/pull/5785) and they are exactly the extensions we've been using!
Unfortunately neither Deno nor Typescript have a particularly great solution to this problem 😞 but there are 2 workarounds that you can use for now until v1.0.3 is released (if can find more then please comment!):
a. Use // @ts-ignore comments above each top-level React import statement. For example
Though I prefer option 2 (which I will use to update this blog post):
b. Create a dep.ts (note the .ts extension will mean that Deno v1.0.2 will compile it despite the bug). We will then import all of our dependencies into this file, and re-export them for use in our app.tsx and server.tsx:
// app.tsximport{React}from"./dep.ts";// Rest of the app code stays the same
// server.tsximport{opine,React,ReactDOMServer,Request,Response,NextFunction,}from"./dep.ts";// Rest of the server code stays the same
You can then run deno run --allow-net --reload ./server.tsx and it should start the application 🥳 🎉
Let me know how you get on!
Edit: Blog post all updated! Thanks so much for providing the feedback - articles become so much more useful to everyone through comments and pointing out bugs! I've certainly learned things 😄
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Hi Craig, thanks for the nice tutorial!
Launching the example with a today updated deno installation (deno 1.0.2, v8 8.4.300, typescript 3.9.2) fails with following errors:
I'm unfortunatelly not an expert in deno. Do you have already an idea to solve these problems?
Really sorry about that! I may have missed something when copying snippets from IDE to blog post! Alternatively it may be the Deno version - I tested this with Deno 1.0.0, and I know the newer versions broke some dependencies with type errors (namely the EVT Deno library had issues with v1.0.1 at one point!) - I’ll take a look when I can next, make fixes, and get back to you as soon as possible :)
In the meantime, you can try and see if it’s a Deno version by downgrading Deno to v1.0.0 - there instructions on how to install specific versions here: github.com/denoland/deno_install#i... (I’ll test myself as well!)
I can confirm this code, including:
Appears to be broken for versions >= 1.0.1, so there must have been an accidental breaking change in Deno?
For now, the code should work fine on v1.0.0 (just tested) and I'll look to get it updated to be compatible with these latest versions of Deno :)
Further to my last comment, the easiest way to change to a specific version of Deno is to use the
upgrade
command:Edit:
I have found the relevant issues, and they should hopefully be resolved by the Deno team in the next Deno release. In the meantime I have updated the article to provide guidance on how to set Deno version to 1.0.0, added links to the issues and will look to update the code samples to support v1.0.1 and v1.0.2.
Edit 2:
Code and article updated to support Deno v1.0.2 🦕 🥳. Unfortunately Deno v1.0.1 support won't be possible due to a bug in the Deno core.
Upgrade to Deno v1.0.2 using the
upgrade
command:Thanks a lot!
With deno 1.0.2 I do still get
Cannot find module 'https://dev.jspm.io/react@16.13.1' or its corresponding type declarations
Oh no! 😢I’ll take another look - the underlying problem (as far as I know) is a bug in Deno which will be released in 1.0.3, check out github.com/denoland/deno/issues/5772
For now I believe v1.0.0 should be fine, so can downgrade in the meantime to get started.
Another open issue is that the unstable Import Map feature of Deno doesn’t play nicely with React atm - see github.com/denoland/deno/issues/5815
Off the top of my head, one thing to try is to use the Deno Types hint:
Will test again myself and get back to you!
Ok, I am able to reproduce! Here are the steps that I took:
a. Ran the Deno
upgrade
command to change to v1.0.2:b. Checked that I was definitely testing on Deno v1.0.2
c. Cleared my Deno cache in case I had managed to get the module previously and cache it:
And then deleting everything inside the directories listed for
Remote modules cache
andTypeScript compiler cache
.d. Created an
app.tsx
andserver.tsx
as per this article.e. Ran the following command:
And voila, errors:
In this instance, adding the
@deno-types
directive (though a good thing to do to get the React types) does nothing to solve the issue because Deno has the current bug that it's typescript compiler ignores all.tsx
and.jsx
files (see github.com/denoland/deno/pull/5785) and they are exactly the extensions we've been using!Unfortunately neither Deno nor Typescript have a particularly great solution to this problem 😞 but there are 2 workarounds that you can use for now until v1.0.3 is released (if can find more then please comment!):
a. Use
// @ts-ignore
comments above each top-level React import statement. For exampleThough I prefer option 2 (which I will use to update this blog post):
b. Create a
dep.ts
(note the.ts
extension will mean that Deno v1.0.2 will compile it despite the bug). We will then import all of our dependencies into this file, and re-export them for use in ourapp.tsx
andserver.tsx
:You can then run
deno run --allow-net --reload ./server.tsx
and it should start the application 🥳 🎉Let me know how you get on!
Edit: Blog post all updated! Thanks so much for providing the feedback - articles become so much more useful to everyone through comments and pointing out bugs! I've certainly learned things 😄