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.
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 π