Using multiple versions of RequireJS - javascript

I have a web app built with Dojo 1.7.2, using RequireJS to load individual modules with AMD. I'd like to add a slightly customized copy of the ACE code editor version 0.2.0, which is about 9 months old and uses an earlier, incompatible version of RequireJS to load itself.
Really I'd just like to include the different JavaScript files (Dojo and ACE) without having a namespace collision (on global functions declare and require which is something that RequireJS is designed to help prevent anyway). I'd like to do this without further customization of either project. Is that even possible to do?

Ace's authors recommend using the newest version from the master branch which should be compatible with recent RequireJS.
BTW, could you post somewhere how you managed to run Dojo 1.7.2 with RequireJS?

Related

Edit an existing PDF template with parallax / jsPDF

How can I load an existing PDF document as jsPDF object and edit using JavaScript library called parallax / jsPDF which is the top popular JavaScript library for generating PDFs as the time I'm writing this.
I am using the version 2.5.1 the latest as of now.
I searched everywhere and finally I got the answer, wasting too much
time. So I decided to put it here so that anyone can refer it faster.
As at now(28/12/2022) "JsPdf do not have that functionality and probably will never be able to parse existing PDF files. It would mean a major rewrite of its fundamental architecture." as its contributes states here.
There are other libraries support the same functionality like pdf-lib. I extracted the following from their GitHub page.
pdf-lib was created to address the JavaScript ecosystem's lack of robust support for PDF manipulation (especially for PDF modification).
Two of pdf-lib's distinguishing features are:
Supporting modification (editing) of existing documents.
Working in all JavaScript environments - not just in Node or the Browser.
There are other good open source JavaScript PDF libraries available. However, most of them can only create documents, they cannot modify existing ones. And many of them only work in particular environments.
UMD Module
You can also download pdf-lib as a UMD module from unpkg or jsDelivr. The UMD builds have been compiled to ES5, so they should work in any modern browser. UMD builds are useful if you aren't using a package manager or module bundler. For example, you can use them directly in the tag of an HTML page.
https://unpkg.com/pdf-lib/dist/pdf-lib.js
https://unpkg.com/pdf-lib/dist/pdf-lib.min.js
https://unpkg.com/pdf-lib/dist/pdf-lib.min.js
https://cdn.jsdelivr.net/npm/pdf-lib/dist/pdf-lib.js
https://cdn.jsdelivr.net/npm/pdf-lib/dist/pdf-lib.min.js
NOTE: if you are using the CDN scripts in production, you should
include a specific version number in the URL, for example:
https://unpkg.com/pdf-lib#1.4.0/dist/pdf-lib.min.js
https://cdn.jsdelivr.net/npm/pdf-lib#1.4.0/dist/pdf-lib.min.js

How can I force old, compiled jquery plugins to use a specific version of jQuery in WordPress?

I have a client who had a very complex jQuery app custom built by a previous developer within his WordPress site. Its functionality is cleanly broken out into several scripts which get minified together with the libraries they depend on. The libraries rely on an old version of jQuery (3.3.1). The site is complex and we need to be able to use the current version of jQuery to allow other plugins we're using to continue to keep up with upgrades.
The libraries include c. 2018 versions of:
Select2
Isotope
SpriteSpin
EasyResponsiveTabs
ImagesUploaded
jQuery Viewport
Some of these are minified/uglified.
I've used best practices to load jQuery 3.3.1 into a variable jQuery3_3_1 with noconflict();
It's rather easy to change standard jQuery to use jQuery3_3_1. But I need a way to force the libraries to use jQuery3_3_1, otherwise they are not recognized by the scripts (and some of them will have issues using a different version of jQuery than they were built in). Most of these use requireJs(), and I've seen instructions for setting up requirejs.config() code in the footer that will define "jquery" to be a particular version. Doing this would be a great solution, but I have no idea how to get these uglified scripts to use it.
I've read through several similar inquiries, but none have addressed forcing a jQuery version on minified/uglified code. Others speak to a level of expertise in jQuery module development that I don't have and don't have time to scale into.
Is there a way to get all these modules that use require('jquery') to have that reference jQuery3_3_1? I'd love it if there were a way to say, "For all the files that live in this directory, jQuery/jquery (there are 2 ways it is called) means jQuery3_3_1/jquery3.3.1".
Or being that it's a Wordpress site, could this be defined in the wp_enqueue_script() call?
Many thanks for your help!

Can I use YUI Compressor or other tool to combine arbitrary javascript files?

My problem is that I need to combine approximately 200 dojo javascript files. Dojo uses the AMD define/require module system. The dojo built-in tools which use Google Closure and Shrinksafe won't work due to a version mismatch (tool is from 1.11.3 source is 1.11.1).
The dojo build includes steps which reference an AST so I'm assuming that you can't just throw any old code at a "combiner". Presumably global variables and other naming conflicts would be the first problem.
Are the tools generally clever enough to handle any old javascript?
The dojo build tools was specifically designed to build dojo application. You won't be able to easily build using YUI or others (like require.js)
You should be able to build from 1.11.3 even if your code is 1.11.1.

Including Local Version of jQuery Using Webpack

So I have seen multiple examples of how to include jQuery in the global namespace using webpack. I have seen code using the ProviderPlugin, imports-loader, and even a couple of other methods.
However, my JS code is going to be running on client web pages so I do not want my version of jQuery to override theirs. Is there way to have webpack include jQuery as a local variable to my JS via noConflict?

Using Two Customized Versions of Zurb's Foundation Framework in one Web Project

My organization has created an ASP.NET Web Forms template with Foundation 4 baked directly into it. The problem is they didn't include all of the wonderful features available (i.e. the block grid). I'd really like to use the block grid, so what would be the best approach of downloading a customized version of Foundation and having it exist with another customized version in the same project?
I have a folder called App_Assets and this is where they demand we put any custom scripts.
I'm certain this is not the answer you're looking for, but the Zurb Foundation FAQ states:
6. How do I use multiple versions of Foundation?
You don't want to use multiple versions on a single project. If you
are using different versions for different projects, we've got you
covered. You can easily use a system like Bundler to define a version
(with the gem version). This lets you compile your CSS against
whatever version you'd like. If you're using vanilla CSS, you
shouldn't have a problem since you aren't compiling against a gem.
(emphasis mine)
So it doesn't look like there is a (supported) way to do this. Not to say that you won't be able to find a way to make it happen.
I think, there is only one safe way to include foundation 5 in your project.
- include foundation 5 files in your project and set variables $include-html-classes: false;
- use mixins to generate components that you need
for example:
#import "foundation/components/block-grid";
.name-o-your-block-grid{
#mixin block-grid();
}
information about all variables you can find in th source:
https://github.com/zurb/foundation/blob/master/scss/foundation/components/_block-grid.scss

Categories

Resources