Bundle css into js

I am trying to make React component libraries with css modules. I am using vite to bundle and publishing to npm.

This is vite.config.js

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
const path = require("path");

module.exports = defineConfig({
  plugins: [react()],
  build: {
    minify: "terser",
    lib: {
      entry: path.resolve(__dirname, "components/index.js"),
      name: "@abhic91/core",
      fileName: (format) => `core.${format}.js`,
    },
    rollupOptions: {
      external: ["react", "@mui/material/Button"],
      output: {
        globals: {
          react: "React",
        },
      },
    },
  },
});

This gives a separate style.css file with ._borderred_1ab7n_1{border:1px solid green}

But someone using the library should import the css file also. Can I somehow bundle the css into js so that it doesn't have to be imported separately?

Also, the minify doesn't work.

And how do I ignore all @mui/material components instead of specifying separately in rollupOptions.external