From 2e296c05bd4d4b39e67b6897ed69761aa9f449fe Mon Sep 17 00:00:00 2001 From: Jonghakseo Date: Sun, 5 Nov 2023 16:48:49 +0900 Subject: [PATCH 1/2] fix: remove twind from project --- README.md | 1 - package.json | 3 -- pnpm-lock.yaml | 55 --------------------- src/pages/content/components/Demo/app.tsx | 2 +- src/pages/content/components/Demo/index.tsx | 2 - src/pages/newtab/Newtab.tsx | 2 +- src/pages/newtab/index.tsx | 2 - src/pages/options/Options.tsx | 2 +- src/pages/panel/Panel.tsx | 2 +- src/pages/panel/index.tsx | 2 - src/pages/popup/Popup.tsx | 2 +- src/pages/popup/index.tsx | 2 - src/shared/style/twind.ts | 13 ----- twind.config.ts | 7 --- 14 files changed, 5 insertions(+), 92 deletions(-) delete mode 100644 src/shared/style/twind.ts delete mode 100644 twind.config.ts diff --git a/README.md b/README.md index 139dc8e98..0e8000950 100755 --- a/README.md +++ b/README.md @@ -41,7 +41,6 @@ This boilerplate is made for creating chrome extensions using React and Typescri - [React Testing Library](https://testing-library.com/docs/react-testing-library/intro/) - [Vite](https://vitejs.dev/) - [SASS](https://sass-lang.com/) -- [Twind](https://twind.dev/) - [Prettier](https://prettier.io/) - [ESLint](https://eslint.org/) - [Husky](https://typicode.github.io/husky/getting-started.html#automatic-recommended) diff --git a/package.json b/package.json index 7ecd3700d..e70e35829 100644 --- a/package.json +++ b/package.json @@ -33,9 +33,6 @@ "@commitlint/config-conventional": "^17.7.0", "@rollup/plugin-typescript": "^8.5.0", "@testing-library/react": "13.4.0", - "@twind/core": "^1.1.3", - "@twind/preset-autoprefix": "^1.0.7", - "@twind/preset-tailwind": "^1.1.4", "@types/chrome": "0.0.224", "@types/jest": "29.0.3", "@types/node": "18.15.11", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 0cc737532..f0d9c2a18 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -28,15 +28,6 @@ devDependencies: '@testing-library/react': specifier: 13.4.0 version: 13.4.0(react-dom@18.2.0)(react@18.2.0) - '@twind/core': - specifier: ^1.1.3 - version: 1.1.3(typescript@4.9.5) - '@twind/preset-autoprefix': - specifier: ^1.0.7 - version: 1.0.7(@twind/core@1.1.3)(typescript@4.9.5) - '@twind/preset-tailwind': - specifier: ^1.1.4 - version: 1.1.4(@twind/core@1.1.3)(typescript@4.9.5) '@types/chrome': specifier: 0.0.224 version: 0.0.224 @@ -1182,48 +1173,6 @@ packages: resolution: {integrity: sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==} dev: true - /@twind/core@1.1.3(typescript@4.9.5): - resolution: {integrity: sha512-/B/aNFerMb2IeyjSJy3SJxqVxhrT77gBDknLMiZqXIRr4vNJqiuhx7KqUSRzDCwUmyGuogkamz+aOLzN6MeSLw==} - engines: {node: '>=14.15.0'} - peerDependencies: - typescript: ^4.8.4 - peerDependenciesMeta: - typescript: - optional: true - dependencies: - csstype: 3.1.2 - typescript: 4.9.5 - dev: true - - /@twind/preset-autoprefix@1.0.7(@twind/core@1.1.3)(typescript@4.9.5): - resolution: {integrity: sha512-3wmHO0pG/CVxYBNZUV0tWcL7CP0wD5KpyWAQE/KOalWmOVBj+nH6j3v6Y3I3pRuMFaG5DC78qbYbhA1O11uG3w==} - engines: {node: '>=14.15.0'} - peerDependencies: - '@twind/core': ^1.1.0 - typescript: ^4.8.4 - peerDependenciesMeta: - typescript: - optional: true - dependencies: - '@twind/core': 1.1.3(typescript@4.9.5) - style-vendorizer: 2.2.3 - typescript: 4.9.5 - dev: true - - /@twind/preset-tailwind@1.1.4(@twind/core@1.1.3)(typescript@4.9.5): - resolution: {integrity: sha512-zv85wrP/DW4AxgWrLfH7kyGn/KJF3K04FMLVl2AjoxZGYdCaoZDkL8ma3hzaKQ+WGgBFRubuB/Ku2Rtv/wjzVw==} - engines: {node: '>=14.15.0'} - peerDependencies: - '@twind/core': ^1.1.0 - typescript: ^4.8.4 - peerDependenciesMeta: - typescript: - optional: true - dependencies: - '@twind/core': 1.1.3(typescript@4.9.5) - typescript: 4.9.5 - dev: true - /@types/aria-query@5.0.3: resolution: {integrity: sha512-0Z6Tr7wjKJIk4OUEjVUQMtyunLDy339vcMaj38Kpj6jM2OE1p3S4kXExKZ7a3uXQAPCoy3sbrP1wibDKaf39oA==} dev: true @@ -5933,10 +5882,6 @@ packages: engines: {node: '>=8'} dev: true - /style-vendorizer@2.2.3: - resolution: {integrity: sha512-/VDRsWvQAgspVy9eATN3z6itKTuyg+jW1q6UoTCQCFRqPDw8bi3E1hXIKnGw5LvXS2AQPuJ7Af4auTLYeBOLEg==} - dev: true - /supports-color@5.5.0: resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==} engines: {node: '>=4'} diff --git a/src/pages/content/components/Demo/app.tsx b/src/pages/content/components/Demo/app.tsx index 42987f1e7..f732ea4ae 100644 --- a/src/pages/content/components/Demo/app.tsx +++ b/src/pages/content/components/Demo/app.tsx @@ -5,5 +5,5 @@ export default function App() { console.log('content view loaded'); }, []); - return
content view
; + return
content view
; } diff --git a/src/pages/content/components/Demo/index.tsx b/src/pages/content/components/Demo/index.tsx index 8e01cd848..9fd18312f 100644 --- a/src/pages/content/components/Demo/index.tsx +++ b/src/pages/content/components/Demo/index.tsx @@ -1,7 +1,6 @@ import { createRoot } from 'react-dom/client'; import App from '@src/pages/content/components/Demo/app'; import refreshOnUpdate from 'virtual:reload-on-update-in-view'; -import { attachTwindStyle } from '@src/shared/style/twind'; refreshOnUpdate('pages/content'); @@ -22,6 +21,5 @@ shadowRoot.appendChild(rootIntoShadow); * In the firefox environment, the adoptedStyleSheets bug may prevent contentStyle from being applied properly. * Please refer to the PR link above and go back to the contentStyle.css implementation, or raise a PR if you have a better way to improve it. */ -attachTwindStyle(rootIntoShadow, shadowRoot); createRoot(rootIntoShadow).render(); diff --git a/src/pages/newtab/Newtab.tsx b/src/pages/newtab/Newtab.tsx index 64050b7fc..fb5914213 100644 --- a/src/pages/newtab/Newtab.tsx +++ b/src/pages/newtab/Newtab.tsx @@ -21,7 +21,7 @@ const Newtab = () => { Learn React!
The color of this paragraph is defined using SASS.
- The color of this paragraph is defined using Tailwind CSS. + The color of this paragraph is defined using Tailwind CSS.