20

I recently started to have a look at Kotlin and managed to create my first JVM applications. It's so cool to have a single language that compiles both to Java and JS. So, now I started playing with Kotlin2js and tried to understand the Javascript interoperability, and the possibilities to use JS frameworks like jQuery.

I found a couple of blog posts and examples: http://blog.jetbrains.com/kotlin/2013/10/writing-kotlin-in-the-browser/ http://blog.jetbrains.com/kotlin/2014/12/javascript-interop/ https://github.com/JetBrains/kotlin/blob/master/libraries/tools/kotlin-gradle-plugin/src/test/resources/testProject/kotlin2JsProject/mainProject/src/main/kotlin/example/main.kt

Is there a documentation of the Kotlin JS library? It's not yet mentioned at http://kotlinlang.org/api/latest/jvm/stdlib/index.html

I first compiled a simple sample app which used import kotlin.browser.* with gradle as build system which (finally and with some help here worked, thanks again!). Than I imported the project into IDEA and suddenly it didn't compile anymore, I had to change the import to import js.dom.html.*. So, I guess it uses a different version of library? (And IDEA added apply plugin: 'kotlin' to my build.gradle in addition to kotlin2js and I guess this doesn't work.)

IDEA copied kotlin-jslib.jar to lib which says it's "Implementation-Version: 0.7.270" in its Manifest. For the compilation with gradle I used kotlin 1.0.1-1 and I'm pretty sure that I also selected this version in IDEA when creating the project.

So, what are the best sources of information to understand Kotlin2js and the Kotlin-js-lib? Especially the Javascript interoperability, how to use Frameworks like jQuery (it seems that there is jQuery support in the kotlin-js-lib), but also, how I can use other frameworks that don't come with Kotlin support yet. I understood that Kotlin has the dynamic keyword, and http://blog.jetbrains.com/kotlin/2014/12/javascript-interop/ mentioned noImpl which lead to a compile error when I tried to use it. Maybe the best way for now is to look at the Kotlin sources?

Well, this is a rather long and unstructured question covering several aspects, but that's my current state of learning Kotlin :-) And maybe others experience the same problem.

Community
  • 1
  • 1
Peter T.
  • 2,927
  • 5
  • 33
  • 40
  • 11
    The short answer is that you should wait until at least Kotlin 1.1. The work on the Kotlin JS backend was suspended before 1.0 and is being resumed now. If you try to use the JS support in its current state, you may manage to get something running, but you'll encounter many problems. Once the JS support is more complete, there will be much better docs, IDE support and everything else you might need. – yole Mar 28 '16 at 07:15
  • Alright, than I guess I'll wait and stick to the JVM backend for now. Thanks! – Peter T. Mar 28 '16 at 07:40
  • 1
    Kotlin 1.1 is announced to offer full support of compilation to JavaScript https://blog.jetbrains.com/kotlin/2017/01/kotlin-1-1-beta-is-here – Peter T. Jan 30 '17 at 17:26
  • 2
    It's here! http://kotlinlang.org/docs/reference/js-overview.html. There is also a library for integration with React being developed by the Kotlin team that will be open sourced soon. – maxmil Mar 24 '17 at 07:10
  • Please note that asking for external resources is off-topic for Stack Overflow. See [off-topic](http://stackoverflow.com/help/on-topic): *Questions asking us to recommend or find a tool, library or favorite off-site resource are off-topic for Stack Overflow as they tend to attract opinionated answers and spam.* – Patrick Hund May 05 '17 at 20:08
  • Thanks Patrick for your hint. However, the article you're referencing continues with "Instead, describe the problem and what has been done so far to solve it.". Well, I guess that's what I did ;-) – Peter T. May 08 '17 at 14:27

3 Answers3

1

if you're interested to learn about using Kotlin in Node.js app, I've put together a starter project that running a node.js server written in Kotlin. https://github.com/techprd/kotlin_node_js_seed

The aim of this project is to write a full stack web application written entirely with Kotlin JS

let me know what you guys think about this...

1

Meanwhile Kotlin/JS is available in version 1.2 and there is an introduction, tutorial and reference on the official website.

Andi
  • 3,234
  • 4
  • 32
  • 37
0

Using the pom below:

<?xml version="1.0" encoding="UTF-8"?>
<project
        xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"
        xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">

    <modelVersion>4.0.0</modelVersion>

    <groupId>com.example.kotlin</groupId>
    <artifactId>kotlin-js</artifactId>
    <version>1.0-SNAPSHOT</version>
    <packaging>pom</packaging>    
    <properties>
        <kotlin.version>1.3.61</kotlin.version>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>

        <kotlin.compiler.languageVersion>1.3</kotlin.compiler.languageVersion>
        <kotlin.compiler.apiVersion>1.3</kotlin.compiler.apiVersion>

    </properties>

    <dependencies>
        <dependency>
            <groupId>org.jetbrains.kotlin</groupId>
            <artifactId>kotlin-stdlib-js</artifactId>
            <version>${kotlin.version}</version>
        </dependency>
    </dependencies>

    <build>
        <plugins>
            <plugin>
                <artifactId>kotlin-maven-plugin</artifactId>
                <groupId>org.jetbrains.kotlin</groupId>
                <version>${kotlin.version}</version>
                <configuration/>
                <executions>
                    <execution>
                            <id>compile</id>
                            <phase>compile</phase>
                            <goals>
                                <goal>js</goal>
                            </goals>                        
                            <configuration>
                                <sourceDirs>
                                  <sourceDir>${project.basedir}/src/main/kotlin</sourceDir>
                                </sourceDirs>
                                <moduleKind>umd</moduleKind>
                            </configuration>
                    </execution>
                </executions>
            </plugin>                                    
        </plugins>        
    </build>
</project>

Inside src/main/kotlin you can add Hello.kt containing a fun main(args : Array<String>){println("hello")}

then the following would print hello

mvn clean package
cd target
npm i kotlin
node js/kotlin-js.js

or you can add a non-main method and then use require() from other js code or add it to the browser using <script> (together with kotlin runtime).

Marinos An
  • 9,481
  • 6
  • 63
  • 96