https://kotlinlang.org logo
Join the conversationJoin Slack
Channels
100daysofcode
100daysofkotlin
100daysofkotlin-2021
advent-of-code
aem
ai
alexa
algeria
algolialibraries
amsterdam
android
android-architecture
android-databinding
android-studio
androidgithubprojects
androidthings
androidx
androidx-xprocessing
anime
anko
announcements
apollo-kotlin
appintro
arabic
argentina
arkenv
arksemdevteam
armenia
arrow
arrow-contributors
arrow-meta
ass
atlanta
atm17
atrium
austin
australia
austria
awesome-kotlin
ballast
bangladesh
barcelona
bayarea
bazel
beepiz-libraries
belgium
berlin
big-data
books
boston
brazil
brikk
budapest
build
build-tools
bulgaria
bydgoszcz
cambodia
canada
carrat
carrat-dev
carrat-feed
chicago
chile
china
chucker
cincinnati-user-group
cli
clikt
cloudfoundry
cn
cobalt
code-coverage
codeforces
codemash-precompiler
codereview
codingame
codingconventions
coimbatore
collaborations
colombia
colorado
communities
competitive-programming
competitivecoding
compiler
compose
compose-android
compose-desktop
compose-hiring
compose-ios
compose-mp
compose-ui-showcase
compose-wear
compose-web
connect-audit-events
corda
cork
coroutines
couchbase
coursera
croatia
cryptography
cscenter-course-2016
cucumber-bdd
cyprus
czech
dagger
data2viz
databinding
datascience
dckotlin
debugging
decompose
decouple
denmark
deprecated
detekt
detekt-hint
dev-core
dfw
docs-revamped
dokka
domain-driven-design
doodle
dsl
dublin
dutch
eap
eclipse
ecuador
edinburgh
education
effective-kotlin
effectivekotlin
emacs
embedded-kotlin
estatik
event21-community-content
events
exposed
failgood
fb-internal-demo
feed
firebase
flow
fluid-libraries
forkhandles
forum
fosdem
fp-in-kotlin
framework-elide
freenode
french
fritz2
fuchsia
functional
funktionale
gamedev
ge-kotlin
general-advice
georgia
geospatial
german-lang
getting-started
github-workflows-kt
glance
godot-kotlin
google-io
gradle
graphic
graphkool
graphql
graphql-kotlin
graviton-browser
greece
grpc
gsoc
gui
hackathons
hacktoberfest
hamburg
hamkrest
helios
helsinki
hexagon
hibernate
hikari-cp
hire-me
hiring
hongkong
hoplite
http4k
hungary
hyderabad
image-processing
india
indonesia
inkremental
intellij
intellij-plugins
intellij-tricks
internships
introduce-yourself
io
ios
iran
israel
istanbulcoders
italian
jackson-kotlin
jadx
japanese
jasync-sql
java-to-kotlin-refactoring
javadevelopers
javafx
javalin
javascript
jdbi
jhipster-kotlin
jobsworldwide
jpa
jshdq
juul-libraries
jvm-ir-backend-feedback
jxadapter
k2-early-adopters
kaal
kafka
kakao
kalasim
kapt
karachi
karg
karlsruhe
kash_shell
kaskade
kbuild
kdbc
kgen-doc-tools
kgraphql
kinta
klaxon
klock
kloudformation
kmdc
kmm-español
kmongo
knbt
knote
koalaql
koans
kobalt
kobweb
kodein
kodex
kohesive
koin
koin-dev
komapper
kondor-json
kong
kontent
kontributors
korau
korean
korge
korim
korio
korlibs
korte
kotest
kotest-contributors
kotless
kotlick
kotlin-asia
kotlin-beam
kotlin-by-example
kotlin-csv
kotlin-data-storage
kotlin-foundation
kotlin-fuel
kotlin-in-action
kotlin-inject
kotlin-latam
kotlin-logging
kotlin-multiplatform-contest
kotlin-mumbai
kotlin-native
kotlin-pakistan
kotlin-plugin
kotlin-pune
kotlin-roadmap
kotlin-samples
kotlin-sap
kotlin-serbia
kotlin-spark
kotlin-szeged
kotlin-website
kotlinacademy
kotlinbot
kotlinconf
kotlindl
kotlinforbeginners
kotlingforbeginners
kotlinlondon
kotlinmad
kotlinprogrammers
kotlinsu
kotlintest
kotlintest-devs
kotlintlv
kotlinultimatechallenge
kotlinx-datetime
kotlinx-files
kotlinx-html
kotrix
kotson
kovenant
kprompt
kraph
krawler
kroto-plus
ksp
ktcc
ktfmt
ktlint
ktor
ktp
kubed
kug-leads
kug-torino
kvision
kweb
lambdaworld_cadiz
lanark
language-evolution
language-proposals
latvia
leakcanary
leedskotlinusergroup
lets-have-fun
libgdx
libkgd
library-development
linkeddata
lithuania
london
losangeles
lottie
love
lychee
macedonia
machinelearningbawas
madrid
malaysia
mathematics
meetkotlin
memes
meta
metro-detroit
mexico
miami
micronaut
minnesota
minutest
mirror
mockk
moko
moldova
monsterpuzzle
montreal
moonbean
morocco
motionlayout
mpapt
mu
multiplatform
mumbai
munich
mvikotlin
mvrx
myndocs-oauth2-server
naming
navigation-architecture-component
nepal
new-mexico
new-zealand
newname
nigeria
nodejs
norway
npm-publish
nyc
oceania
ohio-kotlin-users
oldenburg
oolong
opensource
orbit-mvi
osgi
otpisani
package-search
pakistan
panamá
pattern-matching
pbandk
pdx
peru
philippines
phoenix
pinoy
pocketgitclient
polish
popkorn
portugal
practical-functional-programming
proguard
prozis-android-backup
pyhsikal
python
python-contributors
quasar
random
re
react
reaktive
realm
realworldkotlin
reductor
reduks
redux
redux-kotlin
refactoring-to-kotlin
reflect
refreshversions
reports
result
rethink
revolver
rhein-main
rocksdb
romania
room
rpi-pico
rsocket
russian
russian_feed
russian-kotlinasfirst
rx
rxjava
san-diego
science
scotland
scrcast
scrimage
script
scripting
seattle
serialization
server
sg-user-group
singapore
skia-wasm-interop-temp
skrape-it
slovak
snake
sofl-user-group
southafrica
spacemacs
spain
spanish
speaking
spek
spin
splitties
spotify-mobius
spring
spring-security
squarelibraries
stackoverflow
stacks
stayhungrystayfoolish
stdlib
stlouis
strife-discord-lib
strikt
students
stuttgart
sudan
swagger-gradle-codegen
swarm
sweden
swing
swiss-user-group
switzerland
talking-kotlin
tallinn
tampa
teamcity
tegal
tempe
tensorflow
terminal
test
testing
testtestest
texas
tgbotapi
thailand
tornadofx
touchlab-tools
training
tricity-kotlin-user-group
trójmiasto
truth
tunisia
turkey
turkiye
twitter-feed
uae
udacityindia
uk
ukrainian
uniflow
unkonf
uruguay
utah
uuid
vancouver
vankotlin
vertx
videos
vienna
vietnam
vim
vkug
vuejs
web-mpp
webassembly
webrtc
wimix_sentry
wwdc
zircon
Powered by Linen
javascript
  • a

    andylamax

    08/25/2021, 1:16 PM
    Hello @Big Chungus, I have been battling with
    npm-publish
    with no avail. The plugin works well on my machine to publish on ithub packages. But fails on github ci. Have you tested it on CI? Is there an example?
    b
    r
    • 3
    • 76
  • a

    Ayfri

    08/25/2021, 3:55 PM
    Hi, what means this error ? I just tried to run my application
    t
    • 2
    • 7
  • r

    Richard Glen

    08/25/2021, 4:42 PM
    Hi. I'm using Kotlin/JS. Is there a way to set webpack version without using gradle's
    afterEvaluate
    ? I'm following a
    mentioned solution here
    . But I'm having an issue:
    • 1
    • 2
  • p

    Pitel

    08/26/2021, 7:32 AM
    How can I detect if I'm running in development (
    browserDevelopmentRun
    ) or production (
    assemble
    )?
    t
    • 2
    • 2
  • r

    Richard Glen

    08/26/2021, 4:02 PM
    In a multiproject project setup like this one. Is it possible for project A to depend on project B and build project A without including the js source of project B? Say example, a host webpack instance contains some component and a container webpack instance lazy loads (via js import and react lazy) a component from that host. Im trying to setup a microfrontend project that uses webpack 5's Module Federation and while keeping a type safe solution. Any direction with this would be greatly appreciated.
    t
    m
    • 3
    • 6
  • a

    ankushg

    08/26/2021, 5:39 PM
    EDIT: moving go #gradle since the more I look at this, the less JS-specific it is
    r
    • 2
    • 1
  • p

    Pavel Matusevich

    08/26/2021, 8:54 PM
    Hello everyone. I'm trying to implement wrapper over Ring UI Loader component. There is prop with name 'data-test' (
    static propTypes = {/* ... */ 'data-test': PropTypes.string, /* ... */ };
    ) How can I implement this prop in Kotlin/JS (I've tried
    @JsName("data-test")
    , but it says "Name contains illegal chars that can't appear in JavaScript identifier")?
    a
    t
    • 3
    • 5
  • p

    Pitel

    08/27/2021, 10:57 AM
    Is there an easy way to create react element without rendering it?
    val p = p { +"Should not render!"}
    (but it renders)
    s
    t
    • 3
    • 2
  • r

    Robert Jaros

    08/27/2021, 12:04 PM
    Having fixed version of npm dependencies in the Kotlin gradle plugin seems to be generating errors over and over again. Webpack 5.38.1 hardcoded in Kotlin 1.5.30 seems to have major problems with data uris. Upgrading manually to 5.51.1 fixes at least some of these problems. At least after KT-48273 I know how to upgrade.
    t
    • 2
    • 1
  • j

    Jilles van Gurp

    08/27/2021, 6:41 PM
    I'm trying to integrate maplibre-gl in a kotlin-js project and I'm struggling a bit with adapting the broken type definitions generated by generateExternals. I have 3 variants of the same code that initializes the map. The only one that works is the one where everything happens in a
    js(...)
    call. I'm trying to figure out why. The other two fail with an "object is not iterable" somewhere deep in the maplibre libraries. It seems to expect a javascript object that is iterable and whatever kotlin-js does with this, seems to not meet the expectations when dealing these options. Also, the only way I can get the library to initialize is via index.html; if I load it via implementation(npm("..." )) instead I get a maplibre-gl not found error with the working variant and the same error for non-iterable objects with the other two. Here's my code. I would appreciate any suggestions for getting some working type definitions for this as messing with
    js()
    is a bit ugly. The init gets called after the dom tree with the container is created. Only variant 3 renders the map.
    external interface MapboxOptions {
        var container: String
        var style: String
        var center: Array<Double>
        var zoom: Int
    }
    
    external open class Map(options: dynamic)
    
    class MapManager() {
        var map: dynamic = null
        fun init() {
            // variant 1, fails with "Object is not Iterable" in map.js on the line that works with the options
    //        val options = object : MapboxOptions {
    //            override var container = "maplibre-container"
    //            override var style = "<https://demotiles.maplibre.org/style.json>"
    //            override var center = arrayOf(13.0, 52.0)
    //            override var zoom = 4
    //        }
    //        println(options)
    //        map = Map(options)
    
            // variant 2, same failure
    //        val options = js("""
    //            {
    //                container: "maplibre-container",
    //                style: "<https://demotiles.maplibre.org/style.json>",
    //                center: [13.0,52.0],
    //                zoom: 3,
    //            }
    //        """)
    //        map=Map(options)
    
            // variant 3, works?!?!
            map = js(
                """
                var map = new maplibregl.Map({
                    container: "maplibre-container",
                    style: "<https://demotiles.maplibre.org/style.json>",
                    center: [13.0,52.0],
                    zoom: 3,
                });
                console.log("created map ");
                console.log(map);
                return map;
                """
            )
    
            console.log(map)
            return map
        }
    }
    t
    • 2
    • 2
  • j

    Jeff Davidson

    08/28/2021, 7:11 PM
    maybe this is obvious, but since I didn't see it documented anywhere - is it expected that @JsExport doesn't work on
    internal
    objects/classes? I was able to access them from JS with the legacy compiler, but needed to remove
    internal
    to access them with IR
    t
    m
    • 3
    • 4
  • u

    UNuX

    08/30/2021, 8:29 AM
    Hello, What method/function should I use if I want to completely dump the current window/tab and load some other URL in its place instead? For example the user is on: somedomain.tld/redirectafterpress and I want them to be redirected to this url: somedomain.tld/some/other/path after pressing a button on the webpage
    r
    • 2
    • 1
  • a

    ankushg

    08/30/2021, 6:05 PM
    Getting a lot of
    Function "myfunction" is never used
    warnings on `@JsExport`ed objects. My whole reason to export the object is that I want
    myfunction
    to be called from JS and not Kotlin Any way to disable that warning specifically on methods/properties of exported declarations?
    t
    b
    • 3
    • 5
  • a

    Ayfri

    08/30/2021, 7:35 PM
    Hi, why the canvas API doesn't work with Kotlin ? I have this code, but nothing is drawn
    window.onload = {
    	val canvas = document.body!!.append.canvas {} as HTMLCanvasElement
    	val ctx = canvas.getContext("2d") as CanvasRenderingContext2D
    	ctx.fillStyle = "green"
    	ctx.fillRect(10.0, 10.0, 100.0, 100.0)
    }
    r
    t
    • 3
    • 6
  • m

    martmists

    08/31/2021, 12:06 PM
    Just started a kotlin full-stack project from IDEA; What gradle task do I run to make it build the entire project as one jar, and where should I put the assets and such?
    r
    • 2
    • 2
  • m

    martmists

    08/31/2021, 3:03 PM
    Execution failed for task ':jvmProcessResources'.
    > Entry server_style.css is a duplicate but no duplicate handling strategy has been set. Please refer to <https://docs.gradle.org/7.1/dsl/org.gradle.api.tasks.Copy.html#org.gradle.api.tasks.Copy:duplicatesStrategy> for details.
    I also get this while trying to run my project, it says server_style.css is duplicate but it's only in jvmMain/resources and not in jsMain/resources or commonMain/resources
    r
    • 2
    • 1
  • r

    Rob Murdock

    08/31/2021, 4:07 PM
    Running into another situation today where my kotlin js build is failing due to a change in an indirect javascript dependency (I think… old green builds now don’t work 😞 ). Has anybody got any lock-file-style solutions for this sort of thing? or any ideas?
    r
    • 2
    • 6
  • n

    Nikolai Sviridov

    09/01/2021, 12:59 PM
    Hi, trying to create wrapper for react-checkbox-tree (npm link). Got error
    Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
    
    Check the render method of `Router.Consumer`.
    More in thread.
    ✅ 1
    t
    • 2
    • 5
  • s

    Sebastian

    09/01/2021, 4:47 PM
    Hey peeps! I’m currently using a Kotlin Multiplatform project to export some backend logic to a JS application. We’ve recently started using
    Instant
    from the kotlinx-datetime package inside that project and now the exported JS package requires "@js-joda/core" to be present in order to function (even though the class using the Instant is not annotated with
    @JSExport
    ). Is anyone aware of a way to make the integration work without needing to add the @js-joda/core library to the JS project? 🤔 Update: Looks like there should be some way to configure the dependency "org.jetbrains.kotlinx:kotlinx-datetime:0.2.1" to not be used for the JS target. But even after reading the docs it’s not very clear to me how to achieve that.
    i
    • 2
    • 3
  • m

    martmists

    09/01/2021, 6:11 PM
    8:08:52 PM: Executing task 'browserDevelopmentRun --continuous'...
    
    > Task :wrapper
    
    Deprecated Gradle features were used in this build, making it incompatible with Gradle 8.0.
    
    You can use '--warning-mode all' to show the individual deprecation warnings and determine if they come from your own scripts or plugins.
    
    See <https://docs.gradle.org/7.1/userguide/command_line_interface.html#sec:command_line_warnings>
    
    BUILD SUCCESSFUL in 1s
    1 actionable task: 1 executed
    
    Exiting continuous build as no executed tasks declared file system inputs.
    > Task :kotlinNodeJsSetup SKIPPED
    > Task :kotlinNpmCachesSetup
    > Task :packageJson UP-TO-DATE
    > Task :rootPackageJson UP-TO-DATE
    > Task :kotlinNpmInstall UP-TO-DATE
    > Task :generateExternalsIntegrated SKIPPED
    > Task :downloadSass UP-TO-DATE
    > Task :installSass UP-TO-DATE
    > Task :compileSass UP-TO-DATE
    > Task :sassCopy UP-TO-DATE
    > Task :compileKotlinJs UP-TO-DATE
    > Task :processResources UP-TO-DATE
    > Task :mainClasses UP-TO-DATE
    > Task :compileDevelopmentExecutableKotlinJs UP-TO-DATE
    > Task :developmentExecutableCompileSync UP-TO-DATE
    > Task :browserDevelopmentRun
    
    Deprecated Gradle features were used in this build, making it incompatible with Gradle 8.0.
    
    You can use '--warning-mode all' to show the individual deprecation warnings and determine if they come from your own scripts or plugins.
    
    See <https://docs.gradle.org/7.1/userguide/command_line_interface.html#sec:command_line_warnings>
    
    BUILD SUCCESSFUL in 4s
    13 actionable tasks: 2 executed, 11 up-to-date
    
    Waiting for changes to input files of tasks... (ctrl-d to exit)
    
    Deprecated Gradle features were used in this build, making it incompatible with Gradle 8.0.
    
    You can use '--warning-mode all' to show the individual deprecation warnings and determine if they come from your own scripts or plugins.
    
    See <https://docs.gradle.org/7.1/userguide/command_line_interface.html#sec:command_line_warnings>
    
    FAILURE: Build failed with an exception.
    
    * What went wrong:
    java.nio.file.AccessDeniedException: /var/lib/docker
    > /var/lib/docker
    
    * Try:
    Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
    
    * Get more help at <https://help.gradle.org>
    
    BUILD FAILED in 4s
    8:08:59 PM: Task execution finished 'browserDevelopmentRun --continuous'.
    How do I solve this error? I'm just trying to run my react app in development mode 😕
    t
    p
    • 3
    • 3
  • p

    Pitel

    09/02/2021, 7:22 AM
    var data by useState<List<MessageTemplateDto>>()
    
    useEffectOnce {
      MainScope().launch{
        data = someSuspendingFetch()
        console.log(data) // undefined?!
      }
    }
    
    makeTable(data) // renders table with data
    WTF?! Why is
    data
    right after assigning it
    someSuspendingFetch()
    undefined
    , and yet it renders table with them.
    t
    • 2
    • 3
  • p

    Pitel

    09/02/2021, 9:29 AM
    https://github.com/JetBrains/kotlin-wrappers/pull/565/files#diff-71d8431fc71894a3148c8b3b77a8d760b632ce0d374fd50f84bc39c2fbfcbc27L247 how can I access
    ref
    in
    RBuilder
    after this change?!
    t
    • 2
    • 6
  • n

    Nikolai Sviridov

    09/02/2021, 5:28 PM
    Hi, created wrappers for react-checkbox-tree and react-folder-tree and this is the first time when I encountered such strange behavior with wrappers. More in thread.
    t
    • 2
    • 5
  • a

    andylamax

    09/03/2021, 10:54 AM
    Hello every one, I am getting that webpack error again. Any one else experiencing this?
    rootProject.plugins.withType(org.jetbrains.kotlin.gradle.targets.js.nodejs.NodeJsRootPlugin::class.java) {
        rootProject.the<org.jetbrains.kotlin.gradle.targets.js.nodejs.NodeJsRootExtension>().versions.webpackDevServer.version =
            "4.0.0-rc.0" // tried "4.0.0", "4.1.0"
    }
    Nothing works
    r
    t
    • 3
    • 20
  • n

    Nikolai Sviridov

    09/03/2021, 11:14 AM
    Hi, how to recreate such code in Kotlin/React?
    ...
    import TreeView from '@material-ui/lab/TreeView';
    import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
    ...
    <TreeView
          defaultCollapseIcon={<ExpandMoreIcon />}
        >
    ...
    Wrappers for
    TreeView
    and
    ExpandMoreIcon
    exists, but how to recreate
    defaultCollapseIcon={<ExpandMoreIcon />}
    ?
    ✅ 1
    b
    a
    t
    • 4
    • 11
  • j

    Joffrey

    09/04/2021, 5:08 PM
    Hey guys, does anyone know how to check in Kotlin whether I'm running in NodeJS or in a browser? I tried to test the presence of
    window
    but it's always non-null in Kotlin, it just fails at runtime on NodeJS.
    d
    h
    • 3
    • 6
  • a

    andylamax

    09/05/2021, 6:47 AM
    Holla, I wanna ask something regarding https://youtrack.jetbrains.com/issue/KT-47038. Its an issue about allowing The kotlin/JS compiler to target multiple platforms just like how kotlin/native does. Lately I have been supplying JS bundled libraries to users who are consuming it in react native, and I can tell that, react native is neither a browser environment nor a node environment, even more it tends to switch context when running on chrome debugger (browser) vs on mobile (JavaScriptCore). So having only (jsBrowser & jsNode) targets as suggested on the issue won't be targeting all potential targets. This made me look for other targets as well, I discovered something like jsdom which runs in node but tries to mimic the browser. There are also others like NativeScript e.t.c This made me ponder on the question, as to how many targets will suffice? Should we just have all of them? what could/would the compiler offer on such targets?? your thoughts on this?
    c
    j
    • 3
    • 2
  • d

    Dazai

    09/05/2021, 7:14 PM
    https://github.com/chiachat/kbls
    t
    c
    a
    • 4
    • 7
  • u

    uplink

    09/06/2021, 11:39 PM
    Does someone know how to get rid of the Webpack error that comes up with a new KotlinJs React project? Kinda discouraging learning with this error always showing up.
    kotlinjs-webpack-error
    b
    r
    • 3
    • 5
  • s

    Su5eD

    09/07/2021, 12:38 PM
    Hi, can I change the version of nodejs used by the gradle plugin?
    h
    t
    • 3
    • 2
Powered by Linen
Title
s

Su5eD

09/07/2021, 12:38 PM
Hi, can I change the version of nodejs used by the gradle plugin?
h

hfhbd

09/07/2021, 12:43 PM
just install it locally
t

turansky

09/07/2021, 4:37 PM
Yes, you can. Use
NodeExtension
for configuration
View count: 5