Update Expo example app to enable static CSS extraction

[javascripter]

Why

ref. #236

This PR adds the ability to extract CSS in the example Expo app on the web by using postcss-react-strict-dom, as suggested in this comment.

How

1. Configure psotcss-react-strict-dom
2. Disable runtimeInjection: opts.dev hack and always set runtimeInjection to false

• We can pass dev: false in the metro.config.js instead to disable runtimeInjection but that disables debug classsName generation during development, so I changed the default to false to match the output with the original branch in dev

3. Add @expo/metro-runtime to enable Fast Refresh

• This is required when importing global css files in Expo Web. Without this css won't update on code changes

Known issues

Code and Pre elements render discrepancy

code and pre elements seem smaller than the expected output. The expected font family for these elements are monospace, monospace (this code).

However, in my branch the applied font-family is monospace. monospace, monospace seems to be a hack to force browsers to render monospace fonts in the expected font-size but because of the property value normalization the hack gets removed.

This seems to be an issue with Expo Web CSS post-processing, as removing postcss config and just writing html { font-family: monospace, monospace; } in the global css results in the same behavior.
I suspect this to be related to the usage of lightningcss in Expo but I have not confirmed it.
https://github.com/expo/expo/blob/cd39671d70ad59277af77f156920002a148ca4a3/packages/%40expo/metro-config/src/transform-worker/transform-worker.ts#L222

Actual:

Expected:

Test Plan

• Compare the output of the example page with the main branch by running npm run dev:web --clear command in the apps/examples directory.
  • the rendered result seem to be identical except for one issue described in Known Issues
• Edit App.tsx to check that Fast Refresh still works
• Run npx expo export -p web to check that production builds successfully run and the generated static css is outputted to apps/examples/dist/_expo/static/css/*.css

[necolas]

I used require.resolve('react-strict-dom') in #239.
See javascripter/postcss-react-strict-dom#3

[necolas]

I fixed the monospace regression by changing the value to monospace, "monospace", which prevents the tooling from de-duping it.

[necolas]

I added you as a co-author to #239, as I picked up a few of the edits you made in this patch.