#Mui material with React and Packup

2 messages · Page 1 of 1 (latest)

tranquil fiber
#

Using the following deno.jsonc, index.html, and main.tsx: I'm able to display material components, however, a lot of styles aren't working properly. This is using packup index.html. Image attached. How could I include the approprate styles? I saw this was asked before, but the thread ended inconclusively.

{
  "compilerOptions": {
    "jsx": "react",
    "jsxFactory": "React.createElement",
    "lib": ["dom", "dom.iterable", "esnext"]
  }
}
<html>
  <head>
    <title>with-simple-assets document</title>
    <script src="main.tsx" defer></script>
  </head>
  <body></body>
</html>
import * as React from "https://esm.sh/[email protected]";
import { createRoot } from "https://esm.sh/[email protected]/client";
import { Box, Button, CssBaseline } from "https://esm.sh/@mui/[email protected]";
import {} from "https://esm.sh/@emotion/[email protected]";
import {} from "https://esm.sh/@emotion/[email protected]";

function App() {
  return (
    <Box sx={{ flexGrow: 1 }}>
      <CssBaseline />
      <Button>Login</Button>
    </Box>
  );
}

createRoot(document.querySelector("body")!).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
);
#

Here's an example with more content: