Merge branch 'main' into feat/i18n

README.md

@@ -1,13 +1,20 @@
 <div align="center">
 
-![](https://github.com/user-attachments/assets/99cb6303-64e4-4bed-bf3f-35735353e6de)
+<picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://github.com/user-attachments/assets/99cb6303-64e4-4bed-bf3f-35735353e6de" />
+    <source media="(prefers-color-scheme: light)" srcset="https://github.com/user-attachments/assets/a5dbf71c-c509-4c4f-80f4-be88a1943b0a" />
+    <img alt="Logo" src="https://github.com/user-attachments/assets/99cb6303-64e4-4bed-bf3f-35735353e6de" />
+</picture>
 
 ![](https://img.shields.io/badge/React-61DAFB?style=flat-square&logo=react&logoColor=black)
 ![](https://img.shields.io/badge/Typescript-3178C6?style=flat-square&logo=typescript&logoColor=white)
 ![](https://badges.aleen42.com/src/vitejs.svg)
 
 ![GitHub action badge](https://github.com/Jonghakseo/chrome-extension-boilerplate-react-vite/actions/workflows/build-zip.yml/badge.svg)
+![GitHub action badge](https://github.com/Jonghakseo/chrome-extension-boilerplate-react-vite/actions/workflows/lint.yml/badge.svg)
+
 <img src="https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https://github.com/Jonghakseo/chrome-extension-boilerplate-react-viteFactions&count_bg=%23#222222&title_bg=%23#454545&title=😀&edge_flat=true" alt="hits"/>
+<a href="https://discord.gg/Nu5Rf8xr" target="_blank"><img src="https://discord.com/api/guilds/1263404974830915637/widget.png"/></a>
 
 > This boilerplate
 > has [Legacy version](https://github.com/Jonghakseo/chrome-extension-boilerplate-react-vite/tree/legacy)
@@ -34,6 +41,7 @@
     - [Procedures](#procedures)
         - [Chrome](#chrome)
         - [Firefox](#firefox)
+- [Community](#community)
 - [Reference](#reference)
 - [Star History](#starhistory)
 - [Contributors](#contributors)
@@ -108,28 +116,41 @@ Some shared packages
 - `dev-utils` - utils for chrome extension development (manifest-parser, logger)
 - `hmr` - custom HMR plugin for vite, injection script for reload/refresh, hmr dev-server
 - `shared` - shared code for entire project. (types, constants, custom hooks, components, etc.)
-- `tsconfig` - shared tsconfig for entire project.
+- `storage` - helpers for storage easier integration with, e.g local, session storages
+- `tailwind-config` - shared tailwind config for entire project
+- `tsconfig` - shared tsconfig for entire project
+- `ui` - here's a function to merge your tailwind config with global one, and you can save components here
+- `vite-config` - shared vite config for entire project
+- `zipper` - By ```pnpm zip``` you can pack ```dist``` folder into ```extension.zip``` inside newly created ```dist-zip``` 
 
 ### Pages <a name="pages"></a>
 
 - `content` - [content script](https://developer.chrome.com/docs/extensions/mv3/content_scripts/) for chrome
   extension (`content_scripts` in manifest.json)
 - `content-ui` - [content script](https://developer.chrome.com/docs/extensions/mv3/content_scripts/) for render UI in
   user's page (`content_scripts` in manifest.json)
+- `content-runtime` - [content runtime script](https://developer.chrome.com/docs/extensions/develop/concepts/content-scripts#functionality)
+   this can be inject from `popup` like standard `content`
 - `devtools` - [devtools](https://developer.chrome.com/docs/extensions/mv3/devtools/#creating) for chrome
   extension (`devtools_page` in manifest.json)
 - `devtools-panel` - devtools panel for [devtools](pages/devtools/src/index.ts)
-- `newtab` - [new tab](https://developer.chrome.com/docs/extensions/mv3/override/) for chrome
-  extension (`chrome_url_overrides.newtab` in
-  manifest.json)
+- `new-tab` - [new tab](https://developer.chrome.com/docs/extensions/mv3/override/) for chrome
+extension (`chrome_url_overrides.newtab` in manifest.json)
 - `options` - [options](https://developer.chrome.com/docs/extensions/mv3/options/) for chrome extension (`options_page`
   in manifest.json)
 - `popup` - [popup](https://developer.chrome.com/docs/extensions/reference/browserAction/) for chrome
   extension (`action.default_popup` in
   manifest.json)
-- `sidepanel` - [sidepanel(Chrome 114+)](https://developer.chrome.com/docs/extensions/reference/sidePanel/) for chrome
+- `side-panel` - [sidepanel(Chrome 114+)](https://developer.chrome.com/docs/extensions/reference/sidePanel/) for chrome
   extension (`side_panel.default_path` in manifest.json)
 
+## Community <a name="community"></a>
+
+To chat with other community members, you can join the [Discord](https://discord.gg/Nu5Rf8xr) server.
+You can ask questions on that server, and you can also help others.
+
+Also, suggest new features or share any challenges you've faced while developing Chrome extensions!
+
 ## Reference <a name="reference"></a>
 
 - [Vite Plugin](https://vitejs.dev/guide/api-plugin.html)

chrome-extension/utils/plugins/make-manifest-plugin.ts

@@ -29,7 +29,7 @@ export default function makeManifestPlugin(config: { outDir: string }): PluginOp
     }
     const manifestPath = resolve(to, 'manifest.json');
 
-    const isFirefox = process.env.__FIREFOX__;
+    const isFirefox = process.env.__FIREFOX__ === 'true';
     fs.writeFileSync(manifestPath, ManifestParser.convertManifestToString(manifest, isFirefox ? 'firefox' : 'chrome'));
 
     colorLog(`Manifest file copy complete: ${manifestPath}`, 'success');

package.json

@@ -55,7 +55,7 @@
     "rimraf": "^6.0.1",
     "tailwindcss": "^3.4.6",
     "tslib": "^2.6.3",
-    "turbo": "^2.0.9",
+    "turbo": "^2.0.12",
     "typescript": "5.5.3",
     "vite": "5.3.3",
     "run-script-os": "^1.1.6"

packages/ui/package.json

@@ -4,6 +4,7 @@
   "description": "chrome extension ui components",
   "private": true,
   "sideEffects": false,
+  "type": "module",
   "files": [
     "dist/**",
     "dist/global.css"