search

iconify / icon-sets

150+ open source icon sets. Icons are validated, cleaned up, optimised, ready to render as SVG. Updated automatically 3 times a week.
https://icon-sets.iconify.design/
647 stars 63 forks source link

feat: add ts and esm support with tsup #16

Closed userquin closed 3 years ago

userquin commented 3 years ago

This PR adds Typescript and ESM Support: finder.ts will be compiled to finder.mjs and finder.js with typescript declarations.

It is the first approach, it will need some review and update the docs (readme.md).

You will need rimraf as global dependency (I'm not sure, I have so much node versions and so much package managers I'm lost, sorry): I've included the yarn.lock file.

userquin commented 3 years ago

I suggest you to create a new version/name, and so the older can also be used with no breaking changes: this PR provides the same as older finder.js adding only the collection function.

cyberalien commented 3 years ago

This is a good idea. Thank you for this pull request!

I'll test it within next few days.

userquin commented 3 years ago

@cyberalien The next will be @iconify/json-tools: we have problems on esm, since those 2 tools only provides cjs modules.

See this comment: https://github.com/antfu/unplugin-icons/pull/47#issuecomment-917506963

cyberalien commented 3 years ago

Thank you, that will be very needed.

I wrote those packages long time ago when was starting project, before switching to TypeScript. They do work correctly, but they are quite old and badly need modernising. Probably a full rewrite will be the best option.

Problem is, there is so much stuff to do with various packages that I just can't handle them all fast enough. So help is very much appreciated!

userquin commented 3 years ago

Can this 2 modules be unified on only one repo and using pnpm workspaces? Maybe this will help you to mantain both modules.

cyberalien commented 3 years ago

Tools are universal library, used in several other packages: other tools package (also needs rewriting, but it is used only by crawler, so no urgency there), crawler (automatically updates icon sets), API. It can also be used with custom icon sets, for those sets it would be pointless to include this repo.

Recently I wrote an alternative library that does pretty much the same as tools: Iconify Utils: https://github.com/iconify/iconify/tree/master/packages/utils

Utils is a more modern version of tools. Actually, now that I think about it, maybe best option would be to switch to Utils for this package. It is different type of package: instead of class that handles everything, there are multiple separate functions, so code can use only functions it needs and I think it does have everything needed to replace tools package for this repo. Will need to check it.

The major issue is ES support. Current published package is using CommonJS exports and I'm not sure how to handle ES support for it. There is no default file listed in package.json, so imports are done from files like @iconify/utils/lib/icon-set/parse.js. Those files are created from TypeScript, so I guess best approach would be to run tsc twice with different settings, generating .js and .mjs files in lib? Any suggestions on how to publish package that would support both CommonJS and ES exports?

edit: many typos, typing too fast

userquin commented 3 years ago

See the linked repo for multiple exports here https://github.com/antfu/unplugin-icons/blob/main/package.json#L14

userquin commented 3 years ago

@cyberalien I will start @iconify/json-tools: will change package manager from npm to yarn to allow link internally, I'll remove all classes usage and try to make all async, maybe some changes here will be necessary.

userquin commented 3 years ago

@cyberalien Maybe you can create a next branch to avoid conflicts...

cyberalien commented 3 years ago

Sure. Created

userquin commented 3 years ago

I will close this PR and open a new one for next branch

userquin commented 3 years ago

I cannot find it, maybe add just for example the readme.md file.

cyberalien commented 3 years ago

For type definitions you can use https://github.com/iconify/iconify/blob/master/packages/types/types.ts

There is one major difference though with live data: info block (type IconifyInfo) is a bit different in this repo. Palette is a string, not boolean. License and author fields are a bit different. I wanted to update change it to new type in next major version, which will be available when I'll make continuous updates work. So in future all data will be same as in types package, but for now it is a bit messy. Code that converts old type (and definition for old type) is here: https://github.com/iconify/icon-finder/blob/core/src/converters/info.ts