I have just started using Kotlin to produce Javascript, but cannot find a way to change the Javascript output directory.
This is specifically for a nodejs target, and using Gradle with Kotlin script.
There is an example given in the Kotlin docs for a browser target:
kotlin.target.browser {
distribution {
directory = File("$projectDir/output/")
}
}
but there does not seem to be an equivalent for kotlin.target.nodejs
This is now easy (Kotlin 1.40):
https://kotlinlang.org/docs/reference/js-project-setup.html#distribution-target-directory
kotlin {
js {
browser {
distribution {
directory = File("$projectDir/output/")
}
}
binaries.executable()
// . . .
}
}
Unfortunately, there are no possibilities to do this with NodeJS. I created an issue - https://youtrack.jetbrains.com/issue/KT-40416.
Related
I have an openapi generator plugin in my Kotlin project.
id("org.openapi.generator") version ("5.2.1")
...
tasks {
named<Test>("test") {
useJUnitPlatform()
dependsOn("openApiValidate")
}
named<org.openapitools.generator.gradle.plugin.tasks.ValidateTask>("openApiValidate") {
inputSpec.value("$rootDir/openapi.yml") // any openapi.yml can be provided
recommend.value(true)
}
named<org.openapitools.generator.gradle.plugin.tasks.GenerateTask>("openApiGenerate") {
generatorName.value("kotlin")
configOptions.put("idea", "true")
packageName.value("com.creatiosion.spider")
inputSpec.value("$rootDir/openapi.yml") // any openapi.yml can be provided
}
}
So there is a generated Api and an openapi.yml that the is generated from.
Is there a plugin to also generate a swagger html?
I need sth like Swagger Editor but in my project https://editor.swagger.io/
I create a Gradle project with several sub-modules, and one module needs war plugin, I just want to customize the web app directory, but the code does not work:
apply {
plugin("war")
plugin("org.gretty")
}
// cannot work
tasks.getByName("war") {
from("src/main/webfiles")
}
// cannot work either
tasks.war {
webAppDirName = "src/main/webfiles"
}
//... other code
This is how I code in the sub-project subproject.gradle.kts file, How to solve this? Thanks for any help!
Solved with the code:
configure<WarPluginConvention>{
webAppDirName = "src/main/webfiles"
}
First of all, please note that I'm not expecting why do you want to obfuscate library comments. This is a genuine problem I'm asking about.
I have been having an issue dealing with R8/obfuscation with an Android library written in Kotlin.
I've a public API method which is annotated with #JvmStatic and that method takes a Lambda as parameter.
For example, take a look at code below,
typealias MyLambdaCallback = (String, Map<String, Any>) -> Unit
#Keep
object MyApi {
private var callback: MyLambdaCallback? = null
#JvmStatic
fun setCallback(callback: MyLambdaCallback) {
this.callback = callback
}
}
I have added #Jvmstatic so that Java calling code can call the method statically rather than doing MyApi.INSTANCE.setCallback()
When I release the library without minification, everything is fine and calling code from both Java and Kotlin is written as expected.
But now I want to release the library while turning on minification.
That creates an issue.
Here is the error
java.lang.IncompatibleClassChangeError: The method 'void setCallback(kotlin.jvm.functions.Function2)' was expected to be of type virtual but instead was found to be of type static (declaration of 'com.demo.basic.Application' appears in /data/app/com.demo.basic-_0uJXPbtfs3UZ2Rp2h-RdQ==/base.apk!classes2.dex)
Am I making a mistake somewhere or this is expected as some kind of limitation ?
What did I Try ?
Removing #Jvmstatic resolves the issue but it created ugly Java calling code
Kept #Jvmstatic but removed Lambda converting Lambda into an interface with one method and everything is working fine. Unfortunately SAM for Kotlin classes is not there yet, so calling Kotlin code looks ugly.
This is tracked on the R8 issue tracker http://issuetracker.google.com/158393309 which has more details.
The short story is that this has been fixed in R8 version 2.1.35, which can be used by making the following changes to the top level build.gradle file:
repositories {
maven {
url 'https://storage.googleapis.com/r8-releases/raw'
}
}
dependencies {
classpath 'com.android.tools:r8:2.1.35' // Must be before the Gradle Plugin for Android.
classpath 'com.android.tools.build:gradle:X.Y.Z' // Your current AGP version.
}
R8 team has fixed this issue along with related issue b/158400283 in R8 version 2.1.42
Fix should already be available in Android Studio 4.1 beta or higher, but if you're using stable Android Studio 4.0 then add following to your top-level build.gradle file:
buildscript {
repositories {
maven {
url 'https://storage.googleapis.com/r8-releases/raw'
}
}
dependencies {
classpath 'com.android.tools:r8:2.1.42' // Must be before the Gradle Plugin for Android.
classpath 'com.android.tools.build:gradle:X.Y.Z' // Your current AGP version.
}
}
My project structure is as follows:
src
..lib
....someLibrary.js
bundles.js:
"bundles": {
"dist/app-build": {
"includes": [
"[**/*.js]",
"**/*.html!text",
"**/*.css!text"
],
"options": {
"sourceMaps": 'inline'
"inject": true,
"minify": true,
"depCache": true,
"rev": true
}
},
The project builds fine, but when I check app-build.js I don't find a definition for lib/someLibrary.js. I am using typescript for my own project so I assume this has something to do with that, how can I mix regular js files and output from my transpiled TS files into the same app-build bundle?
Update
So I tried to split the 'build-system' gulp task into two tasks: 'build-typescript' which is the same as 'build-system' was before, then I created 'build-libs' which looks like so:
gulp.task('build-libs', function() {
return gulp.src(paths.root + '**/*.js')
.pipe(plumber({errorHandler: notify.onError('Error: <%= error.message %>')}))
.pipe(changed(paths.output, {extension: '.js'}))
.pipe(sourcemaps.write('.', { includeContent: false, sourceRoot: '/src' }).on('error', gutil.log))
.pipe(gulp.dest(paths.output));
});
I then added to my dist/app-build bundle config: "lib/someLibrary.min.js"
And now my app-build.js does have the library defined, however when I try to use the library in one of my views using:
<require from="lib/someLibrary.min.js">
I get an error:
Failed to load resource: the server responded with a status of 404 (Static File '/dist/lib/someLibrary.min.html' not found)
What?!?? Why is it looking for html when nowhere is html ever involved in this whole scenario? Why is something that should be easy this hard?
Update2
So apparently 'require' does not work with javascript files. I changed to use the 'script' tag, however it seems these get stripped out when rendered by Aurelia. I am at a loss as to how to get Aurelia to do what I want it to.
Ok so after much frustration and disbelief at how hard something so simple could be, in addition to the changes to the build tasks mentioned above (which includes the javascript library file that has no npm/jspm package into the app-bundle) I created a modified version of this solution which looks as follows:
import { bindable, bindingMode, customElement, noView } from 'aurelia-framework';
#noView()
#customElement('scriptinjector')
export class ScriptInjector {
#bindable public url;
#bindable public isLocal;
#bindable public isAsync;
#bindable({ defaultBindingMode: bindingMode.oneWay }) protected scripttag;
public attached() {
if (this.url) {
this.scripttag = document.createElement('script');
if (this.isAsync) {
this.scripttag.async = true;
}
if (this.isLocal) {
const code = 'System.import(\'' + this.url + '\').then(null, console.error.bind(console));';
this.scripttag.text = code;
} else {
this.scripttag.setAttribute('src', this.url);
}
document.body.appendChild(this.scripttag);
}
}
public detached() {
if (this.scripttag) {
this.scripttag.remove();
}
}
}
To use it, simply add the following tag to the view where you want the script library to be used as follows:
<scriptinjector url="lib/bootstrap-toc.js" is-local.bind='true'></scriptinjector>
This will keep the original scriptinjector functionality which allows you to add remote 3rd party libraries to your Aurelia app but it will also allow you to load any local 3rd party libraries that you have bundled with your app.
Hope this helps someone.
I'm using SeedStack to create a web application. In order to do that, I use W20 to develop my frontend. I need specific JavaScript libraries into that project. How can I inject an external javascript library into it ? I want to use Chart.js http://www.chartjs.org/ to visualize data into charts. To do that, I suppose that I have to inject ChartJS as a dependency module in Angular.
Thank you for your help.
Before getting to the specific answer, please note that SeedStack already has an add-on for charts. As for integrating a library with W20, you have two main things to do:
Configure RequireJS to load the JS file and be able to inject it as a dependency.
Integrate the library with the AngularJS framework, which is often done by writing some directive.
Fortunately for you, Angular directives are already available for Chart.js, thanks to the angular-chart.js library. You just need to configure RequireJS to load it. Add a requireConfig section to the manifest of one of your fragments:
{
"id": "my-fragment",
...
"requireConfig": {
"paths": {
"{angular-chart.js}": "${components-path:bower_components}/angular-chart.js/dist",
"{chart.js}": "${components-path:bower_components}/chart.js/dist"
},
"map": {
"{angular-chart.js}/angular-chart": {
"angular": "{angular}/angular",
"chart": "{chart.js}/Chart"
}
}
}
}
The paths section declares locations of the two Chart.js libraries. Note that we use a variable named components-path with a default value of bower_components here. This is useful when using the W20 bridge add-on.
The map section declares a mapping between the expected and the real paths for dependencies of angular-chart.js.
You can then use the angular-chart.js library according to its documentation:
define([
'{angular}/angular',
'{angular-chart.js}/angular-chart',
], function(angular) {
var module = angular.module('myModule', ['ngResource', 'chart.js']);
module.controller('ContentController', [ '$scope', function($scope) {
// your JS code here
// (with your markup in a corresponding angular template)
}]);
});