diff options
author | Michał Gołębiowski-Owczarek <m.goleb@gmail.com> | 2023-09-19 18:58:24 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2023-09-19 18:58:24 +0200 |
commit | 46f6e3da796ee9d28c7c1428793b72d66bcbb0b7 (patch) | |
tree | b4c2810c9c39816db7d937b6a02803d55dab1728 /build/fixtures | |
parent | b923047d29d37f2d5c96f8b33992f322bc7b7944 (diff) | |
download | jquery-46f6e3da796ee9d28c7c1428793b72d66bcbb0b7.tar.gz jquery-46f6e3da796ee9d28c7c1428793b72d66bcbb0b7.zip |
Core: Move the factory to separate exports
Since versions 1.11.0/2.1.0, jQuery has used a module wrapper with one strange
addition - in CommonJS environments, if a global `window` with a `document` was
not present, jQuery exported a factory accepting a `window` implementation and
returning jQuery.
This approach created a number of problems:
1. Properly typing jQuery would be a nightmare as the exported value depends on
the environment. In practice, typing definitions ignored the factory case.
2. Since we now use named exports for the jQuery module version, it felt weird
to have `jQuery` and `$` pointing to the factory instead of real jQuery.
Instead, for jQuery 4.0 we leverage the just added `exports` field in
`package.json` to expose completely separate factory entry points: one for the
full build, one for the slim one.
Exports definitions for `./factory` & `./factory-slim` are simpler than for `.`
and `./slim` - this is because it's a new entry point, we only expose a named
export and so there's no issue with just pointing Node.js to the CommonJS
version (we cannot use the module version for `import` from Node.js to avoid
double package hazard). The factory entry points are also not meant for the Web
browser which always has a proper `window` - and they'd be unfit for an
inclusion in a regular script tag anyway. Because of that, we also don't
generate minified versions of these entry points.
The factory files are not pushed to the CDN since they are mostly aimed
at Node.js.
Closes gh-5293
Diffstat (limited to 'build/fixtures')
-rw-r--r-- | build/fixtures/README.md | 29 |
1 files changed, 6 insertions, 23 deletions
diff --git a/build/fixtures/README.md b/build/fixtures/README.md index a12e6121c..9e4f68913 100644 --- a/build/fixtures/README.md +++ b/build/fixtures/README.md @@ -136,16 +136,16 @@ Node.js doesn't understand AMD natively so this method is mostly used in a brows ### Node.js pre-requisites -For jQuery to work in Node, a window with a document is required. Since no such window exists natively in Node, one can be mocked by tools such as [jsdom](https://github.com/jsdom/jsdom). This can be useful for testing purposes. +For jQuery to work in Node, a `window` with a `document` is required. Since no such window exists natively in Node, one can be mocked by tools such as [jsdom](https://github.com/jsdom/jsdom). This can be useful for testing purposes. -jQuery checks for a `window` global with a `document` property and - if one is not present, as is the default in Node.js - it returns a factory accepting a `window` as a parameter instead. +For Node-based environments that don't have a global `window`, jQuery exposes a dedicated `jquery/factory` entry point. To `import` jQuery using this factory, use the following: ```js import { JSDOM } from "jsdom"; const { window } = new JSDOM( "" ); -import jQueryFactory from "jquery"; +import { jQueryFactory } from "jquery/factory"; const $ = jQueryFactory( window ); ``` @@ -154,27 +154,10 @@ or, if you use `require`: ```js const { JSDOM } = require( "jsdom" ); const { window } = new JSDOM( "" ); -const $ = require( "jquery" )( window ); -``` - -If the `window` global is present at the moment of the `import` or `require` of `"jquery"`, it will resolve to a jQuery instance, as in the browser. You can set such a global manually to simulate the behavior; with `import`: - -```js -import { JSDOM } from "jsdom"; -const { window } = new JSDOM( "" ); -globalThis.window = window; -const { default: $ } = await import( "jquery" ); -``` - -or with `require`: - -```js -const { JSDOM } = require( "jsdom" ); -const { window } = new JSDOM( "" ); -globalThis.window = window; -const $ = require( "jquery" ); +const { jQueryFactory } = require( "jquery/factory" ); +const $ = jQueryFactory( window ); ``` #### Slim build in Node.js -To use the slim build of jQuery in Node.js, use `"jquery/slim"` instead of `"jquery"` in both `require` or `import` calls above. +To use the slim build of jQuery in Node.js, use `"jquery/slim"` instead of `"jquery"` in both `require` or `import` calls above. To use the slim build in Node.js with factory mode, use `jquery/factory-slim` instead of `jquery/factory`. |