Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

esbuild-wasm (works for esbuild) fails to resolve imports from 'nodePaths' when entrypoints are not in the toplevel dir #3001

Closed
KKoukiou opened this issue Mar 17, 2023 · 5 comments
Closed

esbuild-wasm (works for esbuild) fails to resolve imports from 'nodePaths' when entrypoints are not in the toplevel dir #3001

KKoukiou opened this issue Mar 17, 2023 · 5 comments

Comments

@KKoukiou
Copy link 

commit e982017ccf013c4b196c51fe22fbf355dd14e15f (HEAD -> master)
Author: Katerina Koukiou <kkoukiou@redhat.com>
Date:   Fri Mar 17 13:59:15 2023 +0100

    Esbuild-wasm does not respect nodePaths when entrypoint is nested

diff --git build.js build.js
new file mode 100644
index 0000000..986e684
--- /dev/null
+++ build.js
@@ -0,0 +1,18 @@
+#!/usr/bin/env node
+
+import esbuild from "esbuild-wasm";
+
+const nodePaths = ['./lib'];
+
+const context = await esbuild.context({
+    bundle: true,
+    entryPoints: ["./pkg/blue/Blue.jsx"],
+    loader: {
+        ".js": "jsx",
+    },
+    nodePaths,
+    outdir: "./dist",
+});
+
+await context.rebuild();
+context.dispose();
diff --git lib/Color.jsx lib/Color.jsx
new file mode 100644
index 0000000..e21ff5d
--- /dev/null
+++ lib/Color.jsx
@@ -0,0 +1,5 @@
+import * as React from 'react';
+
+export const Color = (props) => {
+    return <div class='mycolor'>{props.children}</div>;
+};
diff --git package.json package.json
new file mode 100644
index 0000000..c695c89
--- /dev/null
+++ package.json
@@ -0,0 +1,10 @@
+{
+  "type": "module",
+  "sideEffects": false,
+  "devDependencies": {
+    "esbuild": "^0.17.10",
+    "esbuild-wasm": "^0.17.10",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  }
+}
diff --git pkg/blue/Blue.jsx pkg/blue/Blue.jsx
new file mode 100644
index 0000000..9372f4b
--- /dev/null
+++ pkg/blue/Blue.jsx
@@ -0,0 +1,6 @@
+import * as React from 'react';
+import { Color } from 'Color.jsx';
+
+export const Blue = () => {
+    return <Color>blue</Color>;
+};

Running esbuild-wasm here fails to resolve Color.jsx file from ./lib directory

[kkoukiou@sequioa test-esbuild-wasm-node-resulution]$ node build.js 
✘ [ERROR] Cannot read directory "lib/Color.jsx": Invalid argument

/home/kkoukiou/repos/test-esbuild-wasm-node-resulution/node_modules/esbuild-wasm/lib/main.js:1626
  let error = new Error(`${text}${summary}`);
              ^

Error: Build failed with 1 error:
error: Cannot read directory "lib/Color.jsx": Invalid argument
    at failureErrorWithLog (/home/kkoukiou/repos/test-esbuild-wasm-node-resulution/node_modules/esbuild-wasm/lib/main.js:1626:15)
    at /home/kkoukiou/repos/test-esbuild-wasm-node-resulution/node_modules/esbuild-wasm/lib/main.js:1038:25
    at /home/kkoukiou/repos/test-esbuild-wasm-node-resulution/node_modules/esbuild-wasm/lib/main.js:983:52
    at buildResponseToResult (/home/kkoukiou/repos/test-esbuild-wasm-node-resulution/node_modules/esbuild-wasm/lib/main.js:1036:7)
    at /home/kkoukiou/repos/test-esbuild-wasm-node-resulution/node_modules/esbuild-wasm/lib/main.js:1048:9
    at new Promise (<anonymous>)
    at requestCallbacks.on-end (/home/kkoukiou/repos/test-esbuild-wasm-node-resulution/node_modules/esbuild-wasm/lib/main.js:1047:54)
    at handleRequest (/home/kkoukiou/repos/test-esbuild-wasm-node-resulution/node_modules/esbuild-wasm/lib/main.js:713:19)
    at handleIncomingPacket (/home/kkoukiou/repos/test-esbuild-wasm-node-resulution/node_modules/esbuild-wasm/lib/main.js:735:7)
    at Socket.readFromStdout (/home/kkoukiou/repos/test-esbuild-wasm-node-resulution/node_modules/esbuild-wasm/lib/main.js:663:7) {
  errors: [
    {
      detail: undefined,
      id: '',
      location: null,
      notes: [],
      pluginName: '',
      text: 'Cannot read directory "lib/Color.jsx": Invalid argument'
    }
  ],
  warnings: []
}

When using the esbuild binary instead of the esbuild wasm, it works as expected, so this issue is only present for the esbuild-wasm.

Using full path instead of the relative path in the nodePaths, does not seem to help either.
@KKoukiou KKoukiou changed the title esbuid-wasm (only - works for esbuild) fails to resolve imports from 'nodePaths' when entrypoints are not in the toplevel dir esbuid-wasm (works for esbuild) fails to resolve imports from 'nodePaths' when entrypoints are not in the toplevel dir Mar 17, 2023
@KKoukiou KKoukiou mentioned this issue Mar 17, 2023
Merged
17 tasks
@KKoukiou KKoukiou changed the title esbuid-wasm (works for esbuild) fails to resolve imports from 'nodePaths' when entrypoints are not in the toplevel dir esbuild-wasm (works for esbuild) fails to resolve imports from 'nodePaths' when entrypoints are not in the toplevel dir Mar 17, 2023
@KKoukiou
Copy link
Author

Workaround is to either use full paths when importing or omit the file extension.
So,

+import { Color } from '../lib/Color.jsx';

or

+import { Color } from 'Color';

KKoukiou added a commit to KKoukiou/cockpit that referenced this issue Mar 17, 2023
@KKoukiou
When importing from lib don't use file extension
5fbacc9 
evanw/esbuild#3001

Unfortunally scss imports with non relative paths still don't work with
esbuild-wasm if these are inside jsx files. Use relative paths for
importing scss from JS.
Same for .sh and .py files processed by the raw loader.

Replacement done with:
for file in $(ls pkg/lib); do echo 'Processing' $file; base=$(basename $file) find pkg/ -type f -exec sed -i "s/$base/${base%.*}/g" {} +; done

And fixed up the rest manually.
@evanw
Copy link
Owner

evanw commented Mar 17, 2023

Thanks for the report. It looks like this is because Go returns EINVAL instead of ENOTDIR with WASM, unlike Unix. I will work around this in esbuild itself.

@evanw evanw closed this as completed in deb93e9 Mar 17, 2023
@martinpitt
Copy link

Amazing, thanks @evanw for the super-fast fix!

KKoukiou added a commit to KKoukiou/cockpit that referenced this issue Mar 21, 2023
@KKoukiou
When importing from lib don't use file extension
7b22b1a 
evanw/esbuild#3001

Unfortunally scss imports with non relative paths still don't work with
esbuild-wasm if these are inside jsx files. Use relative paths for
importing scss from JS.
Same for .sh and .py files processed by the raw loader.

Replacement done with:
for file in $(ls pkg/lib); do echo 'Processing' $file; base=$(basename $file) find pkg/ -type f -exec sed -i "s/$base/${base%.*}/g" {} +; done

And fixed up the rest manually.
martinpitt pushed a commit to KKoukiou/cockpit that referenced this issue Mar 22, 2023
@KKoukiou @martinpitt
When importing from lib don't use file extension
d109848 
evanw/esbuild#3001

Unfortunally scss imports with non relative paths still don't work with
esbuild-wasm if these are inside jsx files. Use relative paths for
importing scss from JS.
Same for .sh and .py files processed by the raw loader.

Replacement done with:
for file in $(ls pkg/lib); do echo 'Processing' $file; base=$(basename $file) find pkg/ -type f -exec sed -i "s/$base/${base%.*}/g" {} +; done

And fixed up the rest manually.
martinpitt pushed a commit to martinpitt/cockpit that referenced this issue Mar 22, 2023
@KKoukiou @martinpitt
pkg: When importing from lib don't use file extension
91364b4 
Unfortunately, scss imports with non relative paths still don't work
with esbuild-wasm if these are inside jsx files:
evanw/esbuild#3001

Use relative paths for importing scss from JS. Same for .sh and .py
files processed by the raw loader.

Replacement done with:
```
for file in $(ls pkg/lib); do echo 'Processing' $file; base=$(basename $file) find pkg/ -type f -exec sed -i "s/$base/${base%.*}/g" {} +; done
```

And fixed up the rest manually.
@martinpitt martinpitt mentioned this issue Mar 22, 2023
Closed
martinpitt pushed a commit to KKoukiou/cockpit that referenced this issue Mar 22, 2023
@KKoukiou @martinpitt
When importing from lib don't use file extension
901e0ce 
evanw/esbuild#3001

Unfortunally scss imports with non relative paths still don't work with
esbuild-wasm if these are inside jsx files. Use relative paths for
importing scss from JS.
Same for .sh and .py files processed by the raw loader.

Replacement done with:
for file in $(ls pkg/lib); do echo 'Processing' $file; base=$(basename $file) find pkg/ -type f -exec sed -i "s/$base/${base%.*}/g" {} +; done

And fixed up the rest manually.
martinpitt pushed a commit to KKoukiou/cockpit that referenced this issue Mar 23, 2023
@KKoukiou @martinpitt
When importing from lib don't use file extension
faa6784 
evanw/esbuild#3001

Unfortunally scss imports with non relative paths still don't work with
esbuild-wasm if these are inside jsx files. Use relative paths for
importing scss from JS.
Same for .sh and .py files processed by the raw loader.

Replacement done with:
for file in $(ls pkg/lib); do echo 'Processing' $file; base=$(basename $file) find pkg/ -type f -exec sed -i "s/$base/${base%.*}/g" {} +; done

And fixed up the rest manually.
martinpitt pushed a commit to KKoukiou/cockpit that referenced this issue Mar 23, 2023
@KKoukiou @martinpitt
When importing from lib don't use file extension
21c4b2d 
evanw/esbuild#3001

Unfortunally scss imports with non relative paths still don't work with
esbuild-wasm if these are inside jsx files. Use relative paths for
importing scss from JS.
Same for .sh and .py files processed by the raw loader.

Replacement done with:
for file in $(ls pkg/lib); do echo 'Processing' $file; base=$(basename $file) find pkg/ -type f -exec sed -i "s/$base/${base%.*}/g" {} +; done

And fixed up the rest manually.
martinpitt pushed a commit to KKoukiou/cockpit that referenced this issue Mar 23, 2023
@KKoukiou @martinpitt
When importing from lib don't use file extension
a922fd8 
evanw/esbuild#3001

Unfortunally scss imports with non relative paths still don't work with
esbuild-wasm if these are inside jsx files. Use relative paths for
importing scss from JS.
Same for .sh and .py files processed by the raw loader.

Replacement done with:
for file in $(ls pkg/lib); do echo 'Processing' $file; base=$(basename $file) find pkg/ -type f -exec sed -i "s/$base/${base%.*}/g" {} +; done

And fixed up the rest manually.
martinpitt pushed a commit to KKoukiou/cockpit that referenced this issue Mar 23, 2023
@KKoukiou @martinpitt
When importing from lib don't use file extension
4bbdaa3 
evanw/esbuild#3001

Unfortunally scss imports with non relative paths still don't work with
esbuild-wasm if these are inside jsx files. Use relative paths for
importing scss from JS.
Same for .sh and .py files processed by the raw loader.

Replacement done with:
for file in $(ls pkg/lib); do echo 'Processing' $file; base=$(basename $file) find pkg/ -type f -exec sed -i "s/$base/${base%.*}/g" {} +; done

And fixed up the rest manually.
martinpitt pushed a commit to KKoukiou/cockpit that referenced this issue Mar 23, 2023
@KKoukiou @martinpitt
When importing from lib don't use file extension
72b02c2 
evanw/esbuild#3001

Unfortunally scss imports with non relative paths still don't work with
esbuild-wasm if these are inside jsx files. Use relative paths for
importing scss from JS.
Same for .sh and .py files processed by the raw loader.

Replacement done with:
for file in $(ls pkg/lib); do echo 'Processing' $file; base=$(basename $file) find pkg/ -type f -exec sed -i "s/$base/${base%.*}/g" {} +; done

And fixed up the rest manually.
martinpitt pushed a commit to KKoukiou/cockpit that referenced this issue Mar 23, 2023
@KKoukiou @martinpitt
When importing from lib don't use file extension
fa30d8a 
evanw/esbuild#3001

Unfortunally scss imports with non relative paths still don't work with
esbuild-wasm if these are inside jsx files. Use relative paths for
importing scss from JS.
Same for .sh and .py files processed by the raw loader.

Replacement done with:
for file in $(ls pkg/lib); do echo 'Processing' $file; base=$(basename $file) find pkg/ -type f -exec sed -i "s/$base/${base%.*}/g" {} +; done

And fixed up the rest manually.
@martinpitt
Copy link

@evanw : As this is awkward to work around, do you plan to do a new release with this soon? (Sorry for nagging, this is to plan whether we should go with the ugly workaround, or just wait for the next release). Thanks!

@evanw
Copy link
Owner

evanw commented Mar 24, 2023

Yeah I should do a release. Thanks for the bump. I'll try to get one out in the next day or so.

martinpitt pushed a commit to KKoukiou/cockpit that referenced this issue Mar 24, 2023
@KKoukiou @martinpitt
When importing from lib don't use file extension
fdace82 
evanw/esbuild#3001

Unfortunally scss imports with non relative paths still don't work with
esbuild-wasm if these are inside jsx files. Use relative paths for
importing scss from JS.
Same for .sh and .py files processed by the raw loader.

Replacement done with:
for file in $(ls pkg/lib); do echo 'Processing' $file; base=$(basename $file) find pkg/ -type f -exec sed -i "s/$base/${base%.*}/g" {} +; done

And fixed up the rest manually.
martinpitt pushed a commit to KKoukiou/cockpit that referenced this issue Mar 24, 2023
@KKoukiou @martinpitt
When importing from lib don't use file extension
f62652e 
evanw/esbuild#3001

Unfortunally scss imports with non relative paths still don't work with
esbuild-wasm if these are inside jsx files. Use relative paths for
importing scss from JS.
Same for .sh and .py files processed by the raw loader.

Replacement done with:
for file in $(ls pkg/lib); do echo 'Processing' $file; base=$(basename $file) find pkg/ -type f -exec sed -i "s/$base/${base%.*}/g" {} +; done

And fixed up the rest manually.
martinpitt pushed a commit to KKoukiou/cockpit that referenced this issue Mar 24, 2023
@KKoukiou @martinpitt
When importing from lib don't use file extension
6a6d298 
evanw/esbuild#3001

Unfortunally scss imports with non relative paths still don't work with
esbuild-wasm if these are inside jsx files. Use relative paths for
importing scss from JS.
Same for .sh and .py files processed by the raw loader.

Replacement done with:
for file in $(ls pkg/lib); do echo 'Processing' $file; base=$(basename $file) find pkg/ -type f -exec sed -i "s/$base/${base%.*}/g" {} +; done

And fixed up the rest manually.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@martinpitt @evanw @KKoukiou