Export project with Nextjs Tailwind Emotion loses tailwind css styles - next.js

Question

I'm starting a new Next.js project that has existing emotion.js styles, now I'm trying to add tailwind, via this instruction https://tailwindcss.com/docs/guides/nextjs
Here is my postcss.config.js
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}
and tailwind.config.js
module.exports = {
purge: [
'./pages/**/*.js',
'./components/**/*.js',
'./lib/**/*/js'
],
darkMode: 'class', // or 'media' or 'class'
theme: {
extend: {},
},
variants: {
extend: {},
},
plugins: []
}
and next.config.js
module.exports = {
images: {
domains: [
'user-images.githubusercontent.com'
]
},
typescript: {
ignoreBuildErrors: true
},
eslint: {
ignoreDuringBuilds: true
}
}
Here is how I use Tailwind in /styles/global.css
#tailwind base;
#tailwind components;
#tailwind utilities;
and include that css in /pages/_app.js
import '../styles/globals.css'
function MyApp({ Component, pageProps }) {
return <Component {...pageProps} />
}
export default MyApp
All styles look OK when I run next dev, but when I do next build && next export, it exports to /out folder but when I try running index.html it has no tailwind styles, however my emotion.js styles are still working.
I've tried searching all answers here about this but none of them work.
I suspect it has to do with conflicts with emotion.js with instruction like jsxImportSource
Here is how I use emotion.js. It runs fine during development though
/** #jsxImportSource #emotion/react */
import { useState, useEffect } from 'react';
import { css, jsx } from '#emotion/react'
function App() {
}

Answer 1

After checking the generated out/index.html I found out that the stylesheet has an absolute link, changing it to a relative link fixes the issue.
Change from
<link rel="preload" href="/_next/static/css/c8843280217d36ba4773.css"
to
<link rel="preload" href="./_next/static/css/c8843280217d36ba4773.css"
Not sure what it is this way, there seems to be discussion about Use relative URLs instead of absolute but for now I make a custom script that auto-update the link to be a relative path
htmlContent
.replace('link rel="stylesheet" href="/_next/static', `link rel="stylesheet" href="./_next/static`)