Help with directory locations in templates

General
1

Complete newbie to uibuilder here. I've followed the user installation guildeines and first steps. All I get are blank pages, with errors showing in this case vue.js not found. Looking at the generated index.html created and having installed vue and bootstrap-vue libraries in the uibuilder node, the relative URL's are completely wrong.

    <!-- #region Supporting Scripts. These MUST be in the right order. Note no leading / -->
    <script src="../uibuilder/vendor/socket.io/socket.io.js">/* REQUIRED: Socket.IO is loaded only once for all instances. Without this, you don't get a websocket connection */</script>
    <!-- Vendor Libraries - Load in the right order, use minified, production versions for speed -->
    <script src="../uibuilder/vendor/vue/dist/vue.min.js">/* prod version with component compiler */</script>
    <!-- <script src="../uibuilder/vendor/vue/dist/vue.js">/* dev version with component compiler */</script> -->
    <!-- <script src="../uibuilder/vendor/vue/dist/vue.runtime.min.js">/* prod version without component compiler */</script> -->
    <script src="../uibuilder/vendor/bootstrap-vue/dist/bootstrap-vue.min.js">/* remove 'min.' to use dev version */</script> <!--  -->

    <script src="./uibuilderfe.min.js">/* REQUIRED: remove 'min.' to use dev version */</script>
    <script src="./index.js">/* OPTIONAL: Put your custom code here */</script>
    <!-- #endregion -->

Is it normal to have to edit this to make things work to start off with? I find no mention of this step in the documentation and getting started information.

I am missing something fundamental. [I thought it was supposed to be easier than this :slight_smile: ]

What other information do I need to provide to help sort this out?

I am on the current highest release of all components, and I even reinstalled Node RED (for Raspberry PI) to make sure.

2

Hi Andro, the relative URL's are not wrong & you shouldn't need to edit anything to get the initial page showing.

It is! Honestly! (and that isn't an Elon Must "honest").

So, first question, are you using the default template?
image

It would appear not if you are using a VueJS template. That being the case, what version of VueJS do you have installed? To use the current Vue templates, you need to be using VueJS v2 since that is the only version that works with bootstrap-vue I'm afraid. This is on the Vue project for messing up their major releases. They forced the default install to v3 even though the majority of supporting libraries like bootstrap-vue don't yet support it - it is a big set of changes to switch over.

This is most likely your issue. But in case not ...

Second question: What errors do you get in your browser's dev console?

3

@TotallyInformation using no template worked fine. I removed the default v3 vue and installed vue@2.7.12 which is I think the highest release of vue 2, and all works just great/. A large thank you. is this mentioned somewhere? As a complete newbie to uibuilder this was not exactly obvious to me.

Thanks again!

4

It is mentioned throughout the Forum :slight_smile: I think it is also mentioned in the documentation but there is a lot of that now and my aging brain can't always remember I'm afraid.

1 Like
5

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.