Jonghakseo / chrome-extension-boilerplate-react-vite

Chrome Extension Boilerplate with React + Vite + Typescript
MIT License
2.43k stars 357 forks source link

How to add Material UI #651

Closed codergigachad closed 2 months ago

codergigachad commented 3 months ago

I want to make an extension for google products, so I need to add Material UI in content scripts to match the design language. So far Material UI works in popup but doesn't work inside content scripts. The component html shows on the page but the css and maybe even js doesn't work. Maybe I need to manually build the css for material but I don't know how to do it can you please help.

An alternative to this for this repo can be material tailwind. If material doesn't work, can you please tell me how to use material tailwind.

github-actions[bot] commented 3 months ago

Thank you for your contribution. We will check and reply to you as soon as possible.

wonkyDD commented 3 months ago

@Jonghakseo @PatrykKuniczak

It would be great to have some incentives or systems in this repo to actively create integration guides for various UI libraries including shadcn, daisy, next, etc... including mui.

It might be a good idea to pin the issue or add some notices into readme as well.

I remember that quite a few issues titled somewhat of how to add/integrate xxx ui? were opened often even during the legacy version.

And mostly content-ui has caused it.

PatrykKuniczak commented 3 months ago

@Jonghakseo @PatrykKuniczak

It would be great to have some incentives or systems in this repo to actively create integration guides for various UI libraries including shadcn, daisy, next, etc... including mui.

It might be a good idea to pin the issue or add some notices into readme as well.

I remember that quite a few issues titled somewhat of how to add/integrate xxx ui? were opened often even during the legacy version.

And mostly content-ui has caused it.

You can open that issue, and list all packages which you want to integrate, and we can pin it 😁

codergigachad commented 3 months ago

@wonkyDD @PatrykKuniczak That's a good initiative for this project's future, but can you please tell me how to add MUI right now.

PatrykKuniczak commented 3 months ago

@wonkyDD @PatrykKuniczak That's a good initiative for this project's future, but can you please tell me how to add MUI right now.

https://github.com/PatrykKuniczak/YT_Notifier/tree/main/react-app

Here i have mui with styled components, but there's legacy version, but config should be similar

codergigachad commented 3 months ago

@PatrykKuniczak This repository doesn't utilize any MUI component in content scripts. Can you provide me the code on how to do it.

PatrykKuniczak commented 3 months ago

@codergigachad OO i was missed, you want to inject in into content script.

I didn't done it never before.

I need to take a look for that, but i'm not able to do it now.

PatrykKuniczak commented 2 months ago

@codergigachad If you still struggling with this, feel free to visit us on Discord

PatrykKuniczak commented 2 months ago

If you still have problem with it, let's visit our Discord.

We have on legacy some tutorials to add several UI packages: https://github.com/Jonghakseo/chrome-extension-boilerplate-react-vite/tree/legacy?tab=readme-ov-file#add-style-library-

We need to add it in new docs