I have a old Project with an SPS and a UIBilder. I get some data from the SPS and with the UIBilder I show some values on a HTML page. Now I get a new pc and I install Node-Red and the needed nodes in a newer version. Now I have the problem, that the UIBilder -Node is not connected and only “node inizialased”. I download an UIBilder testproject. First I delete all code from the testproject and replace the code with my own Code. After that, my code works fine but only with one row from the testproject:
<pre id="msg" class="syntax-highlight">Waiting for a message from Node-RED</pre>
Without this row the UIBilder will not work. But I don*t know why. Does anybody have an idea?
Assuming that you migrated the uibuilder folders to your new device. Without a doubt, your issue comes from the fact that you were using an old version of uibuilder before and now you are using the current version.
Depending on what version of uibuilder you used to have, there have been a number of major version changes which indicate breaking changes along the way.
If you want to use the current version. Start by opening any uibuilder nodes in the editor, correcting any errors and re-deploying.
After that, you will need to review your front-end code. If you can share it here, I can help with the changes. Otherwise, they are all documented in the various changelogs.
Do you have the right version of Vue installed? To use with bootstrap-vue, you need Vue v2 not v3. Vue made the change to v3 a while back - far too early in my view as many packages aren't ready and migration can be complex.
I have the version 3.2.7. I made a npm uninstall vue (and bootstrap.vue). But the folder was not deleted. I delete the two folders "vue" and "bootstrap" by the hand. Then I made a npm install vue@2 (and bootsrap-vue@2), but no folders appears.
Does the uibuilder node's library tab show that you have the correct versions installed? If so, do a ctrl-f5 to force reload your ui and see if you are still getting the same errors.
If so, go to the networks tab and find out for each 404 line what it is trying to load.
Also, please share the content of your main index.html file so that I can check it is correct.
The folder in
C:\Users\User-Name.node-red\node_modules
After I install the vue version 3 in the command line (not under UIBuilder libaries), the folder will be created in the "node_modules" folder. After I uninstall the vue in the command line, the folder was not deleted.
uibuilder packages are not install there. That is for Node-RED nodes. By default, uibuilder packages are installed by the uibuilder library manager in C:\Users\User-Name\.node-red\uibuilder\node_modules. This ensures that there are no clashes with Node-RED itself. uibuilder packages used to go into the node-red folder but that was starting to cause issues which is why I moved them. It was one of the breaking changes I talked about.
You can use uibuilder's library manager to remove packages as well as add them. Rather like node-red's package manager menu. That avoids any confusion.
