I am confused: In the section on calling Kotlin fr...

# javascript

[corneil]

I am confused: In the section on calling Kotlin from JavaScript the following line: "_So if you name your module as myModule, all declarations are available to JavaScript via myModule object_"
Where in Kotlin do I determine the module name? In Kotlin I can create package or class or object. Which becomes the module?

[Svyatoslav Kuzmich [JB]]

Module name is determined by the name of the .js file produced.

In Gradle it can be specified as

kotlinOptions { 
  outputFile = "${buildDir}/classes/main/yourModuleName.js"
}

or using CLI -output yourModuleName.js argument.

[corneil]

Thanks I will try.

[corneil]

if I use the name of the project as the module name I get name is not defined.
When I choose an outputFile:

Built at: 02/08/2020 7:00:30 AM
       Asset    Size  Chunks             Chunk Names
  kfsmweb.js  48 KiB    main  [emitted]  main
  Entrypoint main = kfsmweb.js
  [0] multi C:/Users/corne/workspaces/open-jumpco/kfsm-webjs/build/classes/main/webModule.js 28 bytes {main} [built]
  [../../../classes/main/webModule.js] C:/Users/corne/workspaces/open-jumpco/kfsm-webjs/build/classes/main/webModule.js 11.4 KiB {main} [built]

[corneil]

I'm still not having success after trying various combinations. Maybe you can spot the problem?
https://github.com/open-jumpco/kfsm-webjs

[Ilya Goncharov [JB]]

It is about what webpack does. This tool by default bundle your code with all dependencies (including Kotlin/JS modules and NPM modules). And by default webpack produce just script, not JS library
Good news are that you can configure it. You should create folder webpack.config.d and create js file with any name, and content which configure library mode for webpack (https://webpack.js.org/configuration/output/#outputlibrary)

config.output = config.output || {} // just in case where config.output is undefined
config.output.library = "libraryName" // should be valid js variable name

It forces webpack to put all your export to js variable libraryName

You can additionally set js module system (https://webpack.js.org/configuration/output/#outputlibrarytarget) if you want
You can find example here
https://github.com/ilgonmic/kotlinjs-multi-module/blob/master/app/webpack.config.d/library.js

[corneil]

Hi @Ilya Goncharov [JB] I added library.js but I still end up with:
(index):31 Uncaught ReferenceError: kfsmweb is notd efined
I have updated my project on github. If you can spot anything wrong: https://github.com/open-jumpco/kfsm-webjs
The JS is in https://github.com/open-jumpco/kfsm-webjs/blob/master/src/main/resources/index.html

[Ilya Goncharov [JB]]

Hi! You include your script with type=module, which is valid only with es-modules
Try to remove this type, and it should help

[Ilya Goncharov [JB]]

With libraryTarget you declare, that output file will be in umd format, not es-module . Kotlin/JS can’t produce es modules yet, and webpack can’t too.

[corneil]

I've removed the module from script and now I can create the classes. Interesting is that method names are "mangled" I had to add @JsName before the methods.

[Ilya Goncharov [JB]]

Yes, if method have parameters, it will be mangled. In new compiler, we introduce annotation with explicit export, where you can annotate declaration which you want to export explicitly

[corneil]

Is that in 1.4?

[Ilya Goncharov [JB]]

Yes, in 1.4 there will be on choice 2 compilers for Kotlin/JS

[corneil]

Aha.

[corneil]

@JsName is helping now

[Ilya Goncharov [JB]]

Btw, since 1.3.70, library.js will be redundant, because this settings will be available by default
Value of library will be name of your module, but of course you can change it (as a libraryTarget if you want)

[corneil]

Great to know.