ditto icon indicating copy to clipboard operation
ditto copied to clipboard

Rethink how JavaScript packages are generated

Open iacore opened this issue 2 years ago • 5 comments

Currently, JS files produced by Ditto rely on npm for linking. The reason in that they import each other with import std/...`.

It might be better to generate both packages and dist in the some folder, and use relative imports. This way, these files can be served directly to be used in browser, or in Deno.

iacore avatar Jan 25 '23 07:01 iacore

Hey @locriacyber 👋 Thanks for taking an interest in ditto!

JS files produced by Ditto rely on npm for linking

This was a deliberate design choice, as I wanted ditto packages to be able to express NPM dependencies.

See https://github.com/ditto-lang/vdom/blob/702d6e4c1bb711b11ca6a0bc3bafc19d8fdfdb3c/ditto.toml#L10-L11 for example: the vdom package depends on snabbdom. When you run npm install not only will it link everything in packages/*, it will also pick up and install these dependencies.

It might be better to generate both packages and dist in the some folder, and use relative imports.

This is, in effect, what PureScript does. And it has this issue where NPM dependencies are implicit. In cases like purescript-react-basic those dependencies are more obvious, but there are some where it can be an annoying gotcha.

Re serving generated files directly to the browser: I had imagined ditto code would always be passed through a bundler, but this would be a nice thing to support. I don't think it would work given the presence of NPM dependencies though?

And WRT Deno: I plan to support this as a separate codegen target in the future, bear with me.

jmackie avatar Jan 25 '23 09:01 jmackie

In Deno, you can import npm modules with npm:snabbdom. The alternative is to generate import_map.json, which is like package.json but for Deno.

iacore avatar Jan 25 '23 11:01 iacore

When you run npm install not only will it link everything in packages/*, it will also pick up and install these dependencies.

See https://github.com/ditto-lang/todomvc/pull/3. It doesn't work with pnpm.

iacore avatar Jan 25 '23 11:01 iacore

Also, do you have other community channels, like Matrix? I'm interested in talking to you about ditto.

iacore avatar Jan 25 '23 11:01 iacore

In Deno, you can import npm modules with npm:snabbdom. The alternative is to generate import_map.json, which is like package.json but for Deno.

Sweet, good to know 🙏 But like I say, the current JavaScript code generator isn't intended to be deno compatible. My plan was to introduce a new target for deno (https://github.com/ditto-lang/ditto/discussions/15#discussioncomment-4611362)

See https://github.com/ditto-lang/todomvc/pull/3. It doesn't work with pnpm.

Yeah that's a good point. The root package.json isn't really within ditto's control though (beyond bootstrapping a new project with ditto bootstrap --js) so I'm happy to leave that to users to tweak according to their preferred package manager.

I might need to rethink how the packages/*/package.json files get generated to ensure compatibility with the different package managers though 🤔

https://github.com/ditto-lang/ditto/blob/2060206fe2f7683131544eb3c8f138eb836e8706/crates/ditto-make/src/compile.rs#L346-L375

Also, do you have other community channels, like Matrix? I'm interested in talking to you about ditto.

There's no community at the moment 😅 Would just be me in the channel...

If you wanted to set something up I'd be grateful. Although I have a slight preference for using discussions.

jmackie avatar Jan 25 '23 12:01 jmackie