create-packer 1.43.13 → 1.43.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (113) hide show
  1. package/package.json +1 -1
  2. package/template/lib/workspace/packages/ts/package.json +2 -2
  3. package/template/web-app/react-rsbuild/domain/app/components/app-context.tsx +21 -3
  4. package/template/web-app/react-rsbuild/domain/app/components/app.tsx +5 -3
  5. package/template/web-app/react-rsbuild/domain/app/startApp.tsx +6 -6
  6. package/template/web-app/react-rsbuild/domain/router/router.tsx +0 -1
  7. package/template/web-app/react-rsbuild/env.d.ts +6 -2
  8. package/template/web-app/react-rsbuild/main.tsx +3 -3
  9. package/template/web-app/react-rsbuild/package.json +4 -2
  10. package/template/web-app/react-rsbuild/pages/home/view.styled.ts +4 -6
  11. package/template/web-app/react-rsbuild/pages/home/view.tsx +10 -11
  12. package/template/web-app/react-rsbuild/postcss.config.cjs +7 -7
  13. package/template/web-app/react-rsbuild/rsbuild.config.ts +14 -9
  14. package/template/web-app/react-rsbuild/shared/service/home.ts +6 -4
  15. package/template/web-app/react-rsbuild/shared/styles/global-style.tsx +14 -0
  16. package/template/web-app/react-rsbuild/shared/styles/index.ts +2 -0
  17. package/template/web-app/react-rsbuild/tsconfig.node.json +1 -1
  18. package/template/web-app/react-vite/domain/app/components/app-context.tsx +21 -3
  19. package/template/web-app/react-vite/domain/app/components/app.tsx +5 -3
  20. package/template/web-app/react-vite/domain/router/router.tsx +0 -1
  21. package/template/web-app/react-vite/package.json +4 -1
  22. package/template/web-app/react-vite/pages/home/view.styled.ts +4 -6
  23. package/template/web-app/react-vite/pages/home/view.tsx +3 -4
  24. package/template/web-app/react-vite/shared/service/home.ts +6 -4
  25. package/template/web-app/react-vite/shared/styles/global-style.tsx +14 -0
  26. package/template/web-app/react-vite/shared/styles/index.ts +2 -0
  27. package/template/web-app/{react-rsbuild/shared/theme → react-vite/shared/styles}/theme.styled.ts +0 -1
  28. package/template/web-app/react-vite/vite-env.d.ts +5 -4
  29. package/template/web-app/react-vite/vite.config.ts +78 -78
  30. package/template/web-app/vue/domain/app/components/app.vue +1 -1
  31. package/template/web-app/vue/main.ts +1 -1
  32. package/template/web-app/vue/package.json +2 -2
  33. package/template/web-app/vue/vite.config.ts +4 -4
  34. package/template/web-app/vue-rsbuild/domain/app/components/app.vue +1 -1
  35. package/template/web-app/vue-rsbuild/main.ts +1 -1
  36. package/template/web-app/vue-rsbuild/package.json +2 -2
  37. package/template/web-app/vue-rsbuild/tsconfig.node.json +2 -2
  38. package/template/web-extension/.wxt/eslint-auto-imports.mjs +29 -1
  39. package/template/web-extension/.wxt/types/imports-module.d.ts +20 -0
  40. package/template/web-extension/.wxt/types/imports.d.ts +45 -17
  41. package/template/web-extension/.wxt/types/paths.d.ts +1 -0
  42. package/template/web-extension/.wxt/wxt.d.ts +1 -1
  43. package/template/web-extension/entrypoints/content/constants/base.ts +1 -1
  44. package/template/web-extension/entrypoints/content/constants/index.ts +1 -1
  45. package/template/web-extension/entrypoints/content/domain/app/tools/insertApp.tsx +58 -58
  46. package/template/web-extension/entrypoints/content/index.tsx +1 -1
  47. package/template/web-extension/entrypoints/content/modules/common/common.tsx +10 -10
  48. package/template/web-extension/entrypoints/popup/main.tsx +2 -2
  49. package/template/web-extension/package.json +4 -2
  50. package/template/web-extension/shared/components/app-context/index.ts +1 -0
  51. package/template/web-extension/shared/components/{app-context.tsx → app-context/view.tsx} +4 -2
  52. package/template/web-extension/shared/components/index.ts +1 -1
  53. package/template/web-extension/shared/styles/global-style.tsx +14 -0
  54. package/template/web-extension/shared/styles/index.ts +2 -2
  55. package/template/web-extension/vite-env.d.ts +3 -3
  56. package/template/web-extension/wxt.config.ts +10 -4
  57. package/template/nest/.eslintrc.js +0 -25
  58. package/template/nest/.gitignore +0 -35
  59. package/template/nest/.husky/pre-commit +0 -4
  60. package/template/nest/.prettierrc +0 -6
  61. package/template/nest/README.md +0 -73
  62. package/template/nest/nest-cli.json +0 -5
  63. package/template/nest/package.json +0 -82
  64. package/template/nest/src/app.controller.spec.ts +0 -22
  65. package/template/nest/src/app.controller.ts +0 -12
  66. package/template/nest/src/app.module.ts +0 -10
  67. package/template/nest/src/app.service.ts +0 -8
  68. package/template/nest/src/main.ts +0 -10
  69. package/template/nest/src/utils/transform.interceptor.ts +0 -26
  70. package/template/nest/test/app.e2e-spec.ts +0 -24
  71. package/template/nest/test/jest-e2e.json +0 -9
  72. package/template/nest/tsconfig.build.json +0 -5
  73. package/template/nest/tsconfig.json +0 -21
  74. package/template/web-app/next/.editorconfig +0 -14
  75. package/template/web-app/next/.eslintrc.json +0 -8
  76. package/template/web-app/next/.gitignore +0 -36
  77. package/template/web-app/next/.husky/commit-msg +0 -4
  78. package/template/web-app/next/.husky/pre-commit +0 -4
  79. package/template/web-app/next/.prettierrc +0 -12
  80. package/template/web-app/next/.stylelintrc +0 -29
  81. package/template/web-app/next/.vscode/extensions.json +0 -7
  82. package/template/web-app/next/README.md +0 -34
  83. package/template/web-app/next/app/favicon.ico +0 -0
  84. package/template/web-app/next/app/globals.css +0 -22
  85. package/template/web-app/next/app/layout.tsx +0 -18
  86. package/template/web-app/next/app/page.tsx +0 -113
  87. package/template/web-app/next/commitlint.config.cjs +0 -1
  88. package/template/web-app/next/next-env.d.ts +0 -5
  89. package/template/web-app/next/next.config.js +0 -5
  90. package/template/web-app/next/package.json +0 -47
  91. package/template/web-app/next/postcss.config.js +0 -6
  92. package/template/web-app/next/public/next.svg +0 -1
  93. package/template/web-app/next/public/vercel.svg +0 -1
  94. package/template/web-app/next/tailwind.config.js +0 -20
  95. package/template/web-app/next/tsconfig.json +0 -21
  96. package/template/web-app/react-rsbuild/domain/app/app.styled.ts +0 -3
  97. package/template/web-app/react-rsbuild/shared/theme/index.ts +0 -1
  98. package/template/web-app/react-vite/domain/app/app.styled.ts +0 -3
  99. package/template/web-app/react-vite/shared/theme/index.ts +0 -1
  100. package/template/web-app/vue/tailwind.config.cjs +0 -15
  101. package/template/web-app/vue-rsbuild/tailwind.config.cjs +0 -15
  102. package/template/web-extension/shared/styles/global.styled.ts +0 -9
  103. /package/template/web-app/{react-vite/shared/theme → react-rsbuild/shared/styles}/theme.styled.ts +0 -0
  104. /package/template/web-app/vue/{router → domain/router}/home/index.ts +0 -0
  105. /package/template/web-app/vue/{router → domain/router}/home/names.ts +0 -0
  106. /package/template/web-app/vue/{router → domain/router}/home/routes.ts +0 -0
  107. /package/template/web-app/vue/{router → domain/router}/index.ts +0 -0
  108. /package/template/web-app/vue/{router → domain/router}/names.ts +0 -0
  109. /package/template/web-app/vue-rsbuild/{router → domain/router}/home/index.ts +0 -0
  110. /package/template/web-app/vue-rsbuild/{router → domain/router}/home/names.ts +0 -0
  111. /package/template/web-app/vue-rsbuild/{router → domain/router}/home/routes.ts +0 -0
  112. /package/template/web-app/vue-rsbuild/{router → domain/router}/index.ts +0 -0
  113. /package/template/web-app/vue-rsbuild/{router → domain/router}/names.ts +0 -0
@@ -3,7 +3,7 @@
3
3
  </template>
4
4
 
5
5
  <script setup lang="ts">
6
- import { router, routerNames } from '@/router'
6
+ import { router, routerNames } from '@/domain/router'
7
7
 
8
8
  router.beforeEach(async to => {
9
9
  if (!Object.values(routerNames).includes(to.name as string)) {
@@ -1,5 +1,5 @@
1
1
  import { createPinia } from 'pinia'
2
- import { router } from '@/router'
2
+ import { router } from '@/domain/router'
3
3
  import { app } from '@/domain/app'
4
4
  import './style.css'
5
5
 
@@ -22,7 +22,7 @@
22
22
  "axios": "1.7.9",
23
23
  "lodash-es": "4.17.21",
24
24
  "pinia": "2.3.1",
25
- "tailwindcss": "4.0.9",
25
+ "tailwindcss": "4.1.4",
26
26
  "type-fest": "4.33.0",
27
27
  "vue": "3.5.13",
28
28
  "vue-router": "4.5.0"
@@ -33,7 +33,7 @@
33
33
  "@commitlint/cz-commitlint": "17.5.0",
34
34
  "@eslint/js": "9.15.0",
35
35
  "@faker-js/faker": "8.4.1",
36
- "@tailwindcss/vite": "4.0.9",
36
+ "@tailwindcss/vite": "4.1.4",
37
37
  "@types/lodash-es": "4.17.12",
38
38
  "@types/mockjs": "1.0.10",
39
39
  "@vitejs/plugin-vue": "5.2.1",
@@ -16,6 +16,9 @@ export default defineConfig(({ mode }) => {
16
16
  const proxyBaseUrl = env.VITE_BASE_URL + env.VITE_API_HOST
17
17
  const plugins: any[] = [
18
18
  tailwindcss(),
19
+ mockDevServer({
20
+ include: ['**/*.mock.{ts,js}']
21
+ }),
19
22
  vueJsx({
20
23
  enableObjectSlots: false
21
24
  }),
@@ -25,10 +28,7 @@ export default defineConfig(({ mode }) => {
25
28
  typescript: true,
26
29
  eslint: { useFlatConfig: true, lintCommand: 'eslint', dev: { logLevel: ['error'] } }
27
30
  }),
28
- svgLoader(),
29
- mockDevServer({
30
- include: ['**/*.mock.{ts,js}']
31
- })
31
+ svgLoader()
32
32
  ]
33
33
 
34
34
  if (mode === 'analyse') {
@@ -3,7 +3,7 @@
3
3
  </template>
4
4
 
5
5
  <script setup lang="ts">
6
- import { router, routerNames } from '@/router'
6
+ import { router, routerNames } from '@/domain/router'
7
7
 
8
8
  router.beforeEach(async to => {
9
9
  if (!Object.values(routerNames).includes(to.name as string)) {
@@ -1,5 +1,5 @@
1
1
  import { createPinia } from 'pinia'
2
- import { router } from '@/router'
2
+ import { router } from '@/domain/router'
3
3
  import { app } from '@/domain/app'
4
4
  import './style.css'
5
5
 
@@ -23,7 +23,7 @@
23
23
  "axios": "1.7.9",
24
24
  "lodash-es": "4.17.21",
25
25
  "pinia": "2.3.1",
26
- "tailwindcss": "4.0.9",
26
+ "tailwindcss": "4.1.4",
27
27
  "type-fest": "4.33.0",
28
28
  "vue": "3.5.13",
29
29
  "vue-router": "4.5.0"
@@ -39,7 +39,7 @@
39
39
  "@rsbuild/plugin-type-check": "1.2.1",
40
40
  "@rsbuild/plugin-vue": "1.0.7",
41
41
  "@rsdoctor/rspack-plugin": "0.4.13",
42
- "@tailwindcss/postcss": "4.0.9",
42
+ "@tailwindcss/postcss": "4.1.4",
43
43
  "@types/lodash-es": "4.17.12",
44
44
  "@types/mockjs": "1.0.10",
45
45
  "autoprefixer": "10.4.14",
@@ -2,9 +2,9 @@
2
2
  "compilerOptions": {
3
3
  "composite": true,
4
4
  "module": "ESNext",
5
- "moduleResolution": "bundler",
5
+ "moduleResolution": "node",
6
6
  "allowSyntheticDefaultImports": true,
7
7
  "resolveJsonModule": true
8
8
  },
9
- "include": ["scripts", "vite.config.ts", "package.json"]
9
+ "include": ["scripts", "rsbuild.config.ts", "package.json"]
10
10
  }
@@ -1,15 +1,42 @@
1
1
  const globals = {
2
+ "AutoMount": true,
3
+ "AutoMountOptions": true,
4
+ "Browser": true,
5
+ "ContentScriptAnchoredOptions": true,
6
+ "ContentScriptAppendMode": true,
2
7
  "ContentScriptContext": true,
8
+ "ContentScriptInlinePositioningOptions": true,
9
+ "ContentScriptModalPositioningOptions": true,
10
+ "ContentScriptOverlayAlignment": true,
11
+ "ContentScriptOverlayPositioningOptions": true,
12
+ "ContentScriptPositioningOptions": true,
13
+ "ContentScriptUi": true,
14
+ "ContentScriptUiOptions": true,
15
+ "IframeContentScriptUi": true,
16
+ "IframeContentScriptUiOptions": true,
17
+ "InjectScriptOptions": true,
18
+ "IntegratedContentScriptUi": true,
19
+ "IntegratedContentScriptUiOptions": true,
3
20
  "InvalidMatchPattern": true,
4
21
  "MatchPattern": true,
5
22
  "MigrationError": true,
23
+ "ScriptPublicPath": true,
24
+ "ShadowRootContentScriptUi": true,
25
+ "ShadowRootContentScriptUiOptions": true,
26
+ "StopAutoMount": true,
27
+ "StorageArea": true,
28
+ "StorageAreaChanges": true,
29
+ "StorageItemKey": true,
30
+ "WxtAppConfig": true,
31
+ "WxtStorage": true,
32
+ "WxtStorageItem": true,
33
+ "WxtWindowEventMap": true,
6
34
  "browser": true,
7
35
  "createIframeUi": true,
8
36
  "createIntegratedUi": true,
9
37
  "createShadowRootUi": true,
10
38
  "defineAppConfig": true,
11
39
  "defineBackground": true,
12
- "defineConfig": true,
13
40
  "defineContentScript": true,
14
41
  "defineUnlistedScript": true,
15
42
  "defineWxtPlugin": true,
@@ -23,6 +50,7 @@ export default {
23
50
  name: "wxt/auto-imports",
24
51
  languageOptions: {
25
52
  globals,
53
+ /** @type {import('eslint').Linter.SourceType} */
26
54
  sourceType: "module",
27
55
  },
28
56
  };
@@ -0,0 +1,20 @@
1
+ // Generated by wxt
2
+ // Types for the #import virtual module
3
+ declare module '#imports' {
4
+ export { browser, Browser } from 'wxt/browser';
5
+ export { storage, StorageArea, WxtStorage, WxtStorageItem, StorageItemKey, StorageAreaChanges, MigrationError } from 'wxt/utils/storage';
6
+ export { useAppConfig } from 'wxt/utils/app-config';
7
+ export { ContentScriptContext, WxtWindowEventMap } from 'wxt/utils/content-script-context';
8
+ export { createIframeUi, IframeContentScriptUi, IframeContentScriptUiOptions } from 'wxt/utils/content-script-ui/iframe';
9
+ export { createIntegratedUi, IntegratedContentScriptUi, IntegratedContentScriptUiOptions } from 'wxt/utils/content-script-ui/integrated';
10
+ export { createShadowRootUi, ShadowRootContentScriptUi, ShadowRootContentScriptUiOptions } from 'wxt/utils/content-script-ui/shadow-root';
11
+ export { ContentScriptUi, ContentScriptUiOptions, ContentScriptOverlayAlignment, ContentScriptAppendMode, ContentScriptInlinePositioningOptions, ContentScriptOverlayPositioningOptions, ContentScriptModalPositioningOptions, ContentScriptPositioningOptions, ContentScriptAnchoredOptions, AutoMountOptions, StopAutoMount, AutoMount } from 'wxt/utils/content-script-ui/types';
12
+ export { defineAppConfig, WxtAppConfig } from 'wxt/utils/define-app-config';
13
+ export { defineBackground } from 'wxt/utils/define-background';
14
+ export { defineContentScript } from 'wxt/utils/define-content-script';
15
+ export { defineUnlistedScript } from 'wxt/utils/define-unlisted-script';
16
+ export { defineWxtPlugin } from 'wxt/utils/define-wxt-plugin';
17
+ export { injectScript, ScriptPublicPath, InjectScriptOptions } from 'wxt/utils/inject-script';
18
+ export { InvalidMatchPattern, MatchPattern } from 'wxt/utils/match-patterns';
19
+ export { fakeBrowser } from 'wxt/testing';
20
+ }
@@ -1,22 +1,50 @@
1
1
  // Generated by wxt
2
2
  export {}
3
3
  declare global {
4
- const ContentScriptContext: typeof import('wxt/client')['ContentScriptContext']
5
- const InvalidMatchPattern: typeof import('wxt/sandbox')['InvalidMatchPattern']
6
- const MatchPattern: typeof import('wxt/sandbox')['MatchPattern']
7
- const MigrationError: typeof import('wxt/storage')['MigrationError']
8
- const browser: typeof import('wxt/browser/chrome')['browser']
9
- const createIframeUi: typeof import('wxt/client')['createIframeUi']
10
- const createIntegratedUi: typeof import('wxt/client')['createIntegratedUi']
11
- const createShadowRootUi: typeof import('wxt/client')['createShadowRootUi']
12
- const defineAppConfig: typeof import('wxt/sandbox')['defineAppConfig']
13
- const defineBackground: typeof import('wxt/sandbox')['defineBackground']
14
- const defineConfig: typeof import('wxt')['defineConfig']
15
- const defineContentScript: typeof import('wxt/sandbox')['defineContentScript']
16
- const defineUnlistedScript: typeof import('wxt/sandbox')['defineUnlistedScript']
17
- const defineWxtPlugin: typeof import('wxt/sandbox')['defineWxtPlugin']
4
+ const ContentScriptContext: typeof import('wxt/utils/content-script-context')['ContentScriptContext']
5
+ const InvalidMatchPattern: typeof import('wxt/utils/match-patterns')['InvalidMatchPattern']
6
+ const MatchPattern: typeof import('wxt/utils/match-patterns')['MatchPattern']
7
+ const browser: typeof import('wxt/browser')['browser']
8
+ const createIframeUi: typeof import('wxt/utils/content-script-ui/iframe')['createIframeUi']
9
+ const createIntegratedUi: typeof import('wxt/utils/content-script-ui/integrated')['createIntegratedUi']
10
+ const createShadowRootUi: typeof import('wxt/utils/content-script-ui/shadow-root')['createShadowRootUi']
11
+ const defineAppConfig: typeof import('wxt/utils/define-app-config')['defineAppConfig']
12
+ const defineBackground: typeof import('wxt/utils/define-background')['defineBackground']
13
+ const defineContentScript: typeof import('wxt/utils/define-content-script')['defineContentScript']
14
+ const defineUnlistedScript: typeof import('wxt/utils/define-unlisted-script')['defineUnlistedScript']
15
+ const defineWxtPlugin: typeof import('wxt/utils/define-wxt-plugin')['defineWxtPlugin']
18
16
  const fakeBrowser: typeof import('wxt/testing')['fakeBrowser']
19
- const injectScript: typeof import('wxt/client')['injectScript']
20
- const storage: typeof import('wxt/storage')['storage']
21
- const useAppConfig: typeof import('wxt/client')['useAppConfig']
17
+ const injectScript: typeof import('wxt/utils/inject-script')['injectScript']
18
+ const storage: typeof import('wxt/utils/storage')['storage']
19
+ const useAppConfig: typeof import('wxt/utils/app-config')['useAppConfig']
20
+ }
21
+ // for type re-export
22
+ declare global {
23
+ // @ts-ignore
24
+ export type { Browser } from 'wxt/browser'
25
+ import('wxt/browser')
26
+ // @ts-ignore
27
+ export type { StorageArea, WxtStorage, WxtStorageItem, StorageItemKey, StorageAreaChanges, MigrationError } from 'wxt/utils/storage'
28
+ import('wxt/utils/storage')
29
+ // @ts-ignore
30
+ export type { WxtWindowEventMap } from 'wxt/utils/content-script-context'
31
+ import('wxt/utils/content-script-context')
32
+ // @ts-ignore
33
+ export type { IframeContentScriptUi, IframeContentScriptUiOptions } from 'wxt/utils/content-script-ui/iframe'
34
+ import('wxt/utils/content-script-ui/iframe')
35
+ // @ts-ignore
36
+ export type { IntegratedContentScriptUi, IntegratedContentScriptUiOptions } from 'wxt/utils/content-script-ui/integrated'
37
+ import('wxt/utils/content-script-ui/integrated')
38
+ // @ts-ignore
39
+ export type { ShadowRootContentScriptUi, ShadowRootContentScriptUiOptions } from 'wxt/utils/content-script-ui/shadow-root'
40
+ import('wxt/utils/content-script-ui/shadow-root')
41
+ // @ts-ignore
42
+ export type { ContentScriptUi, ContentScriptUiOptions, ContentScriptOverlayAlignment, ContentScriptAppendMode, ContentScriptInlinePositioningOptions, ContentScriptOverlayPositioningOptions, ContentScriptModalPositioningOptions, ContentScriptPositioningOptions, ContentScriptAnchoredOptions, AutoMountOptions, StopAutoMount, AutoMount } from 'wxt/utils/content-script-ui/types'
43
+ import('wxt/utils/content-script-ui/types')
44
+ // @ts-ignore
45
+ export type { WxtAppConfig } from 'wxt/utils/define-app-config'
46
+ import('wxt/utils/define-app-config')
47
+ // @ts-ignore
48
+ export type { ScriptPublicPath, InjectScriptOptions } from 'wxt/utils/inject-script'
49
+ import('wxt/utils/inject-script')
22
50
  }
@@ -3,6 +3,7 @@ import "wxt/browser";
3
3
 
4
4
  declare module "wxt/browser" {
5
5
  export type PublicPath =
6
+ | ""
6
7
  | "/"
7
8
  | "/background.js"
8
9
  | "/content-scripts/content.js"
@@ -3,5 +3,5 @@
3
3
  /// <reference path="./types/paths.d.ts" />
4
4
  /// <reference path="./types/i18n.d.ts" />
5
5
  /// <reference path="./types/globals.d.ts" />
6
- /// <reference types="@types/chrome" />
6
+ /// <reference path="./types/imports-module.d.ts" />
7
7
  /// <reference path="./types/imports.d.ts" />
@@ -1 +1 @@
1
- export const classNameSpace = import.meta.env.VITE_APP_ID
1
+ export const classNameSpace = import.meta.env.VITE_APP_ID
@@ -1 +1 @@
1
- export * from './base'
1
+ export * from './base'
@@ -1,58 +1,58 @@
1
- import { CSSProperties, ReactNode } from 'react'
2
- import { createRoot } from 'react-dom/client'
3
- import { forEach, isFunction } from 'lodash-es'
4
- import { AppContext } from '@/shared/components'
5
- import { classNameSpace } from '@/entrypoints/content/constants'
6
-
7
- export enum insertAppStatus {
8
- success,
9
- target_not_exist,
10
- root_existed
11
- }
12
- export interface insertAppResultType {
13
- rootEle: HTMLElement | undefined | null
14
- result: boolean
15
- status: insertAppStatus
16
- }
17
- export function insertApp<T extends HTMLElement>(
18
- target: T | null | undefined,
19
- option: {
20
- insert?: (rootEle: HTMLElement, target: T) => void
21
- reactNode: ReactNode
22
- isReplace?: boolean
23
- rootId: string
24
- rootStyle?: CSSProperties
25
- }
26
- ) {
27
- const result: insertAppResultType = {
28
- result: false,
29
- rootEle: void 0,
30
- status: insertAppStatus.success
31
- }
32
- const rootId = `${import.meta.env.VITE_APP_ID}_${option.rootId}`
33
- if (!target) {
34
- result.status = insertAppStatus.target_not_exist
35
- return result
36
- }
37
- result.rootEle = document.createElement('div')
38
- result.rootEle.className = classNameSpace
39
- result.rootEle.id = rootId
40
- forEach(option.rootStyle, (value, key) => {
41
- result.rootEle!.style[key as any] = value as never
42
- })
43
- const oldRootEle = target.querySelector?.(`#${rootId}`)
44
- if (!option.isReplace && oldRootEle) {
45
- result.status = insertAppStatus.root_existed
46
- return result
47
- }
48
- oldRootEle?.remove()
49
- if (isFunction(option.insert)) {
50
- option.insert(result.rootEle, target)
51
- } else {
52
- target.appendChild(result.rootEle)
53
- }
54
- const root = createRoot(result.rootEle)
55
- root.render(<AppContext>{option.reactNode}</AppContext>)
56
- result.result = true
57
- return result
58
- }
1
+ import { CSSProperties, ReactNode } from 'react'
2
+ import { createRoot } from 'react-dom/client'
3
+ import { forEach, isFunction } from 'lodash-es'
4
+ import { AppContext } from '@/shared/components'
5
+ import { classNameSpace } from '@/entrypoints/content/constants'
6
+
7
+ export enum insertAppStatus {
8
+ success,
9
+ target_not_exist,
10
+ root_existed
11
+ }
12
+ export interface insertAppResultType {
13
+ rootEle: HTMLElement | undefined | null
14
+ result: boolean
15
+ status: insertAppStatus
16
+ }
17
+ export function insertApp<T extends HTMLElement>(
18
+ target: T | null | undefined,
19
+ option: {
20
+ insert?: (rootEle: HTMLElement, target: T) => void
21
+ reactNode: ReactNode
22
+ isReplace?: boolean
23
+ rootId: string
24
+ rootStyle?: CSSProperties
25
+ }
26
+ ) {
27
+ const result: insertAppResultType = {
28
+ result: false,
29
+ rootEle: void 0,
30
+ status: insertAppStatus.success
31
+ }
32
+ const rootId = `${import.meta.env.VITE_APP_ID}_${option.rootId}`
33
+ if (!target) {
34
+ result.status = insertAppStatus.target_not_exist
35
+ return result
36
+ }
37
+ result.rootEle = document.createElement('div')
38
+ result.rootEle.className = classNameSpace
39
+ result.rootEle.id = rootId
40
+ forEach(option.rootStyle, (value, key) => {
41
+ result.rootEle!.style[key as any] = value as never
42
+ })
43
+ const oldRootEle = target.querySelector?.(`#${rootId}`)
44
+ if (!option.isReplace && oldRootEle) {
45
+ result.status = insertAppStatus.root_existed
46
+ return result
47
+ }
48
+ oldRootEle?.remove()
49
+ if (isFunction(option.insert)) {
50
+ option.insert(result.rootEle, target)
51
+ } else {
52
+ target.appendChild(result.rootEle)
53
+ }
54
+ const root = createRoot(result.rootEle)
55
+ root.render(<AppContext.Root>{option.reactNode}</AppContext.Root>)
56
+ result.result = true
57
+ return result
58
+ }
@@ -2,7 +2,7 @@ import { CONTENT_MATCHES } from '@/shared/content'
2
2
  import { Common } from './modules'
3
3
 
4
4
  export default defineContentScript({
5
- run_at: 'document_idle',
5
+ runAt: 'document_idle',
6
6
  matches: CONTENT_MATCHES,
7
7
  main: () => {
8
8
  Common.insert()
@@ -1,10 +1,10 @@
1
- import { GlobalStyle } from '@/shared/styles'
2
- import { classNameSpace } from '@/entrypoints/content/constants'
3
-
4
- export default function Home() {
5
- return (
6
- <>
7
- <GlobalStyle nameSpace={classNameSpace} />
8
- </>
9
- )
10
- }
1
+ import { GlobalStyle } from '@/shared/styles'
2
+ import { classNameSpace } from '@/entrypoints/content/constants'
3
+
4
+ export default function Home() {
5
+ return (
6
+ <>
7
+ <GlobalStyle nameSpace={classNameSpace} />
8
+ </>
9
+ )
10
+ }
@@ -6,9 +6,9 @@ import Popup from './popup'
6
6
 
7
7
  createRoot(document.getElementById('root') as HTMLElement).render(
8
8
  <StrictMode>
9
- <AppContext>
9
+ <AppContext.Root>
10
10
  <GlobalStyle />
11
11
  <Popup />
12
- </AppContext>
12
+ </AppContext.Root>
13
13
  </StrictMode>
14
14
  )
@@ -25,6 +25,8 @@
25
25
  "commit": "git add . && npm run cz"
26
26
  },
27
27
  "dependencies": {
28
+ "@emotion/react": "11.14.0",
29
+ "@emotion/styled": "11.14.0",
28
30
  "@tanstack/react-query": "5.51.15",
29
31
  "@webext-core/messaging": "2.2.0",
30
32
  "axios": "1.7.9",
@@ -34,7 +36,6 @@
34
36
  "qs": "6.11.2",
35
37
  "react": "18.3.1",
36
38
  "react-dom": "18.3.1",
37
- "styled-components": "6.1.11",
38
39
  "type-fest": "4.33.0",
39
40
  "zustand": "5.0.3"
40
41
  },
@@ -42,6 +43,7 @@
42
43
  "@commitlint/cli": "17.6.1",
43
44
  "@commitlint/config-conventional": "17.6.1",
44
45
  "@commitlint/cz-commitlint": "17.5.0",
46
+ "@emotion/babel-plugin": "11.13.5",
45
47
  "@eslint/js": "9.15.0",
46
48
  "@types/chrome": "0.0.254",
47
49
  "@types/lodash-es": "4.17.12",
@@ -76,7 +78,7 @@
76
78
  "typescript-eslint": "8.28.0",
77
79
  "vite": "6.2.3",
78
80
  "vite-plugin-svgr": "4.3.0",
79
- "wxt": "0.19.29"
81
+ "wxt": "0.20.5"
80
82
  },
81
83
  "config": {
82
84
  "commitizen": {
@@ -0,0 +1 @@
1
+ export { default as Root } from './view'
@@ -1,14 +1,16 @@
1
1
  import { FunctionComponent, ReactNode } from 'react'
2
- import { ThemeProvider } from 'styled-components'
2
+ import { ThemeProvider } from '@emotion/react'
3
3
  import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
4
4
  import { theme } from '@/shared/styles'
5
5
 
6
6
  const queryClient = new QueryClient()
7
7
 
8
- export const AppContext: FunctionComponent<{ children: ReactNode }> = props => {
8
+ const AppContext: FunctionComponent<{ children: ReactNode }> = props => {
9
9
  return (
10
10
  <QueryClientProvider client={queryClient}>
11
11
  <ThemeProvider theme={theme}>{props.children}</ThemeProvider>
12
12
  </QueryClientProvider>
13
13
  )
14
14
  }
15
+
16
+ export default AppContext
@@ -1 +1 @@
1
- export * from './app-context'
1
+ export * as AppContext from './app-context'
@@ -0,0 +1,14 @@
1
+ import { FunctionComponent } from 'react'
2
+ import { css, Global } from '@emotion/react'
3
+
4
+ export const GlobalStyle: FunctionComponent<{ nameSpace?: string }> = props => {
5
+ return (
6
+ <Global
7
+ styles={css`
8
+ ${props.nameSpace ? '.' + props.nameSpace : 'body'} {
9
+ margin: 0;
10
+ }
11
+ `}
12
+ />
13
+ )
14
+ }
@@ -1,2 +1,2 @@
1
- export * from './theme.styled'
2
- export * from './global.styled'
1
+ export * from './theme.styled'
2
+ export * from './global-style'
@@ -1,7 +1,7 @@
1
1
  /// <reference types="vite/client" />
2
2
  /// <reference types="./.wxt/wxt.d.ts" />
3
3
 
4
- import 'styled-components'
4
+ import '@emotion/react'
5
5
  import { themeType } from './shared/styles'
6
6
 
7
7
  declare global {
@@ -16,6 +16,6 @@ declare global {
16
16
  }
17
17
  }
18
18
 
19
- declare module 'styled-components' {
20
- export interface DefaultTheme extends themeType {}
19
+ declare module '@emotion/react' {
20
+ export interface Theme extends themeType {}
21
21
  }
@@ -13,8 +13,8 @@ const manifest: UserManifestFn = () => {
13
13
  version: pkgJson.version,
14
14
  host_permissions,
15
15
  icons: {
16
- '48': 'vite.png',
17
- '128': 'vite.png'
16
+ '48': 'vite.svg',
17
+ '128': 'vite.svg'
18
18
  }
19
19
  }
20
20
  }
@@ -27,10 +27,16 @@ export default defineConfig({
27
27
  },
28
28
  manifest,
29
29
  runner: { disabled: true },
30
- extensionApi: 'chrome',
31
30
  imports: { eslintrc: { enabled: 9 } },
32
31
  vite: ({ mode }) => ({
33
- plugins: [svgr(), react()] as any,
32
+ plugins: [
33
+ svgr(),
34
+ react({
35
+ babel: {
36
+ plugins: ['@emotion']
37
+ }
38
+ })
39
+ ] as any,
34
40
  resolve: {
35
41
  alias: {
36
42
  '@': __dirname
@@ -1,25 +0,0 @@
1
- module.exports = {
2
- parser: '@typescript-eslint/parser',
3
- parserOptions: {
4
- project: 'tsconfig.json',
5
- tsconfigRootDir: __dirname,
6
- sourceType: 'module',
7
- },
8
- plugins: ['@typescript-eslint/eslint-plugin'],
9
- extends: [
10
- 'plugin:@typescript-eslint/recommended',
11
- 'plugin:prettier/recommended',
12
- ],
13
- root: true,
14
- env: {
15
- node: true,
16
- jest: true,
17
- },
18
- ignorePatterns: ['.eslintrc.js'],
19
- rules: {
20
- '@typescript-eslint/interface-name-prefix': 'off',
21
- '@typescript-eslint/explicit-function-return-type': 'off',
22
- '@typescript-eslint/explicit-module-boundary-types': 'off',
23
- '@typescript-eslint/no-explicit-any': 'off',
24
- },
25
- }
@@ -1,35 +0,0 @@
1
- # compiled output
2
- /dist
3
- /node_modules
4
-
5
- # Logs
6
- logs
7
- *.log
8
- npm-debug.log*
9
- pnpm-debug.log*
10
- yarn-debug.log*
11
- yarn-error.log*
12
- lerna-debug.log*
13
-
14
- # OS
15
- .DS_Store
16
-
17
- # Tests
18
- /coverage
19
- /.nyc_output
20
-
21
- # IDEs and editors
22
- /.idea
23
- .project
24
- .classpath
25
- .c9/
26
- *.launch
27
- .settings/
28
- *.sublime-workspace
29
-
30
- # IDE - VSCode
31
- .vscode/*
32
- !.vscode/settings.json
33
- !.vscode/tasks.json
34
- !.vscode/launch.json
35
- !.vscode/extensions.json
@@ -1,4 +0,0 @@
1
- #!/usr/bin/env sh
2
- . "$(dirname -- "$0")/_/husky.sh"
3
-
4
- npm run lint
@@ -1,6 +0,0 @@
1
- {
2
- "singleQuote": true,
3
- "trailingComma": "all",
4
- "tabWidth": 4,
5
- "semi": false
6
- }