Deno Example Error
reggi opened this issue · comments
Hey are the docs missing a build step for deno?
LiveViewJS Express is listening on port 9001!
GET http://localhost:9001/ - 2022-10-09T05:08:00.606Z
GET http://localhost:9001/favicon.ico - 2022-10-09T05:08:01.161Z
GET http://localhost:9001/counter - 2022-10-09T05:08:09.683Z
GET http://localhost:9001/js/index.js - 2022-10-09T05:08:09.703Z
[uncaught application error]: NotFoundError - No such file or directory (os error 2), stat 'public/js/index.js'
request: { url: "http://localhost:9001/js/index.js", method: "GET", hasBody: false }
response: { status: 404, type: undefined, hasBody: false, writable: true }
at createHttpError (https://deno.land/x/oak@v10.5.1/httpError.ts:128:10)
at send (https://deno.land/x/oak@v10.5.1/send.ts:279:13)
at async file:///Users/thomasreggi/Documents/GitHub/liveviewjs/packages/deno/src/example/index.ts:82:3
at async dispatch (https://deno.land/x/oak@v10.5.1/middleware.ts:41:7)
at async dispatch (https://deno.land/x/oak@v10.5.1/middleware.ts:41:7)
at async dispatch (https://deno.land/x/oak@v10.5.1/middleware.ts:41:7)
at async file:///Users/thomasreggi/Documents/GitHub/liveviewjs/packages/deno/src/deno/server.ts:117:11
at async dispatch (https://deno.land/x/oak@v10.5.1/middleware.ts:41:7)
at async file:///Users/thomasreggi/Documents/GitHub/liveviewjs/packages/deno/src/example/index.ts:58:3
at async dispatch (https://deno.land/x/oak@v10.5.1/middleware.ts:41:7)
nothing happens when I click the counter buttons
Hey thanks for submitting the issue! The bug is in the documentation (which I will fix). Try running:
deno run --allow-run --allow-read --allow-env src/example/autorun.ts
This command runs the server and uses ESBuild to build (continuously) the client code.
LMK if this works for you. Sorry about that.
Hey just tried this new command, other issues arrose:
deno run --allow-run --allow-read --allow-env --allow-net src/example/autorun.ts
Watcher Process started.
✘ [ERROR] Could not resolve "nprogress"
src/client/index.ts:2:22:
2 │ import NProgress from "nprogress";
╵ ~~~~~~~~~~~
You can mark the path "nprogress" as external to exclude it from the bundle, which will remove
this error.
✘ [ERROR] Could not resolve "phoenix"
src/client/index.ts:3:23:
3 │ import { Socket } from "phoenix";
╵ ~~~~~~~~~
You can mark the path "phoenix" as external to exclude it from the bundle, which will remove this
error.
✘ [ERROR] Could not resolve "phoenix_html"
src/client/index.ts:4:7:
4 │ import "phoenix_html";
╵ ~~~~~~~~~~~~~~
You can mark the path "phoenix_html" as external to exclude it from the bundle, which will remove
this error.
✘ [ERROR] Could not resolve "phoenix_live_view"
src/client/index.ts:5:37:
5 │ import { LiveSocket, ViewHook } from "phoenix_live_view";
╵ ~~~~~~~~~~~~~~~~~~~
You can mark the path "phoenix_live_view" as external to exclude it from the bundle, which will
remove this error.
error: Uncaught (in promise) Error: Build failed with 4 errors:
src/client/index.ts:2:22: ERROR: Could not resolve "nprogress"
src/client/index.ts:3:23: ERROR: Could not resolve "phoenix"
src/client/index.ts:4:7: ERROR: Could not resolve "phoenix_html"
src/client/index.ts:5:37: ERROR: Could not resolve "phoenix_live_view"
{
detail: undefined,
id: "",
location: {
column: 22,
file: "src/client/index.ts",
length: 11,
line: 2,
lineText: 'import NProgress from "nprogress";',
namespace: "",
suggestion: ""
},
notes: [
{
location: null,
text: 'You can mark the path "nprogress" as external to exclude it from the bundle, which will remove this ...'
}
],
pluginName: "",
text: 'Could not resolve "nprogress"'
}
{
detail: undefined,
id: "",
location: {
column: 23,
file: "src/client/index.ts",
length: 9,
line: 3,
lineText: 'import { Socket } from "phoenix";',
namespace: "",
suggestion: ""
},
notes: [
{
location: null,
text: 'You can mark the path "phoenix" as external to exclude it from the bundle, which will remove this er...'
}
],
pluginName: "",
text: 'Could not resolve "phoenix"'
}
{
detail: undefined,
id: "",
location: {
column: 7,
file: "src/client/index.ts",
length: 14,
line: 4,
lineText: 'import "phoenix_html";',
namespace: "",
suggestion: ""
},
notes: [
{
location: null,
text: 'You can mark the path "phoenix_html" as external to exclude it from the bundle, which will remove th...'
}
],
pluginName: "",
text: 'Could not resolve "phoenix_html"'
}
{
detail: undefined,
id: "",
location: {
column: 37,
file: "src/client/index.ts",
length: 19,
line: 5,
lineText: 'import { LiveSocket, ViewHook } from "phoenix_live_view";',
namespace: "",
suggestion: ""
},
notes: [
{
location: null,
text: 'You can mark the path "phoenix_live_view" as external to exclude it from the bundle, which will remo...'
}
],
pluginName: "",
text: 'Could not resolve "phoenix_live_view"'
}
let error = new Error(`${text}${summary}`);
^
at failureErrorWithLog (https://deno.land/x/esbuild@v0.15.9/mod.js:1546:15)
at https://deno.land/x/esbuild@v0.15.9/mod.js:1004:28
at https://deno.land/x/esbuild@v0.15.9/mod.js:949:67
at buildResponseToResult (https://deno.land/x/esbuild@v0.15.9/mod.js:1002:7)
at https://deno.land/x/esbuild@v0.15.9/mod.js:1114:14
at responseCallbacks.<computed> (https://deno.land/x/esbuild@v0.15.9/mod.js:651:9)
at handleIncomingPacket (https://deno.land/x/esbuild@v0.15.9/mod.js:706:9)
at readFromStdout (https://deno.land/x/esbuild@v0.15.9/mod.js:627:7)
at https://deno.land/x/esbuild@v0.15.9/mod.js:1828:11
needed to run npm install
in the deno folder, maybe switch to npm:
prefix?
I'll add the fact that you need to run npm install
before running the deno examples. Thanks!
running deno run --allow-run --allow-read --allow-env src/example/autorun.ts
gives the following error
⚠️ ┌ Deno requests net access to "registry.npmjs.org".
├ Requested by `fetch()` API
├ Run again with --allow-net to bypass this prompt.
└ Allow? [y/n] (y = yes, allow; n = no, deny) > Watcher Process started.
LiveViewJS (Deno) is listening at: http://localhost:9001
while the counter is still not working.
After adding the required additional permision the command becomes deno run --allow-run --allow-read --allow-env --allow-net src/example/autorun.ts
returns the next error
Watcher Process started.
LiveViewJS (Deno) is listening at: http://localhost:9001
⚠️ ┌ Deno requests write access to "/home/<user>/.cache/esbuild/bin".
├ Requested by `Deno.mkdir()` API
├ Run again with --allow-write to bypass this prompt.
└ Allow? [y/n] (y = yes, allow; n = no, deny)
In the end, the full command that worked for me without errors in the cli and examples functioning as expected was deno run --allow-run --allow-read --allow-write --allow-net --allow-env src/example/autorun.ts
.
Thanks for sending this. I will update the README.