How does the new distribution dsl work? I set a cu...
# javascript
h
How does the new distribution dsl work? I set a custom folder but the folder is empty. I also don't see any related task like
createDistribution
or similar:
Copy code
js {
  binaries.executable()
  useEsModules()
  nodejs {
    distribution {
      distributionName.set("myFile.mjs")
      outputDirectory.set(layout.projectDirectory.dir("myDist"))
    }
  }
}
e
@hfhbd which task are you invoking? You should work with
jsNodeProductionLibraryDistribution
, for example
Ah wait, you're creating an executable
Executables don't output to a distribution IIRC, at least I've never seen them do it.
h
Okay, but how do I get an (fat) executable? Maybe I still don't understand the JS ecosystem ๐Ÿ˜„ I just want to create an executable GitHub JS action with all npm dependencies too.
e
executable()
is correct. Running the typical Gradle
build
will invoke
jsProductionExecutableCompileSync
, which will output:
You can use with the
whole-program
granularity to get a single JS file I suppose.
h
Yes, but
whole-program
should only merge all
.mjs
(from productionExecutable) into one big
.mjs
, right? It still does not merge npm dependencies?
At least with or without
whole-program
I still get
import com_github_actions_github_y1dwzy from '@actions/github';
resulting into a runtime error due unresolved files.
e
But will
@actions/github
be available where you deploy the JS code?
I mean, I'm not familiar with GH Actions, but where do they run? In a Node.js environment right?
If it's a yes, than that dependency should be available at runtime
h
yes, in node.js, but after looking at the doc again, its not available ๐Ÿคฆ๐Ÿปโ€โ™‚๏ธhttps://docs.github.com/en/actions/creating-actions/creating-a-javascript-action#commit-tag-and-push-your-action-to-github They workaround is checking in the node_modules folder or using https://github.com/vercel/ncc.
Okay, how do I integrate ncc with Kotlin/JS?
r
Why don't you use webpack task? It can create a bundle for node as well.
e
@Robert Jaros are we sure the Webpack task is registered for Node.js? IIRC it's only for browser
r
It's not. But you can use the browser version or register your own.
e
Register a custom Webpack task? Like what you did a while ago?
r
Yes.
All you need is this line in webpack.config.d to make webpack create nodejs bundle: https://github.com/rjaros/kilua/blob/main/examples/ssr-ktor/webpack.config.ssr.d/webpack.js#L39
e
That should work, yeah. If you find you're bundling too much, use Webpack
externals
to remove modules.
You might also find this useful https://github.com/rnett/kotlin-js-action
h
Thank you, web pack works, except ES modules support.
And do you really say Ryan already did implement my idea? ๐Ÿ˜
e
What do you mean with ES support?
Well the linked repo hasn't been updated for 2 years, so there is that!
h
Yeah, and Ryan does not use ES modules. But it works ๐Ÿ˜„
e
Have you looked it up on Google? It seems unrelated to Kotlin. You might have to thinker with Webpack
h
What do you think I did in the last 2h? ๐Ÿ˜„
๐Ÿ˜‚ 1
Yes, but every change/usage of web pack is one step forward and two back ๐Ÿ˜„
e
Difficult to say what's going wrong. I'd first check the outputted ESM code locally, to verify everything looks good. I'd then run Webpack manually instead of using your custom task, and verify if the same error reproduces
Did you verify package.json contains type = module?
Or do you deploy without package.json since it's an executable?
h
Yes it contains
type = module
which also causes problems with the generated webpack config file because this config isn't ES compatible. And I can't hack it, this needs some changes in KGP. Will create an issue tomorrow.
e
Can't you place a JS file under
webpack.config.d
to modify the config object?
h
No KGP creates the merged js file automatically and uses it in the same task, so you can't intercept it. (Ideally, there should be two tasks but anyway). https://youtrack.jetbrains.com/issue/KT-66934/KGP-JS-Merged-Webpack-webpack.config.js-support-ES-module-remove-require-in-KotlinWebpackConfig
e
I'll follow the issue then, thanks!