photopea / Typr.js

Typr.js - process fonts in Javascript
MIT License
914 stars 73 forks source link

add lines to detect require function + add package.json #16

Closed adriaanmeuris closed 8 months ago

adriaanmeuris commented 6 years ago

This pull request adds the UMD definition to support both browser globals and requiring Typr

kingschnulli commented 6 years ago

@adriaanmeuris is there any timeframe on when the UMD and npm features will be merged into the master branch? I just opened another pull and I think I might be better off resubmitting it for the new build system.

photopea commented 6 years ago

@adriaanmeuris I would like to make "independent" code, which does not require any other specific tools to be usable. I don't even like the shell script, that is used right now.

Also, is there any easier way to make a JS code work in Node.js without adding those two extra files?

adriaanmeuris commented 6 years ago

@photopea if you want to keep files separate (i.e. all files in tabs), you'll always need to merge them one way or another (a shell script, gulp, browserify, ...). That's not bad, but actually good practice since you're separating code and makes debugging in-browser al lot easier if you use sourcemaps.

Which to choose? There are a lot of ways to implement this correctly (if you want some background information check this post: https://stackoverflow.com/a/16522990/5122964). If you follow the CommonJS spec, you'll allow users to use your library in either NodeJS or a browser. This is exactly what Opentype.js and a lot of libraries do.

TL;DR you'll always need to build your files, and preferably in a way that allows your library to be used anywhere. I can implement this exactly that way, but your current build process (the shell script) will change - see my comment to have an idea how that would look: https://github.com/photopea/Typr.js/issues/14#issuecomment-357535589

kingschnulli commented 6 years ago

+1 one @adriaanmeuris comment, you will need some kind of build system - gulp is nice, browserify also. Please consider changing the build process and make this lib npm and module compatible.

photopea commented 6 years ago

Should we connect Typr.js and Typr.U.js into one file? Typr.js can be used without Typr.U.js , but I don't think many people would do it to save data.

adriaanmeuris commented 6 years ago

we do :-) it's best practice to separate it, so users can import only the required files using any build system (webpack, rollup, browserify, ...).

But that won't stop you from generating a full build as well. If you like to offer best of both worlds for users that only use Typr in the browser, you can even generate different builds automatically:

somebody32 commented 5 years ago

Any plans to continue with that PR? I would propose to go even one step further and to ship umd + es modules version, so consumers with tree-shaking available can require only what they really needed. Then it will be no problem to separate typr into any amount of modules. Could help with rollup configuration if needed

photopea commented 5 years ago

I never used NPM and I can not do it myself :(

@adriaanmeuris would you like to become a maintainer of Typr.js at NPM, and possibly update it when I update Typr.js on GitHub? So basically, we just need to create a package.json and add a short prefix / suffix to Typr.js and Typr.U.js ?

starak commented 5 years ago

I released a npm wrapper for Typr.js a year ago, https://www.npmjs.com/package/typr.js and can update it if needed.

photopea commented 5 years ago

@starak Great! Could you update it now? I think I added some features half a year ago.

I can mention it in README.md. What lines should I put there?

adriaanmeuris commented 5 years ago

@somebody32 I'd be happy to continue with the PR, if @photopea considers a process that allows to build & publish from within this repository - see suggestions above.

Currently all files are concatenated. To publish these to NPM, you need to do some manual changes so the library will be available as a library that can be consumed by any system (requirejs, amd, common js or simply importing as ES module). @starak maybe can shed some light on how he set up the wrapper and integrate that into this repo.