denoland / fresh

The next-gen web framework.
https://fresh.deno.dev
MIT License
12.54k stars 648 forks source link

fix: add note about viewport meta when migrating to Tailwind #2209

Closed mrkjdy closed 10 months ago

mrkjdy commented 10 months ago

The purpose of this PR is to add a note about setting the <meta name="viewport" content="width=device-width, initial-scale=1.0" /> in the <head> when migrating to Tailwind from Twind. This took me a while to figure out.

marvinhagemeister commented 10 months ago

Huh, the twind plugin never set that tag. There is no code for it in there or in twind itself that would do that. Maybe something else was going on in your project?

mrkjdy commented 10 months ago

Yep, turns out it gets automatically added if you wrap everything in your _app.tsx in a fragment component (<>).

At some point I switched from a fragment component to an <html> and I didn't realize that it would break things. I didn't know it was missing because I didn't know it was automatically added previously.

Maybe there's a better place to add info about this?

marvinhagemeister commented 10 months ago

Yeah, the way of writing Fresh a while back relied on a lot of magic like this where tags were added behind the scenes. That's why we've switched to being explicit about this in _app.tsx with adding the <html>-tag. Transitioning from the old model to the new one might be a bit unexpected if done for the first time, but I think the model makes a lot more sense where we don't do a bunch of magic stuff.