https://kotlinlang.org logo
Join Slack
Powered by
I'm trying to look through the kotlin gradle plugi...
# compose-web
m
I'm trying to look through the kotlin gradle plugin but can't find what task generates the .mjs files so I can use them in the build (as the generated my-project.js file errors with being unable to find the skia module). Would anyone know how I would set this up? Specifically, I'm looking for the 
<module>.mjs
and 
<module>.uninstantiated.mjs
files. The error I get is
Copy code
index-public.js:32 Uncaught (in promise) Error: Cannot find module 'skia'
    at index-public.js:32:11
    at async _importModule (public.uninstantiated.mjs:14:1)
    at async instantiate (public.uninstantiated.mjs:3894:1)
    at async eval (public.mjs:3:16)
with code
Copy code
<script type="application/javascript" src="static/js/skiko.js"></script>
        <script type="application/javascript" src="static/js/index-public.js"></script>
👍 1
a
which directories contain the .mjs files?
m
build/compileSync/wasm/main/<typeExecutable/kotlin
. However, wasmExecutableDevelopmentCompileSync does not generate the .mjs files.
a
hmmm from the name I suspect that dir is populated from a generic task, which copies the output files from the actual tasks if you look in 
build/tmp
are there any .mjs files?
m
It seems to be produced in 
build/js/packages/<module>/kotlin/<module>.mjs
. None in the temporary folders though.
a
try adding this:
Copy code
tasks.configureEach {

  val buildDir = project.layout.buildDirectory

  doLast {
    val mjsFiles = buildDir.get()
        .asFileTree
        .matching { include("**/*.mjs") }
        .files

    if (mjsFiles.isNotEmpty()) {
      println("build dir contains .mjs files after task:$path ran")
    }
  }
}
and then running 
./gradlew clean assemble
It adds an additional action to each task that will check the build dir after each task, and if an .mjs file suddenly exists then it will log the task path. So if you check the logs then it should narrow down the options.
m
Hmm, that did help solve the issue, but loading the mjs file instead errors with
Copy code
Uncaught TypeError: Failed to resolve module specifier 'skia'
a
ah nice, what was the name of the task?
m
It ended up being 
compile<type>ExecutableKotlinWasm
, which does raise concerns on how to accomplish this with multiple wasm modules in the multiplatform project.
Do you happen to know of a better way to load the distribution JS files "correctly"? as simply adding both to the <head> tag doesn't work.
a
what do you have at the moment?
I’ve got a Kotlin/JS project with this 
src/jsMain/resources/index.html
. The Gradle subproject has a path of 
:fca-components:fca-site
, but Kotlin only uses the name for the generated .js file https://youtrack.jetbrains.com/issue/KT-59700, so I import 
fca-site.js
. There’s no 
fca-site.js
file in the build dir (apparently 
fca-site.js
is loaded from memory)
Untitled.html
m
ah, I guess I should've mentioned I'm using Compose for WASM
a
I picked that up from you mentioning Skiko :) But the principles for Kotlin/JS and Kotlin/WASM should be quite similar, I think
m
Hmm, I wonder what the issue is then, since I provide and include both JS files and both WASM files
a
possibly it’s something to do with Webpack?
I remember seeing this ‘wasmLoading’ option, but I have no idea whether it’s relevant to Kotlin projects https://webpack.js.org/configuration/output/#outputwasmloading
and Skiko itself has some config for running Karma tests (but it’s beyond my comprehension!) https://github.com/JetBrains/skiko/blob/master/skiko/karma.config.d/wasm.js
m
Unfortunately I haven't been able to figure this out 😞
20 Views
Open in Slack
PreviousNext
Powered by