feat: upgrade parcel-bundler to align with latest (#307)

* Upgrade parcel-bundler to the latest experimental

* Bump canary

* fix: add package command to index

* Try out sync config

* Remove template submod

* Fix up tag issue

* Update devs

* bump canary

.gitmodules

@@ -6,10 +6,6 @@
 	path = packages/puro
 	url = [email protected]:PlasmoHQ/puro.git
 	branch = main
-[submodule "templates/qtt"]
-	path = templates/qtt
-	url = [email protected]:PlasmoHQ/qtt.git
-	branch = main
 [submodule "packages/gcp-refresh-token"]
 	path = packages/gcp-refresh-token
 	url = [email protected]:PlasmoHQ/gcp-refresh-token.git

cli/create-plasmo/package.json

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

cli/create-plasmo/src/index.ts

@@ -3,7 +3,7 @@ import { version } from "plasmo/package.json"
 import init from "plasmo/src/commands/init"
 import { argv, exit } from "process"
 
-import { ErrorMessage } from "@plasmo/constants"
+import { ErrorMessage } from "@plasmo/constants/error"
 import { aLog, eLog } from "@plasmo/utils/logging"
 import { exitCountDown } from "@plasmo/utils/wait"
 

cli/plasmo/package.json

@@ -1,6 +1,6 @@
 {
   "name": "plasmo",
-  "version": "0.59.1",
+  "version": "0.59.2-alpha.3",
   "description": "The Plasmo Platform CLI",
   "main": "dist/index.js",
   "types": "dist/type.d.ts",

cli/plasmo/src/commands/build.ts

@@ -1,6 +1,3 @@
-import { createWriteStream } from "fs"
-import { resolve } from "path"
-
 import { getNonFlagArgvs } from "@plasmo/utils/argv"
 import { hasFlag } from "@plasmo/utils/flags"
 import { iLog, sLog } from "@plasmo/utils/logging"

cli/plasmo/src/commands/index.ts

@@ -6,6 +6,7 @@ export const runMap = {
   init: () => import("./init"),
   dev: () => import("./dev"),
   build: () => import("./build"),
+  package: () => import("./package"),
   //#endif
 
   version: () => import("./version"),

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

@@ -2,9 +2,11 @@ import { existsSync } from "fs"
 import { basename, resolve } from "path"
 import { cwd } from "process"
 
-import { flagMap } from "~features/helpers/flag"
+import { getFlagMap } from "~features/helpers/flag"
 
 export const getCommonPath = (projectDirectory = cwd()) => {
+  const flagMap = getFlagMap()
+
   process.env.PLASMO_PROJECT_DIR = projectDirectory
 
   const packageName = basename(projectDirectory)

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

@@ -4,7 +4,7 @@ import sharp from "sharp"
 
 import { vLog, wLog } from "@plasmo/utils/logging"
 
-import { flagMap } from "~features/helpers/flag"
+import { getFlagMap } from "~features/helpers/flag"
 
 import type { CommonPath } from "./common-path"
 
@@ -28,16 +28,18 @@ const baseIconNames = [
  * 3. plain icon
  *
  * */
-const getPrioritizedIconPaths = (iconNames = baseIconNames) =>
-  iconNames
+const getPrioritizedIconPaths = (iconNames = baseIconNames) => {
+  const flagMap = getFlagMap()
+
+  return iconNames
     .map((name) => [
       `${name}.${flagMap.tag}.${process.env.NODE_ENV}.png`,
       `${name}.${process.env.NODE_ENV}.png`,
       `${name}.${flagMap.tag}.png`,
       `${name}.png`
     ])
     .flat()
-
+}
 // Use this to cache the path resolving result
 const iconState = {
   baseIconPaths: [] as string[],

cli/plasmo/src/features/extension-devtools/get-bundle-config.ts

@@ -1,10 +1,9 @@
-import { flagMap } from "~features/helpers/flag"
-
-const { target, tag } = flagMap
-
-export const [browser, manifestVersion] = target.split("-")
+import { getFlagMap } from "~features/helpers/flag"
 
 export const getBundleConfig = () => {
+  const flagMap = getFlagMap()
+  const { target, tag } = flagMap
+  const [browser, manifestVersion] = target.split("-")
   // Potential runtime config here
   return {
     tag,

cli/plasmo/src/features/extension-devtools/load-env-config.ts

@@ -8,8 +8,7 @@ import { join } from "path"
 
 import { eLog, iLog } from "@plasmo/utils/logging"
 
-import { browser } from "~features/extension-devtools/get-bundle-config"
-import { flagMap } from "~features/helpers/flag"
+import { getFlagMap } from "~features/helpers/flag"
 
 export type Env = Record<string, string | undefined>
 export type LoadedEnvFiles = Array<{
@@ -78,11 +77,12 @@ function processEnv(loadedEnvFiles: LoadedEnvFiles, dir?: string) {
 
 export async function loadEnvConfig(dir: string) {
   const nodeEnv = process.env.NODE_ENV
+  const flagMap = getFlagMap()
 
   const dotenvFilePaths = [
     flagMap.envPath,
 
-    `.env.${browser}.local`,
+    `.env.${flagMap.browser}.local`,
     `.env.${flagMap.tag}.local`,
     `.env.${nodeEnv}.local`,
 
@@ -91,7 +91,7 @@ export async function loadEnvConfig(dir: string) {
     // results for everyone
     nodeEnv !== "test" ? `.env.local` : "",
 
-    `.env.${browser}`,
+    `.env.${flagMap.browser}`,
     `.env.${flagMap.tag}`,
     `.env.${nodeEnv}`,
     ".env"

cli/plasmo/src/features/helpers/flag.ts

@@ -2,31 +2,37 @@ import { paramCase } from "change-case"
 
 import { getFlag } from "@plasmo/utils/flags"
 
-const srcPath = getFlag("--src-path") || process.env.PLASMO_SRC_PATH || "src"
+export const getFlagMap = () => {
+  const srcPath = getFlag("--src-path") || process.env.PLASMO_SRC_PATH || "src"
 
-const buildPath =
-  getFlag("--build-path") || process.env.PLASMO_BUILD_PATH || "build"
+  const buildPath =
+    getFlag("--build-path") || process.env.PLASMO_BUILD_PATH || "build"
 
-const tag =
-  getFlag("--tag") ||
-  process.env.PLASMO_TAG ||
-  (process.env.NODE_ENV === "production" ? "prod" : "dev")
+  const tag =
+    getFlag("--tag") ||
+    process.env.PLASMO_TAG ||
+    (process.env.NODE_ENV === "production" ? "prod" : "dev")
 
-const target = paramCase(
-  getFlag("--target") || process.env.PLASMO_TARGET || "chrome-mv3"
-)
+  const target = paramCase(
+    getFlag("--target") || process.env.PLASMO_TARGET || "chrome-mv3"
+  )
 
-const entry = getFlag("--entry") || "popup"
+  const [browser, manifestVersion] = target.split("-")
 
-const envPath = getFlag("--env")
+  const entry = getFlag("--entry") || "popup"
 
-export const flagMap = {
-  tag,
-  srcPath,
-  buildPath,
-  target,
-  entry,
-  envPath
+  const envPath = getFlag("--env")
+
+  return {
+    browser,
+    manifestVersion,
+    tag,
+    srcPath,
+    buildPath,
+    target,
+    entry,
+    envPath
+  }
 }
 
 export const flagHelp = `

cli/plasmo/src/features/manifest-factory/base.ts

@@ -49,10 +49,7 @@ import {
   ProjectPath,
   getProjectPath
 } from "~features/extension-devtools/project-path"
-import {
-  TemplatePath,
-  getTemplatePath
-} from "~features/extension-devtools/template-path"
+import { getTemplatePath } from "~features/extension-devtools/template-path"
 import { updateVersionFile } from "~features/framework-update/version-tracker"
 import { getSubExt, toPosix } from "~features/helpers/path"
 import { definedTraverse } from "~features/helpers/traverse"

cli/plasmo/templates/plasmo.d.ts

@@ -23,6 +23,8 @@ declare namespace NodeJS {
 
     PLASMO_TARGET:
       | `${ProcessEnv["PLASMO_BROWSER"]}-${ProcessEnv["PLASMO_MANIFEST_VERSION"]}`
+
+    PLASMO_TAG: string
   }
 }
 

package.json

@@ -4,7 +4,6 @@
   "workspaces": [
     "cli/*",
     "packages/*",
-    "templates/*",
     "examples/*"
   ],
   "scripts": {
@@ -41,12 +40,12 @@
     "@types/semver": "7.3.13",
     "@types/sharp": "0.31.0",
     "@types/uuid": "8.3.4",
-    "esbuild": "0.15.14",
+    "esbuild": "0.15.15",
     "eslint": "8.28.0",
     "eslint-config-prettier": "8.5.0",
     "eslint-plugin-react": "7.31.11",
     "fs-extra": "10.1.0",
-    "prettier": "2.7.1",
+    "prettier": "2.8.0",
     "tsup": "6.5.0",
     "turbo": "1.6.3"
   },

packages/parcel-bundler/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plasmohq/parcel-bundler",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -19,6 +19,7 @@
   },
   "dependencies": {
     "@parcel/core": "2.8.0",
+    "@parcel/graph": "2.8.0",
     "@parcel/diagnostic": "2.8.0",
     "@parcel/hash": "2.8.0",
     "@parcel/plugin": "2.8.0",

packages/parcel-bundler/src/can-merge.ts

@@ -0,0 +1,10 @@
+export function canMerge(a, b) {
+  // Bundles can be merged if they have the same type and environment,
+  // unless they are explicitly marked as isolated or inline.
+  return (
+    a.type === b.type &&
+    a.env.context === b.env.context &&
+    a.bundleBehavior == null &&
+    b.bundleBehavior == null
+  )
+}

packages/parcel-bundler/src/create-bundle.ts

@@ -0,0 +1,45 @@
+import type { Asset, BundleBehavior, Environment, Target } from "@parcel/types"
+import nullthrows from "nullthrows"
+
+import type { Bundle } from "./types"
+
+export function createBundle(opts: {
+  uniqueKey?: string
+  target: Target
+  asset?: Asset
+  env?: Environment
+  type?: string
+  needsStableName?: boolean
+  bundleBehavior?: BundleBehavior | null | undefined
+}): Bundle {
+  if (opts.asset == null) {
+    return {
+      uniqueKey: opts.uniqueKey,
+      assets: new Set(),
+      internalizedAssetIds: [],
+      mainEntryAsset: null,
+      size: 0,
+      sourceBundles: new Set(),
+      target: opts.target,
+      type: nullthrows(opts.type),
+      env: nullthrows(opts.env),
+      needsStableName: Boolean(opts.needsStableName),
+      bundleBehavior: opts.bundleBehavior
+    }
+  }
+
+  let asset = nullthrows(opts.asset)
+  return {
+    uniqueKey: opts.uniqueKey,
+    assets: new Set([asset]),
+    internalizedAssetIds: [],
+    mainEntryAsset: asset,
+    size: asset.stats.size,
+    sourceBundles: new Set(),
+    target: opts.target,
+    type: opts.type ?? asset.type,
+    env: opts.env ?? asset.env,
+    needsStableName: Boolean(opts.needsStableName),
+    bundleBehavior: opts.bundleBehavior ?? asset.bundleBehavior
+  }
+}