vue-lazy | Lightweight Image/Picture lazyload | Frontend Framework library

After upgrading my nuxt-cli version to 2.15.3 i've notice that pages chunks size was reduced and all node_modules installed packages are now being bundled into the app.js which is getting huge now.

Here below you can see my nuxt.config.js

I have developed a blog with Nuxtjs, everything work fine in dev mode, but after i deployed the aplication to my cpanel server, the landing page (index.vue) (i mean http://www.website.com/) show This page could not be found Back to the home page and after a few seconds the page load but not properly, the bootstrap and all the Swipers doesn't load, and i cannot use anything, but if i navigate to http://www.website.com/about-us all work fine, the bootstrap is loaded and the all the swipers are working fine.

I mean: http://www.website.com/ -> only load after a few seconds, doesnt load plugins. http://www.website.com/about-us -> works perfectly

And the title changed to "Failed to execute 'setAttribute' on 'Element': '-left' is not a valid attribute name." and i have the follow erros in Erros in console (edited: adblock errors no longer apeard, new console error:) I have searched a lot but i didn't find any solution.

What i have already done:

I have created a home.vue file and i pasted all the code from the index.vue file and whene i go to http://www.website.com/home, everything is loading and working fine, so the problem is not from the code in index.vue, i also tried whitout any script or styles in the page and it's not from that too, even if the index.vue only had one tag the problem appear.

I also tried to redirect from / to /home with:

I am trying to add vue-lazyload to my nuxt.js app, it works locally but when I try to deploy via Netlify I recieve this error.

I'm having a bit of trouble with getting my project to work on IE11 and Edge

You can view it here: https://tagfireandsecurity.co.uk/

THE PROBLEMS

IE11: Blank page, shows multiple errors:

I used the component groups and directives as Vue plugins in nuxtjs. I also use Carousel in bootstrap and 2 plugins of Vue were VueCarousel and Vue-Carousel 3D

After build in production => PurecssPlugin remove a lot of unused Css => It's good! But it breaks the pages, I have two problem:

• Some components don't receive bootstrap, like col-md-4 ...
• Carousel of bootstrap and 2 plugins of Vue => It's totally ruin :(

Hope someone can help me <3 Many thanks!

This is my boostrap-vue plugin:

After I have been upgrading my projects JS packages, an error has appeared when building my bundle with Webpack. It seems to appear when building a .vue-file and can appear on any .vue-file build. I don't have "babylon" in my package.json and I have a newer @babel/core version (7.2.2).

This is the error:

I just switched to webp images and noticed that they're not working. I'm using a lazy loading plugin to handle loading these images. This is where the problem is coming in. I'm hoping to be able to submit a pull request to fix this... if it's possible.

Here is an example that demonstrates a success and a failure for two different image formats:

https://codepen.io/corylogan/pen/OJJMERo?editors=1010

Here's the code for posterity

If I start my vue instance from a main.js file

So I kept sketching out algorithms to see how this would work. Kept hitting my head on the keyboard because frankly, nothing seems to work. Basically the hardcoded HTML looks like this: