Skip to content

Compile issue with TypeScript and CommonJS with the shipped types for fast-xml-parser #724

@mpodwysocki

Description

@mpodwysocki
  • Are you running the latest version?
  • Have you included sample input, output, error, and expected output?
  • Have you checked if you are using correct configuration?
  • Did you try online tool?
  • Have you checked the docs for helpful APIs and examples?

Description

When targeting both ESM and CommonJS for TypeScript, the CommonJS targeting will error with the following:

error TS1479: The current file is a CommonJS module whose imports will produce 'require' calls; however, the referenced file is an ECMAScript module and cannot be imported with 'require'. Consider writing a dynamic 'import("fast-xml-parser")' call instead.
  To convert this file to an ECMAScript module, change its file extension to '.mts' or create a local package.json file with `{ "type": "module" }`.

4 import { XMLBuilder, XMLParser, XMLValidator } from "fast-xml-parser";

The issue is that you are shipping a single set of types for both ESM and CommonJS as noted here:

  "exports": {
    ".": {
      "import": "./src/fxp.js",
      "require": "./lib/fxp.cjs",
      "types": "./src/fxp.d.ts",
      "default": "./src/fxp.js"
    }
  },

In this case you are shipping your ESM types, ./src/fxp.d.ts for both ESM and CJS, which is a bug as noted on Are the Types Wrong? - fast-xml-parser

This gives helpful hints that this library is masquerading as ESM, and instead you should ship both a set of types for CommonJS and ESM such as the following:

  "exports": {
    ".": {
      "import": {
        "types": "./dist/esm/index.d.ts",
        "default": "./dist/esm/index.js"
      },
      "require": {
        "types": "./dist/commonjs/index.d.ts",
        "default": "./dist/commonjs/index.js"
      }
    }
  },

Input

Upgrading the @azure/core-xml project to use the latest fast-xml-parser as noted here: Azure/azure-sdk-for-js#33172 (comment)

Code

This code will fail if we are using the targeting for CommonJS:

import { XMLBuilder, XMLParser, XMLValidator } from "fast-xml-parser";

We can get rid of the overall compiler error with @ts-ignore but this is not ideal

@ts-ignore
import { XMLBuilder, XMLParser, XMLValidator } from "fast-xml-parser";

Output

error TS1479: The current file is a CommonJS module whose imports will produce 'require' calls; however, the referenced file is an ECMAScript module and cannot be imported with 'require'. Consider writing a dynamic 'import("fast-xml-parser")' call instead.
  To convert this file to an ECMAScript module, change its file extension to '.mts' or create a local package.json file with `{ "type": "module" }`.

4 import { XMLBuilder, XMLParser, XMLValidator } from "fast-xml-parser";

expected data

Expected to compile, however does not unless using @ts-ignore.

Would you like to work on this issue?

  • Yes
  • No

Bookmark this repository for further updates. Visit SoloThought to know about recent features.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions