Parcel: Parcel 2: Type-Only Imports and Export

[Banou26]

🐛 bug report

see Announcing TypeScript 3.8 Beta | Typescript for reference

Right now importing and exporting type-only references throw

- 🚨 Build failed.
- @parcel/packager-js: ./src/foo.ts does not export 'MyType'

Now that TypeScript 3.8 is in beta i'm making this issue to track the changes it'll have on Parcel

I'm not sure about Parcel's intention to support Beta features, but at least we can keep this issue open until it's Stable and ready to be implemented/updated in Parcel.

In addition of TypeScript itself, this should be implemented in Babel's transform plugin for it to work natively in Parcel since starting from v2, Parcel defaults to Babel's typescript transform.
There's already an issue opened on their end, https://github.com/babel/babel/issues/10981

By the way, weird thing about this is Parcel doesn't throw that error in watch mode but it does in build mode.

[devongovett]

This is a babel issue, not a parcel one. If you want, you can use TSC instead of Babel with @parcel/transformer-typescript-tsc.

It only occurs in build mode rather than dev mode because scope hoisting is not enabled in dev mode.

[lindskogen]

I was just about to open a new issue about this, but noticed this one.

Thing is, when I set up my .parcelrc like this:

{
    "extends": ["@parcel/config-default"],
    "transformers": {
        "*.svg": ["@parcel/transformer-svgo", "@parcel/transformer-svg-react"],
        "types:*.{ts,tsx}": ["@parcel/transformer-typescript-tsc"]
    }
}

I get another error:

🚨 Build failed.
Error: Unexpected token 'export'
/Users/lindskogen/project/node_modules/@parcel/ts-utils/src/index.js:2
export * from './FSHost';
^^^^^^

SyntaxError: Unexpected token 'export'
    at wrapSafe (internal/modules/cjs/loader.js:1063:16)
    at Module._compile (internal/modules/cjs/loader.js:1111:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1167:10)
    at Module.load (internal/modules/cjs/loader.js:996:32)
    at NodePackageManager.load (/Users/lindskogen/project/node_modules/@parcel/package-manager/lib/NodePackageManager.js:112:9)
    at NodePackageManager.requireSync (/Users/lindskogen/project/node_modules/@parcel/package-manager/lib/NodePackageManager.js:78:17)
    at Module.m.require (/Users/lindskogen/project/node_modules/@parcel/package-manager/lib/NodePackageManager.js:99:19)
    at require (internal/modules/cjs/helpers.js:72:18)
    at Object.<anonymous> (/Users/lindskogen/project/node_modules/@parcel/transformer-typescript-tsc/lib/TSCTransformer.js:10:16)
    at Module._compile (internal/modules/cjs/loader.js:1147:30)

[mischnic]

"types:*.{ts,tsx}": ["@parcel/transformer-typescript-tsc"]

First of all, you want "ts,tsx": ["@parcel/transformer-typescript-tsc"].

And yes, that was a publish mistake in the latest alpha. You can try the nightly version if you want yarn add parcel@nightly @parcel/transofmrer-typescript-tsc@nightly ...

[lindskogen]

Not sure where to continue this thread, but now I get this error that I have never seen before:

Build failed.
@parcel/namer-default: Target "types" declares an output file path of "dist/index.d.ts" which does not match the compiled bundle type "js".


  12 |   "main": "dist/index.js",
> 13 |   "types": "dist/index.d.ts",
>    |            ^^^^^^^^^^^^^^^^^ Did you mean "dist/index.d.js"?

ℹ️ Hints:
- Try changing the file extension of "types" in packages/grid/package.json.

[chrisrzhou]

@lindskogen, seeing the same issue. Not sure how to configure and whitelist file extensions in Parcel (new to using Parcel). In the meantime, I'm using "typings" as the package.json field, since it is an alias for types. Seems that Parcel ignores this field and only checks on types field.