JS library and NodeJS with Bootstrap 5

[Marzio]

I would like, if possible, a clarification for NodeJS Bootstrap5
I would like to understand how the js libraries are managed in Wappler, in which folders they must be placed and how they must be recalled in the pages.

1
In a page, needing to have jQuery Cnd instead of Slim, I tried to insert it with Add Framework, but I did not get results and I entered the URL addresses

2
On another page I added a library (select_editable.js) but it only works on local and not on remote

3
On the same page I converted a txt area to Summernote
but google dev reports me errors

It will probably be my fault, but I would like to understand where I am wrong
Thanks

[patrick]

Try moving the jQuery include up in the DOM, it is probably loaded to late. Seems that you use Summernote on the page which requires jQuery and is probably loaded before jQuery is loaded.

[Marzio]

I thought it was okay to put select_editable.js in this folder
To move it to the DOM as I have to do, I wouldn’t want to mess it up
And then how should it be recalled from a page inserted in view?

[Marzio]

As for Summernote, maybe it is not compatible with Bootstrap5?

[brad]

@George

Unfortunately Summernote for Bootstrap is not fully Bootstrap 5 compatible.

You can use the Summernote Lite version, which should work always.

From this thread:

Summernote component not found in Bootstrap 5

Adding the is="dmx-summernote" dmx-bind:toolbar="" to an already created textarea fixed the problem PS First create an empty summernote lite textarea so all relative files are included

[Marzio]

Thank You

[Marzio]

given the various problems that Bootstrap 5 can cause for the moment, is it possible to replace Bootstrap 4 to a nodejs project, without destroying or ruining what has been done?

[Marzio]

If I change from Bootstrap 5 to Bootstrap 4 in the project settings, and then check the actions and pages do I get a downgrade or cause disaster?
Anyone know how to answer me?

[Marzio]

Since no one answers and I need to continue I tried to do it alone, hoping for God
In the project setting I have varied from BS5 to BS4
In the Framework I have inserted BS4 local instead of BS5 and jQuery 3.5.1 local instead of the slim version
I updated the project folder and restarted Wappler, but nothing changes.
There is always BS5 and jQuery slim

[t11]

Hi.

Try the steps below (haven’t tried them but that’s what I would do)

1. Keep a copy of your project
2. Create a new wappler project and set bootstrap 4
3. Copy all the bootstrap 4 files from your new project to the one you want to downgrade
4. In project files change the links
5. Also check the .wappler/project.json file from your newly created project and the one you want to downgrade and make any changes needed.

Hope it helps.
Thank you!

[Marzio]

Thank you. I had already thought about this and will try. Maybe I can re-create the project and then import the pages and actions from the separate project.

[Marzio]

The problem is that now when I create a new nodeJS project, it configures it by default in Bootstrap 5, without offering me the choice. And if in the setting project I modify in Bootstrap 4, only Bootstrap5 remains in the public / Bootstrap folder

[Teodor]

Marzio, go to project options > frameworks and set Bootstrap 4 and jquery there and remove Bootstrap 5.
When you create new pages the Bootstrap 4 and jquery will be added on the pages. If local versions are selected in the project settings the files will be copied to the public folder.

[Marzio]

Ok Teodor
i have already done this for a nodejs project but then i encounter some file not found errors and i am trying to work around this Can I delete all the files in the dmx-app-connect folder, to have them reloaded in bs4?

[Teodor]

Sorry Marzio, i am not following.
What errors exactly did you have? Why delete the dmxAppConenct folder when you only want to change the Bootstrap version?

[Marzio]

I saw that some files in that folder were labeled bs5
I have deleted the tabel-generator and navigation and they have been recreated
I haven’t touched the others

[Teodor]

All the required files will be automatically added in the dmxAppConnect folder when you use the components on the page.

[Marzio]

OK now I try again and if I get errors I’ll post you a screenshot

[Marzio]

Here are the errors that appear in the console

[Teodor]

Well check if these files are uploaded to your server …