Use Vite as build tool #52
Conversation
If you don't sepecify files: [...], then npm will use the .gitignore which we don't want since it would ignore the dist folder which we WANT included in the final .tar.gz package. And, since we specify the files: [...] package.json entry, we must explicitly list all files/folders that we want in there.
Right now we expect the final thing to be in ./style.min.css, so we need to cp it there in our build step.
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
|
Thank you for the great idea! The only problem I see right now is that the minimised file ( |
|
Oops! I forgot to make sure that it worked with Vercel. 🤦♂️ Vercel looks for the https://latex-css-git-fork-jcbhmr-use-vite-vincentdoerig.vercel.app/style.min.css Here is a screenshot of the above ⬆ URL:
Does this fix it? |
|
Hey, do you mind reopening this PR? I had plans on merging this one, but wanted to get through with the others to avoid any merging conflicts. I apologise for the lack of communication and want to thank you for the meaningful contribution:). |
|
Sure! I had just figured that is continue with the fork on my own to avoid spamming you with PR after PR that would increasingly become based on each other. You can check out some of my changes and additions https://github.com/jcbhmr/latexlike The big one so far is the storybook website example showcase instead of the demo pages. https://jcbhmr.github.io/latexlike/?path=/docs/blockquote--alone |
|
Thanks again for the PR, I apologise again for the delays... One last thing I noticed is that we probably should not inline all the fonts into the minified file, since the resulting file size of |
Good catch! I didn't even think about that. 🤦♂️ We could use something like https://github.com/ManBearTM/vite-plugin-no-bundle/#readme and just copy over all the font files. Probably. I haven't tried this yet, but I think this is the solution. Sitenote: do you know if Chrome or Firefox will always eagerly load fonts if they aren't used (like if I define You could also require "Load one of the following fonts with your own font-loading mechanism, and we'll automatically use that" though that would be a breaking change and require more justification than just "it was too hard to do what we do now with Vite". <link rel="stylesheet" href="https://unpkg.com/panduck-font-libertinus" />
<link rel="stylesheet" href="https://unpkg.com/latex.css" /> |
|
Yes, so I would personally avoid introducing a breaking change. |
This PR would...
style.min.cssas a side-effect of using ViteWhy this is a good idea
https://vitejs.dev/guide/features.html#css
Vite is really good. Like really good in terms of developer experience, tooling support, popularity, etc. It seems to be the absolute no-brainer option for bundling, building, etc. today. This may change in the future, and if it does I encourage you to move to whatever the best thing becomes. But right now I think this is a good build tool to migrate too.
Here's some stats from the State of JS 2022 survey to back up that Vite is on top right now:
Vite even supports SASS, SCSS,
@import-bundling, PostCSS, etc. out of the box. This would open this project up to using SASS or SCSS,@import(...)-bundling, etc. that all compiles to the exact same CSS that we have now! 😎