Frameworks changing from CDN to Local

devisbal · June 15, 2018, 4:08am

OS info

Operating System : Windows 10.0.17134
Wappler Version : 1.0.3

Problem description

Template App Convert Bootstrap to Local

Steps to reproduce

New Proyect -> Select: Template -> App
Once index.html is loaded select Add Framework to change Bootstrap 4 to Local
Page does not work

Reazon: Proyect is using a different version and when this pass is done:
Head Update: Fixing external path from: https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css to bootstrap/4/css/bootstrap.min.css
The local version is 4.1.1 and not the one used: 4.1.0

Teodor · June 15, 2018, 5:30am

Hello,
What exactly do you mean by “page doesn’t work”?
What exactly isn’t working?

devisbal · June 15, 2018, 6:26am

Hello:

When applying the change on bootstrap to Local

Page changes from:

TO:

Head Update: Asset removed from head: https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css

Head Update: Head node changed successfully

Head Update: Asset add to head: js/jquery-3.3.1.slim.min.js

Update Head: Remove older jQuery: js/jquery-3.3.1.slim.min.js

Head Update: Head node changed successfully

Copy file jquery-3.3.1.slim.min.js

Head Update: Fixing external path from: https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css to bootstrap/4/css/bootstrap.min.css

Head Update: Asset add to head: bootstrap/4/css/font-awesome.min.css

Head Update: Asset add to head: bootstrap/4/js/popper.min.js

Head Update: Fixing external path from: https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js to bootstrap/4/js/bootstrap.min.js

Head Update: Head node changed successfully

Copy file bootstrap.min.css

Copy file font-awesome.min.css

Copy file popper.min.js

Copy file bootstrap.min.js

Also at the source end it’s bad:

Bad%20Code

And verifying each change I noted that the local copy of https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css it’s really version 4.1.1

Version

Teodor · June 15, 2018, 6:52am

I just tested locally the same case and it converts just perfectly.
There are no changes which break the layout between 4.0.1 and 4.1.1.

Can you try creating a new project and test again?

devisbal · June 15, 2018, 7:39am

I have done this several times. And the same result.
New Project. Different Directory.

Head Update: Asset removed from head: https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css
Head Update: Head node changed successfully
Head Update: Asset add to head: js/jquery-3.3.1.slim.min.js
Update Head: Remove older jQuery: js/jquery-3.3.1.slim.min.js
Head Update: Head node changed successfully
Copy file jquery-3.3.1.slim.min.js
Head Update: Fixing external path from: https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css to bootstrap/4/css/bootstrap.min.css
Head Update: Asset add to head: bootstrap/4/css/font-awesome.min.css
Head Update: Asset add to head: bootstrap/4/js/popper.min.js
Head Update: Fixing external path from: https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js to bootstrap/4/js/bootstrap.min.js
Head Update: Head node changed successfully
Copy file bootstrap.min.css
Copy file font-awesome.min.css
Copy file popper.min.js
Copy file bootstrap.min.js

I just notice that if I delete integrity=… to the end it works.

But still there is a problem related to the : maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css since not fonts are downloaded.

So sure you will se that those fonts disappears.

OK:

Not OK:

Teodor · June 15, 2018, 7:45am

The integrity is only required when liking to the CDN - but in my tests it is being removed when converting from remote to local links.

As for the font awesome, please check this topic: https://community.wappler.io/t/font-awesome-5-pro-displays-boxes-instead-of-icon-in-design-view/949

devisbal · June 15, 2018, 7:55am

In my case those are not removed. And I’m in latest 1.0.3

And the fonts on the page are 4.7.0 not 5.0, so it should be downloaded by Wappler. I have to do it manually.

Also, have you verify the end of the source code?
Where there still one
cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js
Plus:
src=“bootstrap/4/js/popper.min.js”

Teodor · June 15, 2018, 7:56am

What do you mean? To check what?
It is hard to follow what do you mean exactly ...

devisbal · June 15, 2018, 8:01am

It was on previous info:

At the end after the conversion to local I have:

Bad%20Code

Highlighted:
One script reference not converted, but have also converted at the end.

Teodor · June 15, 2018, 8:06am

Tested locally like 5 different projects i cannot recreate any of the issues you are having with the bootsrap conversion - everything gets converted properly.
What if you try creating a new project and include bootstrap from scratch?

devisbal · June 15, 2018, 8:19am

I have to convert some sites from cdn to local, to be used on intranet without internet, so that is not an option. I’m still not be able to convert. Even trying others demo proyects included with Wappler.

But also I test creating a new empty project, and awesome fonts 4.7.0 are not created/copied to the new empty project page.

Only:
Head Update: Asset add to head: js/jquery-3.3.1.slim.min.js
Head Update: Head node changed successfully
Copy file jquery-3.3.1.slim.min.js
Head Update: Asset add to head: bootstrap/4/css/bootstrap.min.css
Head Update: Asset add to head: bootstrap/4/css/font-awesome.min.css
Head Update: Asset add to head: bootstrap/4/js/popper.min.js
Head Update: Asset add to head: bootstrap/4/js/bootstrap.min.js
Head Update: Head node changed successfully
Copy file bootstrap.min.css
Copy file font-awesome.min.css
Copy file popper.min.js
Copy file bootstrap.min.js

Teodor · June 15, 2018, 8:22am

So is bootstrap include on new blank pages working fine?

devisbal · June 15, 2018, 8:26am

No, They do not, since the 4.7.0 awesome fonts are not included.

Teodor · June 15, 2018, 8:28am

I am asking specifically for BOOTSTRAP includes (bootstrap css, js, popper and jquery) local links.
Font awesome is not yet integrated in Wappler UI.

devisbal · June 15, 2018, 8:41am

OK. Bootstrap includes are OK.

Let’s go back to convert from CDN to Local. That’s is my main concern.

Could the problem be related to something left since I have been upgrading since the beginning of the Beta?

What is required to remove Wappler complete, meaning having later a clean install, without any registry/file left behind?

patrick · June 15, 2018, 8:46am

Hello devisbal,

I was able to reproduce this problem with an old page containing an older version of bootstrap, it didn’t remove the integrity and crossorigin attributes. We will fix this, with new pages there should be no problem and for now you have to fix this by removing the integrity and crossorigin attributes in code view.