In the error window, [TWIND_INVALID_CLASS] Unknown class ... continues to appear

[wonkyDD]

Describe the bug

If I check at chrome://extensions/?errors=<extension_id>,
it shows a warning related to twind

With each additional tailwind selector, the warnings grow out of control, obscuring the errors that should be checked.

It's not just a popup issue, I keep getting the same warning when I open newtab as well. I've confirmed that options is fine.

To Reproduce

1. git clone https://github.com/Jonghakseo/chrome-extension-boilerplate-react-vite.git
2. pnpm install
3. pnpm dev
4. Load unpacked extension in the dist/ path
5. open new tab or popup

Expected behavior
Do not show any warning.

Desktop (please complete the following information):

• OS: Mac 13.0.1
• Browser chrome 118.0.5993.117
• Node Version v18.17.1

[github-actions]

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

[PatrykKuniczak]

Describe the bug

If I check at chrome://extensions/?errors=<extension_id>,
it shows a warning related to twind

With each additional tailwind selector, the warnings grow out of control, obscuring the errors that should be checked.

It's not just a popup issue, I keep getting the same warning when I open newtab as well. I've confirmed that options is fine.

To Reproduce

1. git clone https://github.com/Jonghakseo/chrome-extension-boilerplate-react-vite.git
2. pnpm install
3. pnpm dev
4. Load unpacked extension in the dist/ path
5. open new tab or popup

Expected behavior
Do not show any warning.

Desktop (please complete the following information):

• OS: Mac 13.0.1
• Browser chrome 118.0.5993.117
• Node Version v18.17.1

Owner know twid is a big trouble, he want to remove that, its under investigation 😁

[wonkyDD]

@PatrykKuniczak Thanks for letting me know!

By the way If the owner were to remove twind,
would the only way to do that be to follow the pull request and copy it piece by piece?
Is there any other best practice?

I'm not sure how much removing twind would change the template.

[PatrykKuniczak]

@wonkyDD here's this comment in my issue #184 (comment)

If you thing about remove twind after PR, then yes, seeing PR an copy changed lines or IMO better, copy entire file when the change is done is good strategy, IDn how much it change project, we will see 😁

On my project i remove it but i see the bug from issue above, still ocurr, i think i don't remove STH

[Jonghakseo]

• fix: remove twind from project #244

I have removed the dependencies and code related to TWIND in the above PR. It would be helpful if you could refer to the changes in this PR and remove them from your existing project.

As mentioned in the PR, users have their own preferred style solutions. People who do not use this boilerplate should not have to worry about removing unnecessary style code written in TWIND(also other solution).

Personally, I use ChakraUI or emotion for styling the content script. Others may use MUI or Antd or inline style objects.

Some suggest that it would be better to provide guidelines for setting up the style instead of adding style-related dependencies to the repository.

[Jonghakseo]

I think I can create a user guide for emotion and ChakraUI. I'll add them as I test them.

And I'll add them to the README.md.

[Jonghakseo]

@all-contributors please add @wonkyDD for bug

[allcontributors]

@Jonghakseo

I've put up a pull request to add @wonkyDD! 🎉