I'm trying to update my project to Compose for Web...

# compose-web

[David Herman]

I'm trying to update my project to Compose for Web 1.2.0 + Kotlin 1.7.10. When I run, I'm getting this error message in my console:

Uncaught Error: Error loading module 'site'. Its dependency 'androidx-runtime' was not found. Please, check whether 'androidx-runtime' is loaded prior to 'site'

Anyone else seeing this? I'll drop more details in a 🧵

[David Herman]

The generated JS code that's throwing is:

(function (root, factory) {
  if (typeof define === 'function' && define.amd)
    ...
  else if (typeof exports === 'object')
    ...
  else {
    if (typeof this['androidx-runtime'] === 'undefined') {
      throw new Error("Error loading module 'helloworld'. Its dependency 'androidx-runtime' was not found. Please, check whether 'androidx-runtime' is loaded prior to 'helloworld'.");
    }
    if (typeof this['web-web-core'] === 'undefined') {
      throw new Error("Error loading module 'helloworld'. Its dependency 'web-web-core' was not found. Please, check whether 'web-web-core' is loaded prior to 'helloworld'.");
    }
    if (typeof this['kotlin-kotlin-stdlib-js-ir'] === 'undefined') {
      throw new Error("Error loading module 'helloworld'. Its dependency 'kotlin-kotlin-stdlib-js-ir' was not found. Please, check whether 'kotlin-kotlin-stdlib-js-ir' is loaded prior to 'helloworld'.");
    }
    ...

[David Herman]

What's weird is I had another project where the dependency order was changed around, and it was the kotlin-kotlin-stdlib-js-ir line that was throwing because it showed up first in the if statements.

[David Herman]

I searched my build directory and those JS files exist:

~/Code/site/build/js/packages/helloworld/kotlin
 $ ls
88b0986a7186d029-atomicfu-js-ir.js      kobweb-kobweb-silk.js.map                                markdown/
88b0986a7186d029-atomicfu-js-ir.js.map  kobweb-kobweb-silk-widgets.js                            public/
androidx-runtime.js                     kobweb-kobweb-silk-widgets.js.map                        site.d.ts
androidx-runtime.js.map                 kobweb-kobwebx-markdown.js                               site.js
kobweb-kobweb-compose.js                kobweb-kobwebx-markdown.js.map                           site.js.map
kobweb-kobweb-compose.js.map            kobweb-web-compose-ext.js                                web-internal-web-core-runtime.js
kobweb-kobweb-core.js                   kobweb-web-compose-ext.js.map                            web-internal-web-core-runtime.js.map
kobweb-kobweb-core.js.map               kotlin-kotlin-stdlib-js-ir.js                            web-web-core.js
kobweb-kobweb-silk-icons-fa.js          kotlin-kotlin-stdlib-js-ir.js.map                        web-web-core.js.map
kobweb-kobweb-silk-icons-fa.js.map      kotlinx.coroutines-kotlinx-coroutines-core-js-ir.js
kobweb-kobweb-silk.js                   kotlinx.coroutines-kotlinx-coroutines-core-js-ir.js.map

[David Herman]

I'll poke around my build script more, maybe there's a version incompatibility somewhere (I was previously using Compose 1.1.1 + Kotlin 1.6.10)

[David Herman]

I guess this isn't happening to anyone else, so it's almost certainly related to custom stuff I'm doing

[David Herman]

One thing I noticed is that previously, the js/packages/helloworld/kotlin is empty, whereas now it's full of stuff. I'm guessing something happened with Compose for Web where things became a lot more modular.

[David Herman]

OK, looks like my issue is due to https://kotlinlang.org/docs/whatsnew1620.html#separate-js-files-for-project-modules-by-default-with-ir-compiler

[David Herman]

Setting compilation to whole-program fixes me for now. I'll try to dig in a bit more to get my system working with a per-module approach now that I know what it is.