47-js-target-compose-add

[vinceglb]

Hello @hondogo! Thank you for your contribution!

I tried to test your modifications using the samples, but I didn't succeed.

First, I tried to launch SampleCore Js in Android Studio but here is the error message:

Executing tasks: [samples:sample-core:composeApp:jsBrowserDevelopmentRun] in project /Users/vincent/AndroidStudioProjects/PickerKotlin

Type-safe project accessors is an incubating feature.

FAILURE: Build failed with an exception.

* What went wrong:
Cannot locate tasks that match 'samples:sample-core:composeApp:jsBrowserDevelopmentRun' as task 'jsBrowserDevelopmentRun' not found in project ':samples:sample-core:composeApp'.

The js target is missing in the sample-core build.gradle. I tried to fix it by adding the target like wasmJs. After that, the command worked but when I tried to open the web application, nothing happened: I only have a blank page.

After that, I tried to launch SampleCompose Js. The command works without errors but same result, I have a blank page when opening my browser. Here is the warnings I got:

> Task :samples:sample-compose:composeApp:jsBrowserDevelopmentRun
<i> [webpack-dev-server] Project is running at:
<i> [webpack-dev-server] Loopback: http://localhost:8081/
<i> [webpack-dev-server] On Your Network (IPv4): <my ip>
<i> [webpack-dev-server] On Your Network (IPv6): <my ip>
<i> [webpack-dev-server] Content not from webpack is served from 'kotlin, ../../../../samples/sample-compose/composeApp/build/processedResources/js/main, /Users/vincent/AndroidStudioProjects/PickerKotlin/samples/sample-compose/composeApp' directory
<i> [webpack-dev-middleware] wait until bundle finished: /
Module not found: Error: Can't resolve 'os' in '/Users/vincent/AndroidStudioProjects/PickerKotlin/build/js/packages/composeApp/kotlin'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
    - add a fallback 'resolve.fallback: { "os": require.resolve("os-browserify/browser") }'
    - install 'os-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "os": false }
Module not found: Error: Can't resolve 'path' in '/Users/vincent/AndroidStudioProjects/PickerKotlin/build/js/packages/composeApp/kotlin'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
    - add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }'
    - install 'path-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "path": false }
webpack 5.91.0 compiled with 2 warnings in 5224 ms

Does it work on your side?

[hondogo]

Hello @vinceglb ! I've just pushed fixes to make samples work. Could you check?

[vinceglb]

Thank you! It's working perfectly now 👌

By experimenting with the new js samples, I found a bug I introduced when downloading files from the Js target. I added a commit to fix it.

Everything seems to be running smoothly. Thanks again for your help 🎉