Has anyone seen an error like this?

Cannot destructure property `AbortController` of 'undefined' or 'null'

I’m getting another weird error now. I’ve solved the AbortController problem, but now I’m getting

Error loading module 'node-fetch': Error: Cannot find module 'node-fetch'

.

is it just me or does kotlinx.serializable on a Kotlin class really makes the generated JS explode in size? without Kotlin serialization

-rw-rw-r-- 1 vlad vlad  79K Jul 18 10:22 register.e2a243ea.js

with serialization

-rw-rw-r-- 1 vlad vlad  349K Jul 18 09:21 register.6e5afb3d.js

might be more efficient to just use JS's stringify on the frontend and gson / jackson on the backend removing serialization completely, all the annotations and and imports and it drops down to 17K, so that's a 300kB+ penalty for using serialization

Hi! I am playing with 1.4-M3 and noticed that

@JsExport

is actually quite restrictive. I am wondering whether there are any plans to relax this in the future? I am mostly thinking supporting enums and properties without fields. At the moment I cannot export a class annotated with

@Serializable

. The specific use case is sharing a data class between my TS and Kotlin/jvm codebases Otherwise amazing work with 1.4, it's amazing to have TS definitions for kotlin code

Hi I'm new with kotlin, so my question may be stupid, but are there someone, who have correctly implement

klock

to multiplatform? I have implemented 1.11.13, everything works fine, with using

npm link

, but it is not possible to publish it to my private nexus NPM repo what I try, is to change package.json, and change it to my scope before publish, this help me with

kotlin-source-map-loader

, but

klock

create

require('klock-root-klock')

on end of generated js file

[Solved] I'm testing with

Socket IO

and I'm having trouble with connection in server. It appears to make the connection 3 times. Could someone give me a hint? I have tried with others projects and I have the same problem. Server Connection:

Server Starting!
Chat Server listening on port <http://localhost:8000>
socket connection
socket connection
socket connection

Resume Configuration IO:

val express = require("express")
val app = express()
app.set("port", port)

val server = require("http").createServer(app)
server.listen(port)

val io     = require("<http://socket.io|socket.io>")(server)
io.on("connect") { socket ->
    console.log("socket connection") 
}

JavaScript Generated:

function main$lambda_0(closure$users, closure$numOfUsers) {
 return function (socket) {
   console.log('socket connection');
   socket.on('join', main$lambda$lambda(socket, closure$users, closure$numOfUsers));
   socket.on('disconnect', main$lambda$lambda_0(closure$users, socket, closure$numOfUsers));
   return socket.on('new_message', main$lambda$lambda_1(closure$users, socket));
 };
}

function main() {
  var numOfUsers = {v: 0};
  println('Server Starting!');
  var express = require('express');
  var app = express();
  var path = require('path');
  var bodyParser = require('body-parser');
  var debug = require('debug')('kotlin_react_chat:server');
  var port = normalizePort(process.env.PORT);
  app.use(bodyParser.json());
  app.set('port', port);
  app.set('views', path.join(__dirname, '../../webapp'));
  app.set('view engine', 'ejs');
  app.use(express.static('webapp'));
  app.use('/', router());
  var server = require('http').createServer(app);
  server.listen(port, main$lambda(port));
  var io = require('<http://socket.io|socket.io>')(server);
  var users = ArrayList_init();
  io.on('connect', main$lambda_0(users, numOfUsers));
}

Hello, is there a browser compatibility table for the code generated?

Are there any Fritz2 users?

The compiler converts a list property

entries

to something like:

object.entries.array_hd7ov6$_0

. Is there a way to give it a nice name via

@jsname

? Or should I just use Arrays instead of Lists?

Adding

implementation(npm("brigadier-ts"))

to my multiplatform jsMain (kotlin dsl) breaks my project structure. The only msg I get is the following:

<ij_msg_gr>Gradle import errors<ij_msg_gr><ij_nav>K:\Minecraft\fabric\Brigadier\build.gradle.kts<ij_nav><i><b>root project 'Brigadier': Unable to build Kotlin project configuration</b><eol>Details: org.gradle.internal.operations.BuildOperationQueueFailure: There was a failure while populating the build operation queue: NPM project resolved without org.jetbrains.kotlin.gradle.targets.js.npm.KotlinNpmResolutionManager@4d5bb864<eol>Caused by: java.lang.IllegalStateException: NPM project resolved without org.jetbrains.kotlin.gradle.targets.js.npm.KotlinNpmResolutionManager@4d5bb864</i>

I'd like to use a local SCSS file in my Kotlin/JS application. I'm already using external npm dependencies:

import kotlinext.js.require

require("@patternfly/patternfly/patternfly.css")
require("@patternfly/patternfly/patternfly-addons.css")
require("highlight.js/lib/core")
require("highlight.js/lib/languages/kotlin")

Now I'd like to use a SCSS file from

src/main/resources/showcase.scss

. But webpack won't find the file. I've already tried different paths:

require("./src/main/resources/showcase.scss")
require("./resources/showcase.scss")
require("./showcase.scss")

w/o success. Anybody knows how to process local SCSS files with Kotlin/JS & Webpack?

Hi. Is there any documentation about KotlinJS? or only hands-on ? thx

Am I imagining things, or does the new IR compiler compile much slower?

Hey everyone, my company is in the process of trying out Kotlin to have a shared data layer between the different frontends (android, iOS, web). The main development effort will happen on iOS first, but I am wanna try to get something running on web as early as possible in parallel. Is now the right time to try to do so? Or should one wait for the next (some future) release, which is gonna make everything much easier?

Hi. Using gradle, how publish the jsJar of a javascript library project to a maven repository?

Hi y'all, I'm new to both Kotlin and KotlinJS. I have the simplest project set up, and am having an issue with the webpack dev server. When I run it with

gradlew run --continuous

, it seems to work as it should - I can make a code change, and then refresh the browser and see that change. However - if there's a compiler error at any point, it never recovers. So if I make a code change that's bogus (but don't realize it) and then save my changes, I have to kill the dev server and start over.

Hi everyone, I'm having issues with

kotlin.Number

:

Cannot read property 'prototype' of undefined

This is the code (generated JS):

BigDecimal.prototype = Object.create(Number_0.prototype)

And

Number_0

:

var Number_0 = Kotlin.kotlin.Number;

What's the best way to report a bug in the IR compiler backend? Is the exception stack trace enough to report to YT?

Why is "Both-mode" (https://blog.jetbrains.com/kotlin/2020/03/kotlin-1-4-m1-released/#both-mode) better then publishing two different versions of a library (e.g.

1.0.0

and

1.0.0-IR

) and just let users choose the one they want to use? In my opinion "both-mode" makes a lot of mess for a Kotlin/JS project (e.g. strange module names).

I'm struggling to find a good example of adding a

nodejs

target to my existing iOS/Android mpp setup and building a node package to use, the official docs don't seem to cover it, anyone have any links or pointers?

Same explanation is found here:https://github.com/JetBrains/kotlin-wrappers/issues/321 Hello all, anyone knows how to use

kotlin-styled

for animations?

keyframe animations

per se? When I do

animation(duration = 0.5.s) {
  0 {
    top = 50.vh
  }  

  00 {
    top = 0.vh  
  }
}

I get this in the console

react-dom.development.js:22665 Uncaught Error: It seems you are interpolating a keyframe declaration (lbMCNJ) into an untagged string. This was supported in styled-components v3, but is not longer supported in v4 as keyframes are now injected on-demand. Please wrap your string in the css\`\` helper which ensures the styles are injected correctly

Hey Folksً, I am stuck in a problem with Kotlin Multiplatform in Kotlin JS. Is anyone here who has worked on Kotlin JS or frontend dev in Kotlin?

Does anyone know how to implement a npm dev dependency? I know that in the legacy kotlin-frontend plugin you would use devDependency() but I don't know what it has changed to.

Hi here, question about code splitting. We have a scenario where we're loading some kotlin produced JS in a multiplatform project on machine that reloads the js file and has issues with super low memory. That's less important, just context. To that end having the giant JS file caused issues, so we broke it up by defining optimization.splitChunk values in our webpack file. All good, it's split up. But now I'm confused what the right way to enter into those files is. Normally I'd have an index.js file for exporting items and use that as my entry point, defining it as entry in the webpack and as main in the package.json, but we don't have that (or at least don't have that currently) with our Kotlin project. What is the correct setup for defining the entry in a chunked Kotlin project?

Getting the following error for all

org.w3c.dom

stdlib package when using BOTH compiler mode on

1.4.0-rc

. Does anyone know a fix?

Is anyone getting

Caused by: org.gradle.api.internal.tasks.DefaultTaskContainer$DuplicateTaskException: Cannot add task 'clean' as a task with that name already exists.

when specifying js flavour with 1.4.0-rc?

Any reason this happens on JS

suspend fun networkCall(): Int {
    delay(100)
    return Random.nextInt(0,100)
}

GlobalScope.launch {
    val s1 = async { networkCall() }
    val s2 = async { networkCall() }
    val s3 = async { networkCall() }
    val s4 = async { networkCall() }
    println("${s1.await()} ${s2.await()} ${s3.await()} ${s4.await()}")
}

output is always same of one value doesn't matter what network call returns

7 7 7 7

But this one is fine

GlobalScope.launch {
    val s1 = async { networkCall() }
    val s2 = async { networkCall() }
    val s3 = async { networkCall() }
    val s4 = async { networkCall() }

    val s1a = s1.await()
    val s2a = s2.await()
    val s3a = s3.await()
    val s4a = s4.await()
    
    println("$s1a $s2a $s3a $s4a")
}

First one works fine on JVM

Webcomponent's with kotlin/js is a pain. Mostly coz extending HTMLElement requires you to implement a bunch of methods, some of them from interfaces with external optional methods and implementation. Code looks like so and that is just boiler plate.

class TestElement : HTMLElement() {
    override val childElementCount: Int
        get() = TODO("Not yet implemented")
    override val children: HTMLCollection
        get() = TODO("Not yet implemented")
    override var contentEditable: String
        get() = TODO("Not yet implemented")
        set(value) {}
    override val isContentEditable: Boolean
        get() = TODO("Not yet implemented")
    override val style: CSSStyleDeclaration
        get() = TODO("Not yet implemented")

    override fun after(vararg nodes: dynamic) {
        TODO("Not yet implemented")
    }

    override fun append(vararg nodes: dynamic) {
        TODO("Not yet implemented")
    }

    override fun before(vararg nodes: dynamic) {
        TODO("Not yet implemented")
    }

    override fun convertPointFromNode(point: DOMPointInit, from: dynamic, options: ConvertCoordinateOptions): DOMPoint {
        TODO("Not yet implemented")
    }

    override fun convertQuadFromNode(quad: dynamic, from: dynamic, options: ConvertCoordinateOptions): DOMQuad {
        TODO("Not yet implemented")
    }

    override fun convertRectFromNode(rect: DOMRectReadOnly, from: dynamic, options: ConvertCoordinateOptions): DOMQuad {
        TODO("Not yet implemented")
    }

    override fun getBoxQuads(options: BoxQuadOptions): Array<DOMQuad> {
        TODO("Not yet implemented")
    }

    override fun prepend(vararg nodes: dynamic) {
        TODO("Not yet implemented")
    }

    override fun querySelector(selectors: String): Element? {
        TODO("Not yet implemented")
    }

    override fun querySelectorAll(selectors: String): NodeList {
        TODO("Not yet implemented")
    }

    override fun remove() {
        TODO("Not yet implemented")
    }

    override fun replaceWith(vararg nodes: dynamic) {
        TODO("Not yet implemented")
    }
}

Can't the HTMLElement class be declared to show that these methods are already implemented externally?

There are samples projects of new lib: Kotlinx-nodejs?

Hi I am having issues with the latest RC version and WebPack. I am receiving the error:

Uncaught ReferenceError: React is not defined

When I look at the package.json that is produced, the appropriate package "react" is present in there. And in the browser it "look like" the package is loaded there also. I'm also using the new IR compilation