Hey all, did people load a Kotlin/JS locally build...

# javascript

[Jurriaan Mous]

Hey all, did people load a Kotlin/JS locally build package into a project using Vite? Normally Vite works best with ESM but is able to load Commonjs code. But I cannot seem to get it to work properly with the instructions from here. It fails with not finding my imports: SyntaxError: Importing binding name 'exportedFunction' is not found.

Did somebody else managed to get it to work? Or see an obvious thing which I am missing?

I currently use this `vite.config.ts`:

export default defineConfig({
  optimizeDeps: {
    force: true,
    include: ['../build/js/packages/kotlinProject-shared-libary']
  },
  build: {
    outDir: 'build',
    commonjsOptions: {
      include: ['../build/js/packages/kotlinProject-shared-libary', /node_modules/]
    }
  },
  plugins: [],
})

[CLOVIS]

Vite works for me with the default config: https://gitlab.com/opensavvy/decouple/-/blob/main/demo/web/vite.config.js

[CLOVIS]

I just have a Gradle task to copy the config in the correct directory: https://gitlab.com/opensavvy/decouple/-/blob/main/demo/web/build.gradle.kts#L55

[Jurriaan Mous]

I was finding your configuration too before but I could not get it to work as it errors with the same error. If I am correct, you load your from Kotlin compiled JS code directly into Vite and not build it into a separate module to load it as a local dependency into another project?

[CLOVIS]

The dependency graph on this project is a bit complicated on this one. Here's a simplified version ('→' means "depends on"):

demo:web → demo → style:material → style:material-tailwind → style:material-common → core

All modules are Kotlin multiplatform libraries (including JS) except demo:web which is a JS executable module, hence why it's the one with the Vite config. It has two main tasks, developmentExecutableCompileSync (created by the Kotlin plugin, to which I added the configuration for Vite etc) that you can run with --continuous . It already compiles all modules you depend on in parallel and adds their final JS files in the correct place. You then just have to start Vite in the correct folder.

[CLOVIS]

The downside is that Vite only sees each Kotlin module as a single JS file, but that's just how it is for now (the Kotlin compiler works on an entire module at once)

[Jurriaan Mous]

Thanks for all the info! I tried multiple settings including yours, turned on debug mode, and inspected end result. It seems the commonjs to ESM conversion somehow is not triggered although the output is picked up for optimization. I could not see clearly why it was not picked up so gave up for now..

[apatrida]

I think KotlinJS has a useEsModules() or similar for the js block in gradle to change the module format.