feat!: move to ESM-only and fix package exports

[kwaa]

Description

unbuild outputs .d.mts and .d.cts at build time, but unocss doesn't use it.

This PR updates the export map for most packages to export types correctly.

References

https://publint.dev/unocss@0.57.7
https://arethetypeswrong.github.io/?p=unocss
https://github.com/arethetypeswrong/arethetypeswrong.github.io/blob/main/docs/problems/FalseCJS.md
microsoft/TypeScript#50466
unjs/unbuild#238

[netlify]

✅ Deploy Preview for unocss ready!

Name	Link
🔨 Latest commit	21c34c8
🔍 Latest deploy log	https://app.netlify.com/sites/unocss/deploys/660a9dfed5cec700084f82c4
😎 Deploy Preview	https://deploy-preview-3380--unocss.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[userquin]

ahaha, I was working also on this on my local, checking your PR @kwaa

[userquin]

You should use d.ts instead d.cts in require types, all d.cts files should be removed since we're not using type module, those d.cts files are generated by unbuild (if packages were with type module, d.mts should be removed and we should use d.ts in import types).

I'll check cli package, I guess we should add type module.

I'll check this PR on my local in a few hours...

NOTE: on my local I'm moving UnoCSS to ESM first

[kwaa]

You should use d.ts instead d.cts in require types, all d.cts files should be removed since we're not using type module, those d.cts files are generated by unbuild (if packages were with type module, d.mts should be removed and we should use d.ts in import types).

I've pushed the changes.

Currently building fine on my computer, running tests test/preset-attributify.test.ts > attributify > autocomplete extractor > without prefix fails

NOTE: on my local I'm moving UnoCSS to ESM first

Wow, that's cool! I can also modify this PR if needed.

[userquin]

Wow, that's cool! I can also modify this PR if needed.

Create a new branch in your local from this branch (in your local) and follow these intructions (on cli package just change the types):

• find /* @export-submodules */ and replace it with /* @xexport-submodules */: check scripts/exports.ts module
• add type module to all package.json files
• use d.cts in require types and d.ts in import types

If everything is ok, just merge your new branch in this one (in your local) and push here.

[kwaa]

find /* @export-submodules */ and replace it with /* @xexport-submodules */: check scripts/exports.ts module

Hmm... I didn't quite get that part. Could you please explain it in detail?

[userquin]

Hmm... I didn't quite get that part. Could you please explain it in detail?

forgot it, don't change it

[kwaa]

"type": "module" is set :)

I ignored the vscode package because it only generates an index.js file.

build and test are the same as before.

[userquin]

are you testing the tgz files? you can install publint and arethetypeswrong globally: https://www.npmjs.com/package/@arethetypeswrong/cli

[kwaa]

are you testing the tgz files? you can install publint and arethetypeswrong globally: npmjs.com/package/@arethetypeswrong/cli

unocss package test results:

@arethetypeswrong/cli

publint

[userquin]

ok, so we only need to fix astro and postcss default exports in cjs, that's easy: https://github.com/antfu/vite-plugin-inspect/pull/99/files#diff-21462feba05a79008c54d9a3267569b27b8897540ac86e47110e57f25402d224R4-R11

[userquin]

@kwaa are you going to fix it?

[kwaa]

@kwaa are you going to fix it?

I'm on it. How do I write a Co-authored-by or code comment?

[userquin]

We also need to fix unocss package exports:

[userquin]

I'm on it. How do I write a Co-authored-by or code comment?

There is no need, anyway I have no idea 😅

[userquin]

We need to fix all cjs files generated by unbuild, cjs files generated with tsup should be fine.

You should create a new script in scripts folder and call it after build script in root package.json file.

[kwaa]

We also need to fix unocss package exports

The script currently looks like this:

import { readFileSync, writeFileSync } from 'node:fs'
import { resolve } from 'node:path'

function patchCjs(cjsModulePath: string, name: string) {
  const cjsModule = readFileSync(cjsModulePath, 'utf-8')
  writeFileSync(
    cjsModulePath,
    cjsModule.replace(`module.exports = ${name};`, `exports.default = ${name};`),
    { encoding: 'utf-8' },
  )
}

patchCjs(resolve('./packages/astro/dist/index.cjs'), 'UnoCSSAstroIntegration')
patchCjs(resolve('./packages/postcss/dist/index.cjs'), 'unocss')
patchCjs(resolve('./packages/unocss/dist/astro.cjs'), 'UnocssAstroIntegration')
patchCjs(resolve('./packages/unocss/dist/postcss.cjs'), 'postcss__default')

It works fine.

But considering that there are a lot of packages that also use the default export, maybe I should fix them as well.

unocss

@unocss/astro

@unocss/postcss

[userquin]

yes, the script should fix all cjs files in all packages, unocss will include a few of them (and so you don't need to install individual packages if you only need defaults provided by unocss)

[kwaa]

It should be fine now, and it would be great if it would merge before 0.59.0.

[userquin]

We should stop using default package exports in new packages with dual ESM/CJS whenever possible

[kwaa]

Maybe it's time to merge it? @userquin @antfu

[kwaa]

🥺

[kwaa]

🥲

[userquin]

iirc this should be "default" instead "import"

[userquin]

root types should use .d.ts, .d.mts will use .js extension and that's wrong in node10

[userquin]

I'm very busy at work, I'll check the changes this afternoon ( /cc @kwaa )

[userquin]

remove types here, we're masquerading CJS entry: dual ESM/CJS shouldn't have types

[userquin]

should remove types also in postcss and webpack packages