chore: update deps (PlasmoHQ#690)

* Remove prettier sort fork

* chore: upgrade deps, remove custom fork of prettier sorter

* chore: bump dependencies

* update examples

* Packup

.github/CONTRIBUTING.md

@@ -34,7 +34,7 @@ requests should be made against.
 
 To develop locally:
 
-1. Install [pnpm](https://pnpm.io/) 
+1. Install [pnpm](https://pnpm.io/)
    - DO NOT install pnpm a as npm's global dependency, we need pnpm to be able to link directly to your $PATH.
    - Recommended installation method is with corepack or with brew (on macOS)
    - If installed with brew, you might need to include the pnpm $PATH to your debugger
@@ -76,12 +76,13 @@ To develop locally:
    ```
 
 Note: The `create-plasmo` CLI tool is not meant to be run locally.
-If you have already linked it, please run 
+If you have already linked it, please run
 
 ```sh
 pnpm -g unlink create-plasmo
 ```
- to unlink it.
+
+to unlink it.
 
 ## Building
 

.gitmodules

@@ -29,9 +29,6 @@
 [submodule "packages/config"]
 	path = packages/config
 	url = https://github.com/PlasmoHQ/plasmo-config.git
-[submodule "packages/prettier-plugin-sort-imports"]
-	path = packages/prettier-plugin-sort-imports
-	url = https://github.com/PlasmoHQ/prettier-plugin-sort-imports.git
 [submodule "api/storage"]
 	path = api/storage
 	url = [email protected]:PlasmoHQ/storage.git

.prettierrc.mjs

@@ -0,0 +1,31 @@
+/**
+ * @type {import('prettier').Options}
+ */
+export default {
+  printWidth: 80,
+  tabWidth: 2,
+  useTabs: false,
+  semi: false,
+  singleQuote: false,
+  trailingComma: "none",
+  bracketSpacing: true,
+  bracketSameLine: true,
+  plugins: ["@ianvs/prettier-plugin-sort-imports"],
+  importOrder: [
+    "<BUILTIN_MODULES>", // Node.js built-in modules
+    "<THIRD_PARTY_MODULES>", // Imports not matched by other special words or groups.
+    "", // Empty line
+    "^@plasmo/(.*)$",
+    "",
+    "^@plasmohq/(.*)$",
+    "",
+    "^@plasmo-static-common/(.*)$",
+    "",
+    "^~(.*)$",
+    "",
+    "^[./]",
+    "",
+    "__plasmo_import_module__",
+    "__plasmo_mount_content_script__"
+  ]
+}

api/messaging/jest.config.mjs

@@ -16,6 +16,6 @@ const config = {
     ]
   },
   testMatch: ["**/*.test.ts"],
-  verbose: true,
+  verbose: true
 }
 export default config

api/messaging/src/hook.ts

@@ -1,6 +1,6 @@
 import { useEffect, useRef, useState } from "react"
 
-import { type MessageName, type PlasmoMessaging, relayMessage } from "./index"
+import { relayMessage, type MessageName, type PlasmoMessaging } from "./index"
 import { listen as messageListen } from "./message"
 import { listen as portListen } from "./port"
 import { relay } from "./relay"

api/messaging/src/types.ts

@@ -92,7 +92,9 @@ export namespace PlasmoMessaging {
   }
 
   export interface PortHook {
-    <TRequestBody = Record<string, any>, TResponseBody = any>(name: PortName): {
+    <TRequestBody = Record<string, any>, TResponseBody = any>(
+      name: PortName
+    ): {
       data?: TResponseBody
       send: (payload: TRequestBody) => void
       listen: <T = TResponseBody>(

cli/create-plasmo/bin/index.mjs

@@ -1,2 +1,3 @@
 #!/usr/bin/env node
+
 import "../dist/index.js"

cli/create-plasmo/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-plasmo",
-  "version": "0.80.0",
+  "version": "0.81.0",
   "description": "Create Plasmo Framework Browser Extension",
   "main": "dist/index.js",
   "bin": "bin/index.mjs",

cli/create-plasmo/src/index.ts

@@ -1,7 +1,7 @@
 #!/usr/bin/env node
+import { argv, exit } from "process"
 import { version } from "plasmo/package.json"
 import init from "plasmo/src/commands/init"
-import { argv, exit } from "process"
 
 import { ErrorMessage } from "@plasmo/constants/error"
 import { aLog, eLog } from "@plasmo/utils/logging"

cli/plasmo/bin/index.mjs

@@ -1,2 +1,3 @@
 #!/usr/bin/env node
+
 import "../dist/index.js"

cli/plasmo/i18n/README.ja-JP.md

@@ -81,7 +81,7 @@ pnpm dev
 
 変更したい部分によって、以下のファイルを編集してください。
 
-- ポップアップ → `popup.tsx` 
+- ポップアップ → `popup.tsx`
 - 設定ページ → `options.tsx`
 - コンテンツスクリプト → `content.ts`
 - バックグランドサービスワーカー → `background.ts`

cli/plasmo/index.mjs

@@ -1,6 +1,6 @@
+import { argv, exit } from "process"
 import { build, context } from "esbuild"
 import fse from "fs-extra"
-import { argv, exit } from "process"
 
 const watch = argv.includes("-w")
 

cli/plasmo/package.json

@@ -1,6 +1,6 @@
 {
   "name": "plasmo",
-  "version": "0.80.0",
+  "version": "0.81.0",
   "description": "The Plasmo Framework CLI",
   "publishConfig": {
     "types": "dist/type.d.ts"
@@ -64,11 +64,12 @@
     "package-json": "8.1.1",
     "process": "0.11.10",
     "semver": "7.5.4",
-    "sharp": "0.32.2",
+    "sharp": "0.32.3",
     "tempy": "3.1.0",
     "typescript": "5.1.6"
   },
   "devDependencies": {
+    "vue": "3.3.4",
     "@plasmo/config": "workspace:*",
     "@plasmo/constants": "workspace:*",
     "@plasmo/framework-shared": "workspace:*",

cli/plasmo/src/commands/init.ts

@@ -1,6 +1,6 @@
-import { paramCase } from "change-case"
 import { resolve } from "path"
 import { cwd } from "process"
+import { paramCase } from "change-case"
 
 import { hasFlag } from "@plasmo/utils/flags"
 import { ensureWritableAndEmpty } from "@plasmo/utils/fs"

cli/plasmo/src/features/background-service-worker/bgsw-entry.ts

@@ -1,5 +1,5 @@
-import { ensureDir, outputFile } from "fs-extra"
 import { relative, resolve } from "path"
+import { ensureDir, outputFile } from "fs-extra"
 
 import { vLog } from "@plasmo/utils/logging"
 import { toPosix } from "@plasmo/utils/path"

cli/plasmo/src/features/background-service-worker/bgsw-main-world-script.ts

@@ -1,6 +1,6 @@
+import { relative, resolve } from "path"
 import { camelCase } from "change-case"
 import { outputFile } from "fs-extra"
-import { relative, resolve } from "path"
 
 import { vLog } from "@plasmo/utils/logging"
 import { toPosix } from "@plasmo/utils/path"

cli/plasmo/src/features/background-service-worker/bgsw-messaging-declaration.ts

@@ -1,5 +1,5 @@
-import { outputFile } from "fs-extra"
 import { resolve } from "path"
+import { outputFile } from "fs-extra"
 
 import type { CommonPath } from "~features/extension-devtools/common-path"
 

cli/plasmo/src/features/background-service-worker/bgsw-messaging.ts

@@ -1,7 +1,7 @@
+import { join, resolve } from "path"
 import { camelCase } from "change-case"
 import glob from "fast-glob"
 import { outputFile } from "fs-extra"
-import { join, resolve } from "path"
 
 import { isWriteable } from "@plasmo/utils/fs"
 import { vLog, wLog } from "@plasmo/utils/logging"

cli/plasmo/src/features/env/env-config.ts

@@ -1,9 +1,9 @@
 // Forked from https://github.com/vercel/next.js/blob/canary/packages/next-env/index.ts
+import { readFile } from "fs/promises"
+import { resolve } from "path"
 import { constantCase } from "change-case"
 import dotenv from "dotenv"
 import { expand as dotenvExpand } from "dotenv-expand"
-import { readFile } from "fs/promises"
-import { resolve } from "path"
 
 import { isFile, isReadable } from "@plasmo/utils/fs"
 import { eLog, iLog, vLog } from "@plasmo/utils/logging"

cli/plasmo/src/features/env/env-declaration.ts

@@ -1,5 +1,5 @@
-import { outputFile } from "fs-extra"
 import { resolve } from "path"
+import { outputFile } from "fs-extra"
 
 import type { PlasmoManifest } from "~features/manifest-factory/base"
 

cli/plasmo/src/features/extension-devtools/content-script-config.ts

@@ -1,6 +1,5 @@
 import { readFile } from "fs/promises"
-import type { Node, VariableDeclaration } from "typescript"
-import typescript from "typescript"
+import typescript, { type Node, type VariableDeclaration } from "typescript"
 
 import type { ManifestContentScript } from "@plasmo/constants"
 import { eLog, vLog } from "@plasmo/utils/logging"
@@ -33,13 +32,16 @@ export const extractContentScriptConfig = async (path: string) => {
 
     const variableDeclarationMap = sourceFile.statements
       .filter(isVariableStatement)
-      .reduce((output, node) => {
-        node.declarationList.forEachChild((vd: VariableDeclaration) => {
-          output[vd.name.getText()] = vd.initializer
-        })
-
-        return output
-      }, {} as Record<string, Node>)
+      .reduce(
+        (output, node) => {
+          node.declarationList.forEachChild((vd: VariableDeclaration) => {
+            output[vd.name.getText()] = vd.initializer
+          })
+
+          return output
+        },
+        {} as Record<string, Node>
+      )
 
     const configAST = variableDeclarationMap["config"]
 

cli/plasmo/src/features/extension-devtools/generate-icons.ts

@@ -1,5 +1,5 @@
-import { copy, ensureDir } from "fs-extra"
 import { basename, resolve } from "path"
+import { copy, ensureDir } from "fs-extra"
 import sharp from "sharp"
 
 import { find } from "@plasmo/utils/array"

cli/plasmo/src/features/extension-devtools/package-file.ts

@@ -1,5 +1,5 @@
-import { sentenceCase } from "change-case"
 import { userInfo } from "os"
+import { sentenceCase } from "change-case"
 import getPackageJson, { type AbbreviatedVersion } from "package-json"
 
 import type { ExtensionManifestV3 } from "@plasmo/constants"
@@ -30,7 +30,6 @@ const _generatePackage = async ({
       "react-dom": "*"
     } as Record<string, string>,
     devDependencies: {
-      "@plasmohq/prettier-plugin-sort-imports": "workspace:*",
       "@types/chrome": "*",
       "@types/node": "*",
       "@types/react": "*",

cli/plasmo/src/features/extension-devtools/parse-ast.ts

@@ -4,15 +4,14 @@
  * Adapted from https://github.com/dword-design/ts-ast-to-literal/blob/master/src/index.js
  * Copyright (c) Sebastian Landwehr [email protected], MIT licensed
  */
-import type {
-  ArrayLiteralExpression,
-  Identifier,
-  LiteralExpression,
-  Node,
-  ObjectLiteralExpression,
-  PropertyAssignment
+import typescript, {
+  type ArrayLiteralExpression,
+  type Identifier,
+  type LiteralExpression,
+  type Node,
+  type ObjectLiteralExpression,
+  type PropertyAssignment
 } from "typescript"
-import typescript from "typescript"
 
 const { SyntaxKind } = typescript
 

cli/plasmo/src/features/extension-devtools/project-path.ts

@@ -43,10 +43,13 @@ export enum WatchReason {
 type DirectoryWatchTuple = [WatchReason, string]
 
 const getWatchReasonMap = (paths: string[], reason: WatchReason) =>
-  paths.reduce((output, path) => {
-    output[path] = reason
-    return output
-  }, {} as Record<string, WatchReason>)
+  paths.reduce(
+    (output, path) => {
+      output[path] = reason
+      return output
+    },
+    {} as Record<string, WatchReason>
+  )
 
 export const getProjectPath = (
   { sourceDirectory, packageFilePath, assetsDirectory }: CommonPath,

cli/plasmo/src/features/extension-devtools/project-watcher.ts

@@ -1,4 +1,4 @@
-import { type Event, subscribe } from "@parcel/watcher"
+import { subscribe, type Event } from "@parcel/watcher"
 
 import { PARCEL_WATCHER_BACKEND } from "@plasmo/constants/misc"
 import { assertUnreachable } from "@plasmo/utils/assert"

cli/plasmo/src/features/extension-devtools/strip-underscore.ts

@@ -1,4 +1,4 @@
-import { readFile, readdir, rename, stat, writeFile } from "fs/promises"
+import { readdir, readFile, rename, stat, writeFile } from "fs/promises"
 import { join, resolve } from "path"
 
 const stripFileUnderscore = async (filePath: string) => {

cli/plasmo/src/features/extension-devtools/tsconfig.ts

@@ -1,7 +1,7 @@
-import { outputFile, outputJson } from "fs-extra"
 import { readFile } from "fs/promises"
-import json5 from "json5"
 import { resolve } from "path"
+import { outputFile, outputJson } from "fs-extra"
+import json5 from "json5"
 
 import { MESSAGING_DECLARATION } from "~features/background-service-worker/bgsw-messaging-declaration"
 import { PROCESS_ENV_DECLARATION } from "~features/env/env-declaration"

cli/plasmo/src/features/extra/cache-busting.ts

@@ -1,6 +1,6 @@
-import { emptyDir, ensureDir } from "fs-extra"
 import { lstat } from "fs/promises"
 import { resolve } from "path"
+import { emptyDir, ensureDir } from "fs-extra"
 
 import { isAccessible } from "@plasmo/utils/fs"
 import { vLog } from "@plasmo/utils/logging"

cli/plasmo/src/features/extra/next-new-tab.ts

@@ -1,7 +1,7 @@
-import { sentenceCase } from "change-case"
-import { copy, emptyDir, readJson, writeJson } from "fs-extra"
 import { mkdir } from "fs/promises"
 import { resolve } from "path"
+import { sentenceCase } from "change-case"
+import { copy, emptyDir, readJson, writeJson } from "fs-extra"
 
 import { isAccessible } from "@plasmo/utils/fs"
 import { sLog, vLog } from "@plasmo/utils/logging"

cli/plasmo/src/features/helpers/create-parcel-bundler.ts

@@ -1,7 +1,7 @@
+import { dirname, join, resolve } from "path"
 import ParcelFS from "@parcel/fs"
 import ParcelPM from "@parcel/package-manager"
 import { emptyDir, ensureDir, readJson, writeJson } from "fs-extra"
-import { dirname, join, resolve } from "path"
 
 import { getFlag, hasFlag } from "@plasmo/utils/flags"