Skip to main content


Eclipse Community Forums
Forum Search:

Search      Help    Register    Login    Home
Home » Eclipse Projects » Eclipse Scout » Adding heatmap example to my project leads to empty page
Adding heatmap example to my project leads to empty page [message #1838408] Wed, 24 February 2021 12:21 Go to next message
Pr Nico is currently offline Pr NicoFriend
Messages: 21
Registered: February 2021
Junior Member
Hello, I am trying to import the heatmap example from bsi widget to my project, after copying everything, I try to run my webapp all run configuration.

And once I am in the client, I get the login page, which is fine, once logged, I end on an empty page, nothing is loaded, no error in chrome/eclipse.

(It looks like my dist folder is not fully created then, which may lead to this issue).

If I put these as comments in my index.js
//export {default as HeatmapField} from './heatmap/HeatmapField';
//export {default as HeatmapFieldAdapter} from './heatmap/HeatmapFieldAdapter';
//export {default as HeatmapFieldLayout} from './heatmap/HeatmapFieldLayout';
//export {default as simpleheat} from './heatmap/leaflet-heat';
Everything works the way it did before.

I have exactly the same behavior when I try to import chartjs to my project, yet I managed to import the custom tile feature.

My setup is the latest nodejs, scout 10.0.33

[Updated on: Wed, 24 February 2021 17:00]

Report message to a moderator

Re: Adding heatmap example to my project leads to empty page [message #1838423 is a reply to message #1838408] Wed, 24 February 2021 17:21 Go to previous messageGo to next message
Claudio Guglielmo is currently offline Claudio GuglielmoFriend
Messages: 259
Registered: March 2010
Senior Member
Hi

If the page stays empty and there is no error in the console, webpack probably waits for a file to be loaded.

Third party content (leaflet.js or chart.js in your case) is extracted into a vendors.js file. Have a look at the dist folder. If there is such a file you need to include it in your index.html. This should fix you issue.

Because this is indeed a very confusing behavior we recently added an alternative way to include the JavaScript code. Instead of adding the scripts individually you can use the new entrypoint keyword.

<scout:scripts entrypoint="yourentrypoint"/>

The entrypoints are defined in your webpack.config.js. The same applies for the stylesheets.

Even though it is actually a feature of Scout 11, we backported it to Scout 10, but I think your version is a little too old. You need to update to a newer Scout 10 version.

The archetype of Scout 11 will be using the new style:
https://git.eclipse.org/c/scout/org.eclipse.scout.sdk.git/tree/scout-helloworld-app/src/main/resources/archetype-resources/__rootArtifactId__.ui.html/src/main/resources/WebContent/index.html?h=releases%2F11.0

While the archetype of Scout 10 still uses the old style:
https://git.eclipse.org/c/scout/org.eclipse.scout.sdk.git/tree/scout-helloworld-app/src/main/resources/archetype-resources/__rootArtifactId__.ui.html/src/main/resources/WebContent/index.html?h=releases%2F10.0
Re: Adding heatmap example to my project leads to empty page [message #1838428 is a reply to message #1838423] Wed, 24 February 2021 18:26 Go to previous messageGo to next message
Pr Nico is currently offline Pr NicoFriend
Messages: 21
Registered: February 2021
Junior Member
Hello, thank you for this well explained answer.

I tried to add the vendors.js to my index.html and yes now my application is no longer empty.
How do I do to not have this line <scout:script src="vendors.js"/> in the index.html to disapear everytimes I rebuild the app?

I tried to get the latest scout eclipse from the download page and It looks like the version 10.0.42 still follows the old archetype

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>My Application</title>
<scout:include template="includes/head.html" />
<scout:stylesheet src="helloworld-theme.css" />
</head>
<body>
<scout:include template="includes/no-script.html" />
<div class="scout" data-partid="1"></div>
<scout:version/>
<scout:script src="jquery.js"/>
<scout:script src="eclipse-scout.js"/>
<scout:script src="helloworld.js"/>
</body>
</html>

I think I will wait for the new scout 11 to be released and then migrate my application

[Updated on: Thu, 25 February 2021 10:59]

Report message to a moderator

Re: Adding heatmap example to my project leads to empty page [message #1838434 is a reply to message #1838428] Wed, 24 February 2021 20:18 Go to previous messageGo to next message
Claudio Guglielmo is currently offline Claudio GuglielmoFriend
Messages: 259
Registered: March 2010
Senior Member
The script tag will not disappear, it was just not necessary until now because you have not used third party libs.

The Scout 10 archetype still uses the old pattern but you could use the new style anyway. But maybe you are right, doing it with the Scout 11 update is a good idea, the release is near
Re: Adding heatmap example to my project leads to empty page [message #1838443 is a reply to message #1838434] Thu, 25 February 2021 07:21 Go to previous messageGo to next message
Andre Wegmueller is currently offline Andre WegmuellerFriend
Messages: 204
Registered: September 2012
Location: Baden-Dättwil, Switzerla...
Senior Member
Hi Nico

> How do I do to not have this line <scout:script src="vendors.js"/> in the index.html to disappear everytimes I rebuild the app?

Could you verify where the index.html, where you've added the line above, is located? Is it the file in /src/main/resources/WebContent (which is the source) or have you accidentally changed the file in the target/dist/res folder? If the latter is the case, this would explain, why your changes disappear every time you build.

Cheers
André


Eclipse Scout Homepage | Documentation | GitHub
Re: Adding heatmap example to my project leads to empty page [message #1838460 is a reply to message #1838443] Thu, 25 February 2021 13:46 Go to previous message
Pr Nico is currently offline Pr NicoFriend
Messages: 21
Registered: February 2021
Junior Member
Hello Andre,

Yes I realised I changed the wrong file, modifying WebContent/index.html works perfectly. Thank you
Previous Topic:Add error message into LoginDialog/LoginForm
Next Topic:Error while importing Scout Demo Contact App
Goto Forum:
  


Current Time: Fri Nov 08 02:52:18 GMT 2024

Powered by FUDForum. Page generated in 0.06211 seconds
.:: Contact :: Home ::.

Powered by: FUDforum 3.0.2.
Copyright ©2001-2010 FUDforum Bulletin Board Software

Back to the top