https://kotlinlang.org logo
#multiplatform
Title
# multiplatform
s

Sourabh Rawat

10/22/2020, 8:44 AM
How to run a full stack web app in continuous mode ?
b

Big Chungus

10/22/2020, 8:46 AM
Start server, start client, start build with -t flag
s

Sourabh Rawat

10/22/2020, 9:12 AM
Ok so I ran in separate terminals
Copy code
./gradlew run
 ./gradlew frontendBrowserDevelopmentRun
 ./gradlew build -t
But if i change frontend code. the build job picks up the changes but when I refresh localhost:8080, no changes there
b

Big Chungus

10/22/2020, 9:19 AM
Are you sure your frontend is running on 8080?
I think the default is 8081
8080 might be served by your backend
s

Sourabh Rawat

10/22/2020, 9:21 AM
Right. But on 8081. I am getting
Cannot GET /
I see
Copy code
> Task :frontendBrowserDevelopmentRun
Module build failed (from C:/Users/srawa/Projects/thatnumbergame/build/js/node_modules/source-map-loader/dist/cjs.js):
Error: ENOENT: no such file or directory, open 'C:\Users\srawa\Projects\thatnumbergame\build\js\node_modules\webpack-dev-server\client\index.js'
Module build failed (from C:/Users/srawa/Projects/thatnumbergame/build/js/node_modules/source-map-loader/dist/cjs.js):
Error: ENOENT: no such file or directory, open 'C:\Users\srawa\Projects\thatnumbergame\build\js\node_modules\webpack-dev-server\client\index.js'
Module build failed (from C:/Users/srawa/Projects/thatnumbergame/build/js/node_modules/source-map-loader/dist/cjs.js):
Error: ENOENT: no such file or directory, open 'C:\Users\srawa\Projects\thatnumbergame\build\js\node_modules\webpack-dev-server\client\index.js'
in the front end job logs
b

Big Chungus

10/22/2020, 9:23 AM
Are you able to send your gradle config?
Got it. Try running only server and frontend, both with -t
I'm assuming you have ktor backend with hot reload
s

Sourabh Rawat

10/22/2020, 9:25 AM
I am not sure. I just auto generated the project structure from IDEA latest
b

Big Chungus

10/22/2020, 9:26 AM
Chech the dependencies and send me src/jvmMain/resources/application.conf if it's there
s

Sourabh Rawat

10/22/2020, 9:31 AM
b

Big Chungus

10/22/2020, 9:31 AM
Oooh, you don't even have a separate frontend 😄 it's a server rendered client 😄
Add me as contributor to that project and I'll set it up for you (mpetuska on github)
s

Sourabh Rawat

10/22/2020, 9:31 AM
right. This was generated by IDEA.
Added you
I think IDEA should generate README as well. 😂
b

Big Chungus

10/22/2020, 10:07 AM
Here you go
💯 1
Left a readme with brief summary
s

Sourabh Rawat

10/22/2020, 10:36 AM
thanks a lot. This looks better than the initial IDEA generated structure.
It seems like 2nd and 3rd steps sometimes works, sometimes doesnt. So when I change something in welcome.kt(React component), then it will rebuild, but on refreshing it won't show the update most of the time.
b

Big Chungus

10/22/2020, 10:51 AM
They're not as quick (depending how much you change)
s

Sourabh Rawat

10/22/2020, 10:51 AM
I am change a string from hello to hello2.....
b

Big Chungus

10/22/2020, 10:51 AM
Essentially you should run steps 1 and 2 or 3 (but not both)
s

Sourabh Rawat

10/22/2020, 10:52 AM
yups i tried with 1 and 2 or 1 and 3
b

Big Chungus

10/22/2020, 10:52 AM
because 2 clashes with 3
Odd
s

Sourabh Rawat

10/22/2020, 10:52 AM
have you tried in your local ?
b

Big Chungus

10/22/2020, 10:52 AM
I'd say run steps 1 & 3 and work on port 3000
Webpack will refresh the browser for you itself
I did, haven't had any issues
s

Sourabh Rawat

10/22/2020, 10:53 AM
hmm let me clean and run again 1 and 3
Nopes, isn't working. Terminal1: ran
./gradlew run
Terminal2: ran
./gradlew classes frontendBrowserDevelopmentRun -t
Changed hello to hello2 in welcome.kt No automatic refresh in browser On manual refresh no changes visible
Browser: Edge Chromimium OS: Windows10
b

Big Chungus

10/22/2020, 11:03 AM
Loks like webpack dev server is not being installed when running devServer...
Try ./gradlew build
And then steps 1 & 3
Just pushed an update (forgot a tiny piece of devServer config)
So after checkingOut do: 1. ./gradlew clean build 2. ./gradlew run 3. ./gradlew classes browserDevelopmentRun -t
s

Sourabh Rawat

10/22/2020, 11:10 AM
Right. I also was checking and found out that main.js in build/distrubition wasn't getting updated. It only updated after clean build
b

Big Chungus

10/22/2020, 11:11 AM
It doesn't need to
I've fixed it in my last commit
before only prodWebpack had a rule to rename output file, now all webpack tasks do
s

Sourabh Rawat

10/22/2020, 11:12 AM
So if I understand correctly, your fix will make all KotlinWebpack tasks change the outputFileName.
b

Big Chungus

10/22/2020, 11:12 AM
Yes, instead on only prod
Because index.html file expects the js file to be named main.js
s

Sourabh Rawat

10/22/2020, 11:15 AM
Wish there were docs on these stuff. Cuz the user has to configure them in the end...
b

Big Chungus

10/22/2020, 11:16 AM
Yep, took me ages and lots of help here from the community to figure all of this out
s

Sourabh Rawat

10/22/2020, 11:18 AM
It is working properly now. Thanks a lot!
b

Big Chungus

10/22/2020, 11:33 AM
I've pushed another commit to fix the final issue with using this only via steps 1 & 2. Also added shadow plugin to produce a fat (executable) jar for you
s

Sourabh Rawat

10/22/2020, 12:17 PM
1+2 does not work always. So ill probably use 1+3
b

Big Chungus

10/22/2020, 1:47 PM
Odd... Couldn break 1&2 on my end. Anyways, 1&3 is much faster reload