Bug: Unexpected token 'export'

[wolfram-fm]

Description

I have a pretty simple typescript project that runs on Docker. I tried to upgrade from 3.9.2 to 4.2.2, but have been running into issues building the project with the error Unexpected token 'export'. The error seems to be coming from the exports in the dist/index.js file.

[fnando]

Can you please give more context how are you doing things?

• How are you importing the package?
• Are you using asset pipeline?
• Are you compiling the code using something like webpack/other?
• Anything else you think it'd be helpful to know

Additionally, it'd be easier to help you if you uploaded a sample app reproducing the issue.

[wolfram-fm]

• package is imported via pnpm
• code is being compiled with Typescript's own tsc

Not really sure what changed between 3.9 and 4.2 that would break something so baked in as export.

[wolfram-fm]

I'll try to get an example app later today.

[wolfram-fm]

here's a sample project. steps in README to reproduce error https://github.com/wolfram-fm/i18ntest

[wolfram-fm]

just to rule out pnpm being an issue, I also tried using yarn and ran into the same error

[fnando]

oh, now I got it. The reason is that TypeScript (tsc) doesn't transform anything other than your own code, meaning that any code you load must already be transformed in a way the transpiled code can understand.

One way of doing this is loading import {I18n} from "i18n-js/dist/require" instead, but that introduces another issue with typings, which can be fixed by adding something like this to a file module.d.ts (or something):

declare module "i18n-js/dist/require";

Then you need to import just the types from your regular i18n.ts module:

import { I18n } from "i18n-js/dist/require";
import type * as I18nTypes from "i18n-js";

const tx: I18nTypes.I18n = new I18n({
  en: {
    hello: "hello",
  },
  fr: {
    hello: "bonjour",
  },
});

export default tx;

I've attached your sample modified according to the above (master branch). Alternatively, you can use webpack or esbuild (I like it over webpack) to transpile your files without any changes (esbuild branch):

$ esbuild --bundle --minify index.ts --outfile=dist/index.js

  dist/index.js  70.5kb

⚡ Done in 16ms

$ node dist/index.js
hello
bonjour

i18ntest.zip

[iahu]

If I use i18n-js on a ESModule type project, the module resolver will take i18n-js as a CommonJS module, because, it use the main field, and not set type to module, but the main field badly point to a ESModule file, so that the resolver will failed to resolve it.

if you want to export a ESModule module, you can use module or exports field, and can keep the main field, but should point to a CommonJS module.

so the package.json should be like that:

{
  "main": "./dist/require/index.js",
  "module": "./dist/import/index.js"
}