svgdotjs / svgdom

Straightforward DOM implementation to make SVG.js run headless on Node.js
MIT License
269 stars 53 forks source link

Requiring svgdom crashes due to file path issue #111

Closed robflop closed 1 year ago

robflop commented 1 year ago

I get the following error whenever I try to require svgdom (both 2.x and 3.x), whether it be in the console or in an actual JS file.

PS> node
Welcome to Node.js v18.12.1.
Type ".help" for more information.
> require('svgdom')
Uncaught TypeError [ERR_INVALID_FILE_URL_PATH]: File URL path must be absolute
    at __node_internal_captureLargerStackTrace (node:internal/errors:484:5)
    at new NodeError (node:internal/errors:393:5)
    at getPathFromURLWin32 (node:internal/url:1458:11)
    at fileURLToPath (node:internal/url:1488:22)
    at ./src/utils/defaults.js (...\node_modules\svgdom\main-require.cjs:3986:125)
    at __webpack_require__ (...\node_modules\svgdom\main-require.cjs:5278:41)
    at ...\node_modules\svgdom\main-require.cjs:5365:80
    at ...\node_modules\svgdom\main-require.cjs:5429:3
    at Object.<anonymous> (...\node_modules\svgdom\main-require.cjs:5434:12)
    at Module._compile (node:internal/modules/cjs/loader:1159:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1213:10)
    at Module.load (node:internal/modules/cjs/loader:1037:32)
    at Module._load (node:internal/modules/cjs/loader:878:12)
    at Module.require (node:internal/modules/cjs/loader:1061:19)
    at require (node:internal/modules/cjs/helpers:103:18) {
  code: 'ERR_INVALID_FILE_URL_PATH'
}

The line this error points to in the main-require.cjs file is the following, where I suspect the last part of the path:

https://github.com/svgdotjs/svgdom/blob/6e9257c2ff55447d5d5ca0708e1fa30676b644a3/main-require.cjs#L3986

Removing the line does fix the import crash (ignoring whatever breaks as a result of removint it), so it certainly has to do with the path contained in it.

Fuzzyma commented 1 year ago

omg how did that happen??

robflop commented 1 year ago

Just had a look at the git blame, and it seems this was introduced in the latest commit:

https://github.com/svgdotjs/svgdom/commit/6e9257c2ff55447d5d5ca0708e1fa30676b644a3#diff-461ee1242ef735a144cbed9bfb6d037c577b27dc7dd5a4c76dd41ba68af64dd7R3986

Fuzzyma commented 1 year ago

So the only reason we needed a cjs build anyway was the non-support of import.meta.url. But nowadays this is fixed. So I think I can just get rid of that and webpack and all ugly things that come with it and serve esm to node

robflop commented 1 year ago

Sure! Sounds good.

If you'll permit me an unrelated question: Does this lib support creating paths manually? I know there's a plugin for the web version of svg.js, but don't know if I can use that in node in any way.

Fuzzyma commented 1 year ago

what do you mean with manually? It is just a dom replacement. So I guess the answer is yes(?). Do you have an example? :)

Fuzzyma commented 1 year ago

@robflop can you try the current master and see if it works for you?

robflop commented 1 year ago

@robflop can you try the current master and see if it works for you?

Yup, the previous error about paths is gone now - however, using require itself doesn't work now, you have to import it.

If you try to use the former, the following error is thrown:

Error [ERR_REQUIRE_ESM]: require() of ES Module ...\node_modules\svgdom\main-module.js not supported. Instead change the require of main-module.js in \<filename>.js to a dynamic import() which is available in all CommonJS modules.

And regarding paths:

what do you mean with manually? It is just a dom replacement. So I guess the answer is yes(?). Do you have an example? :)

Ah, true, my bad. I was talking about something like the following, which is not suppored by svg.js by default as far as I know:

var rect = draw.path().M({x: 100, y: 100})

(from the https://github.com/otm/svg.path.js examples)

Fuzzyma commented 1 year ago

Yes, thats the downside of having a full esm package. you have to import it via async import. However, the upside for me as maintainer is quite huge so I am ok to role with it if there is no major backleash.

The path plugin you are refering to is not maintained by me and therefore I couldnt update it. So no, unfortunately you have to write your paths the old way. However template strings help quite a lot here:

const path = `M ${x} ${y}`

a bit more finger gymnastics tho :D

robflop commented 1 year ago

Gotcha. Alright, thank you!