[ajivanyandev]

Generates an exports map for the devextreme npm package and makes esm/ valid Node ESM, while cjs/ keeps shipping. Supersedes the research in #34182: its extension rule skipped file names that contain a dot (495 imports), and its exports map left out type-only modules, the package root and bundles/*.

What does the PR change?

Package output

• esm/ loads in Node. Every relative import is fully specified (./button → ./button.js, ./grids → ./grids/index.js). Today import('devextreme/ui/button') fails in Node with ERR_UNSUPPORTED_DIR_IMPORT, so SSR and plain Node code only work through cjs/.
• esm/ imports @babel/runtime/helpers/* instead of helpers/esm/*. These paths resolve to the ESM or CJS helper through @babel/runtime's own exports map, so tools that run esm/ as CommonJS (Jest with transformIgnorePatterns) can load them.
• Root package.json gets an exports map (618 entries):
  • one entry per module stub, with types, module, import, require and default conditions;
  • every type-only module, read from the declarations (ui/button_types, data, core, …);
  • "." (types only, from the existing types field), ./package.json, ./bundles/*, ./localization/messages/*.json, ./dist/*, ./scss/*;
  • ./esm/* and ./cjs/*, so existing deep imports keep working;
  • ./*.d, for import type … from 'devextreme/ui/menu.d' (used in our TestCafe tests).

Nothing else in the package changes. cjs/, the per-folder package.json stubs (including sideEffects) and all other files are byte-identical to a build of main.

Two public modules fixed

• js/localization/ldml/number.js re-exported FormatterConfig, a TypeScript interface. Bundlers only warn about it; Node ESM fails with "does not provide an export named". Nothing imports it from this path.
• js/viz/core/renderers/animation.js imported the bare path '__internal/viz/core/renderers/animation', which doesn't resolve outside our build. It fails under require() today as well.

How did you achieve this?

• build/babel-plugin-add-import-extensions.js, added to the esm config in build/transpile-config.js. It resolves each relative import against the source tree, the way TypeScript does, so dotted names such as ui.errors or emitter.feedback get .js. A file wins over a directory with the same name. __internal files compiled into artifacts/dist_ts are mapped back to js/. An import that doesn't resolve fails the build.
• New generate-exports-map executor in nx-infra-plugin, and a build:npm:exports-map target that runs after build:npm:root-package-json in every build:npm configuration, internal ones included. It fails if an entry points to a missing file.
• create-dual-mode-manifest: the side-effect finder appended .js to every import, so fully specified imports would have produced empty sideEffects lists.
• state-manager-optimize: the ESM re-export it writes is now ./prod/index.js.
• QUnit artifacts (build:dev, build:qunit-esm, pnpm run dev) use a separate esmQunit Babel config: esm without the extensions plugin. The QUnit runner's import map gives tests extensionless URLs, and a test and the library must import a module by the same URL to share one instance. With .js imports in the library, stubs and spies set by tests didn't reach it, and 13 QUnit jobs failed on the first CI run. The import paths are the only difference, so QUnit still covers the same code.

Decisions worth reviewing

• module comes first in each entry. With only import/require (as in Build: research for generating exports for ESM mode #34182), an app that both imports and require()s DevExtreme loads two copies in webpack and esbuild. Config, localization and the license key then land in a copy the components don't use. With module first, webpack resolves exactly as it does today through the stub's module field, and esbuild matches it. Node and Jest ignore module, so require() still gets cjs/ and the class itself.
  • Trade-off: esbuild app code that only uses require('devextreme/ui/button') now gets { default }. That's what webpack users already get today. devextreme-aspnet-data-nojquery already unwraps .default for this reason.
• No "type": "module" in esm/. Node 24 loads it through syntax detection without a warning inside node_modules. Adding the field made webpack treat our files as strict ESM. That changed the bundled output for modules that default-import CommonJS/UMD libraries (Quill, Gantt, Diagram) and adds runtime risk with no benefit for Node.

How can we verify these changes?

pnpm nx build devextreme
pnpm exec jest --selectProjects node-tests --testPathPatterns babel-plugin-add-import-extensions   # from packages/devextreme
pnpm --workspace-root nx test devextreme-nx-infra-plugin
cd e2e/compilation-cases && pnpm test
pnpm nx test devextreme-modules-test

Results from a local run, compared with a build of main (Node 24.16.0):

Check	Result
Package diff against main	No files added or removed. Root package.json differs only by exports. cjs/, stubs and other files identical. esm/ differs only in import paths (2,011 files) plus the two module fixes.
import() of all 505 public modules in Node	488 load (0 today). The rest: Scheduler (see below), the Globalize modules and aspnet (they fail under require() too), and jquery/knockout/ol integrations without those packages installed.
require() of all 505 public modules	No new failures; viz/core/renderers/animation now loads.
e2e/bundlers (webpack ESM + CJS, Rollup, Vite, Parcel, Browserify)	Pass
e2e/compilation-cases (moduleResolution: bundler)	Pass
devextreme-angular, devextreme-react, devextreme-vue builds; React and Vue tests	Pass (React 254, Vue 175)
Demos: build-vendor-bundles (esbuild)	Pass; drops the same three type-only specifiers as on main
nx-infra-plugin tests; devextreme node-tests	207/207; 306/306
QUnit (headless Chrome, local runner)	All 161 suites that failed in the first CI run now pass. Two tests (a DataGrid adaptive-columns width check and a Form resize-count check) fail locally on main too.
Consumer matrix: Jest (default config, transformIgnorePatterns, jest.mock), Vitest, Node require/import, webpack, esbuild, Browserify, TypeScript bundler/node10	Same as main except: Node import and webpack imports from .mjs/"type":"module" app files now pass; esbuild require()-only code gets { default }. Apps mixing import and require() still get one copy in webpack and esbuild.

Not run locally: TestCafe, Playwright.

Known limitations

• Scheduler doesn't load under native Node ESM. Our code does import { RRule, RRuleSet } from 'rrule'; rrule's main is a CommonJS bundle whose named exports Node can't detect, and its ESM build isn't valid Node ESM. It doesn't load today either, Vitest handles it, and require() still works. A fix in our import would add a webpack warning for every Scheduler app, so it's left for a follow-up.
• apps/demos/utils/server/csp-bundle.js has an esbuild plugin that collapses cjs/ paths to esm/. With the module condition esbuild should no longer resolve cjs/ there; I left the plugin in place.
• The .d.ts files are CommonJS-format for TypeScript (node16/nodenext with an ESM importer). This is unchanged from today.

[Copilot]

🟡 Changes recommended

The export mappings break existing suffixed bundle and declaration imports by duplicating extensions, and directory deep imports by forcing nonexistent .js paths instead of resolving index.js files.

2 open issues

• Preserve already-suffixed bundle and declaration paths · New
• Preserve directory deep imports with index aliases · New

What changed in this PR

This PR adds a generated exports map and Node-compatible ESM import paths to the published DevExtreme package, while retaining CommonJS output and QUnit’s extensionless imports.

Changes:

• Generates conditional exports for runtime modules, declarations, and asset paths.
• Adds source-aware ESM import rewriting with a separate QUnit configuration.
• Updates supporting build logic and tests, and fixes two public entry points.

File	Description
packages/​nx-infra-plugin/​src/​executors/​state-manager-optimize/​state-manager-optimize.impl.ts	Adds .js to the generated production re-export.
packages/​nx-infra-plugin/​src/​executors/​state-manager-optimize/​executor.e2e.spec.ts	Updates ESM and CommonJS output expectations.
packages/​nx-infra-plugin/​src/​executors/​generate-exports-map/​schema.ts	Defines exports-map executor options.
packages/​nx-infra-plugin/​src/​executors/​generate-exports-map/​schema.json	Describes executor configuration fields.
packages/​nx-infra-plugin/​src/​executors/​generate-exports-map/​generate-exports-map.impl.ts	Generates conditional exports and validates explicit targets.
packages/​nx-infra-plugin/​src/​executors/​generate-exports-map/​executor.ts	Exposes the new executor.
packages/​nx-infra-plugin/​src/​executors/​generate-exports-map/​executor.e2e.spec.ts	Tests runtime exports, declaration exports, and missing targets.
packages/​nx-infra-plugin/​src/​executors/​create-dual-mode-manifest/​side-effect-finder.ts	Supports fully specified imports during side-effect discovery.
packages/​nx-infra-plugin/​src/​executors/​create-dual-mode-manifest/​executor.e2e.spec.ts	Tests side-effect discovery across both import styles.
packages/​nx-infra-plugin/​executors.json	Registers the exports-map executor.
packages/​devextreme/​project.json	Wires exports generation into npm builds and selects QUnit transpilation settings.
packages/​devextreme/​js/​viz/​core/​renderers/​animation.js	Corrects the internal animation import to a relative path.
packages/​devextreme/​js/​localization/​ldml/​number.js	Removes a runtime re-export of a TypeScript interface.
packages/​devextreme/​build/​transpile-config.js	Separates npm and QUnit ESM settings and updates Babel helper imports.
packages/​devextreme/​build/​babel-plugin-add-import-extensions.test.ts	Tests source resolution and import-path rewriting.
packages/​devextreme/​build/​babel-plugin-add-import-extensions.js	Adds fully specified paths to relative ESM imports and re-exports.

_{Review effort: Balanced}