expo-desktop 0.1.34 → 0.1.36

package/build/common/app-json.js

@@ -26,6 +26,7 @@ export const AppJson = type({
 export const PackageJson = type({
     "name?": "string",
     "scripts?": "Record<string, string>",
+    "expo?": "Record<string, unknown.any>",
     "dependencies?": "Record<string, string>",
     "devDependencies?": "Record<string, string>",
     "peerDependencies?": "Record<string, string>",

package/build/common/apply-config-plugins.js

@@ -1,34 +1,18 @@
 import { createRequire } from "node:module";
-import * as path from "node:path";
 import { withInternal } from "./with-internal.js";
 const require = createRequire(import.meta.url);
 const { getPrebuildConfigAsync } = require("expo-desktop-prebuild-config");
 const { compileModsAsync } = require("expo-desktop-config-plugins");
+// These are subdependencies of expo-desktop-prebuild-config.
+const { getConfig } = require("@expo/config");
+const { withPlugins } = require("@expo/config-plugins");
 /**
  * Applies config plugins.
  * @see https://github.com/microsoft/react-native-test-app/blob/trunk/packages/app/scripts/config-plugins/apply.mjs
  */
 export async function applyConfigPlugins(options) {
     const { projectRoot } = options;
-    // To avoid making expo-desktop depend on Expo SDK 54 when we might be running
-    // on an Expo 55 project, we import Expo deps from the project itself.
-    let expoConfigModule;
-    try {
-        expoConfigModule = require(path.dirname(require.resolve("@expo/config/package.json", { paths: [projectRoot] })));
-    }
-    catch (cause) {
-        throw new Error(`Error importing "@expo/config" relative to projectRoot "${projectRoot}". Make sure to install node modules before running any prebuilds, and make sure that the project depends on the package named "expo".`, { cause });
-    }
-    const { getConfig } = expoConfigModule;
-    let expoConfigPluginsModule;
-    try {
-        expoConfigPluginsModule = require(path.dirname(require.resolve("@expo/config-plugins/package.json", { paths: [projectRoot] })));
-    }
-    catch (cause) {
-        throw new Error(`Error importing "@expo/config-plugins" relative to projectRoot "${projectRoot}". Make sure to install node modules before running any prebuilds, and make sure that the project depends on the package named "expo".`, { cause });
-    }
-    const { withPlugins } = expoConfigPluginsModule;
-    // (1) Filter out platforms that aren't in the app.json.
+    // Filter out platforms that aren't in the app.json.
     // https://github.com/expo/expo/blob/8dd645080f52927e2a8bf406167da7241a1d46d8/packages/%40expo/cli/src/prebuild/prebuildAsync.ts#L74
     let { exp: expoConfig } = getConfig(projectRoot);
     const { platforms, plugins } = expoConfig;

package/build/common/git.js

@@ -0,0 +1,43 @@
+import { spawn } from "node:child_process";
+import fs from "node:fs/promises";
+import path from "node:path";
+/** True when the project root has its own `.git` (from create-expo-app's init). */
+export async function hasProjectGitRepositoryAsync(projectPath) {
+    try {
+        await fs.lstat(path.join(projectPath, ".git"));
+        return true;
+    }
+    catch (error) {
+        if (error instanceof Error && "code" in error && error.code === "ENOENT") {
+            return false;
+        }
+        throw error;
+    }
+}
+/** `git diff --cached --quiet` exits 1 when there are staged changes. */
+export async function hasGitStagedChangesAsync(projectPath) {
+    try {
+        await runGitAsync(projectPath, ["diff", "--cached", "--quiet"]);
+        return false;
+    }
+    catch {
+        return true;
+    }
+}
+function runGitAsync(projectPath, args) {
+    return new Promise((resolve, reject) => {
+        const cp = spawn(`git ${args.join(" ")}`, {
+            cwd: projectPath,
+            shell: true,
+            stdio: "ignore",
+        });
+        cp.on("error", reject);
+        cp.on("close", (code) => {
+            if (code === 0) {
+                resolve();
+                return;
+            }
+            reject(new Error(`git ${args.join(" ")} exited with code ${code ?? "null"}`));
+        });
+    });
+}

package/build/create-app/create-expo-desktop-app.js

@@ -11,6 +11,7 @@ import { applyConfigPlugins } from "../common/apply-config-plugins.js";
 import { makePrettySummary } from "../common/arktype.js";
 import { promisifiedSpawnTask, SPAWN_DEBUG_LOG_GLOB } from "../common/child-process.js";
 import { title } from "../common/clack.js";
+import { hasGitStagedChangesAsync, hasProjectGitRepositoryAsync } from "../common/git.js";
 import { packageManagerExec } from "../common/npm.js";
 import { preserveFile } from "../common/preserve-file.js";
 import { applySelectedTemplatesAsync } from "../common/template.js";
@@ -103,6 +104,10 @@ export async function createExpoDesktopApp({ localDev, name, packageManager, tem
     await improveMetroConfig({ projectPath });
     title("Adding Expo support to the Babel config…", { spacing: 1 });
     await writeBabelConfig({ projectPath });
+    title("Improving App.tsx…", { spacing: 1 });
+    await improveAppTsx({ projectPath });
+    title("Committing changes…", { spacing: 1 });
+    await commitChanges({ projectPath });
     logProjectReady({ cdPath: name.filesafeName, packageManager });
 }
 async function getBundleEntryFileCandidates({ projectPath }) {
@@ -363,6 +368,24 @@ async function updatePackageJson({ localDev, name, projectPath, task, versions,
                 packageJson.overrides["react-native"] = packageJson.dependencies["react-native"];
             }
         }
+        if (!packageJson.expo) {
+            packageJson.expo = {};
+        }
+        if (!packageJson.expo.install) {
+            packageJson.expo.install = {};
+        }
+        if (!packageJson.expo.install.exclude) {
+            packageJson.expo.install.exclude = [];
+        }
+        // Stop `expo start` erroneously warning about our overrides.
+        // - https://github.com/shirakaba/expo-desktop/issues/15
+        // - https://docs.expo.dev/versions/latest/config/package-json/#installexclude
+        if (!packageJson.expo.install.exclude.includes("react")) {
+            packageJson.expo.install.exclude.push("react");
+        }
+        if (!packageJson.expo.install.exclude.includes("react-native")) {
+            packageJson.expo.install.exclude.push("react-native");
+        }
     }
     try {
         await fs.writeFile(packageJsonPath, JSON.stringify(packageJson, null, 2), "utf-8");
@@ -622,6 +645,93 @@ module.exports = function (api) {
     }
     console.log(`\n${green("◆")}  Wrote babel.config.js.\n`);
 }
+/**
+ * Improve the App.tsx so that it's not white-on-white on macOS in dark mode.
+ * Here, we simply ensure that it's black-on-white in both light and dark modes.
+ *
+ * @see https://github.com/shirakaba/expo-desktop/pull/14#issuecomment-4614018796
+ * @see https://github.com/expo/expo/blob/sdk-54/templates/expo-template-blank-typescript/App.tsx
+ */
+async function improveAppTsx({ projectPath }) {
+    const metroConfigPath = path.resolve(projectPath, "App.tsx");
+    console.log(`${cyan("◆")}  Overwriting App.tsx…\n`);
+    try {
+        await fs.writeFile(metroConfigPath, `
+import { StatusBar } from 'expo-status-bar';
+import { StyleSheet, Text, View } from 'react-native';
+
+export default function App() {
+  return (
+    <View style={styles.container}>
+      <Text style={styles.text}>Open up App.tsx to start working on your app!</Text>
+      <StatusBar style="auto" />
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: '#fff',
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  text: {
+    color: '#000',
+  },
+});
+    `.trim() + "\n", "utf-8");
+    }
+    catch (error) {
+        log.error(`Error improving ${yellow("App.tsx")} file${error instanceof Error ? `: ${error.message}` : "."}`);
+        process.exit(1);
+    }
+    console.log(`\n${green("◆")}  Overwrote App.tsx.\n`);
+}
+/**
+ * Stage and commit all changes.
+ *
+ * @see https://github.com/expo/expo/blob/main/packages/create-expo/src/utils/git.ts
+ */
+async function commitChanges({ projectPath }) {
+    if (!(await hasProjectGitRepositoryAsync(projectPath))) {
+        console.warn(`\n${yellow("⚠")}  Skipping git commit: create-expo-app did not initialize a Git repository in this project (this happens when creating inside an existing repo, e.g. in a monorepo).\n`);
+        return;
+    }
+    try {
+        await tasks([
+            promisifiedSpawnTask({
+                title: "git add",
+                command: "git",
+                args: ["add", "-A"],
+                options: { cwd: projectPath, stdio: "ignore" },
+            }),
+        ]);
+    }
+    catch (error) {
+        log.error(`Error running ${yellow("git add -A")}${error instanceof Error ? `: ${error.message}` : "."}`);
+        process.exit(1);
+    }
+    if (!(await hasGitStagedChangesAsync(projectPath))) {
+        console.log(`\n${green("◆")}  Nothing to commit.\n`);
+        return;
+    }
+    try {
+        await tasks([
+            promisifiedSpawnTask({
+                title: "git commit",
+                command: "git",
+                args: ["commit", "-m", "Set up with expo-desktop"],
+                options: { cwd: projectPath, stdio: "ignore" },
+            }),
+        ]);
+    }
+    catch (error) {
+        log.error(`Error running ${yellow("git commit")}${error instanceof Error ? `: ${error.message}` : "."}`);
+        process.exit(1);
+    }
+    console.log(`\n${green("◆")}  Committed changes.\n`);
+}
 /**
  * For now, this is just a convenience script to allow me to run the config
  * plugins again after creating the app, to help with development. But it is
@@ -637,6 +747,10 @@ const require = createRequire(import.meta.url);
 const { getPrebuildConfigAsync } = require("expo-desktop-prebuild-config");
 const { compileModsAsync } = require("expo-desktop-config-plugins");
 
+// These are subdependencies of expo-desktop-prebuild-config.
+const { getConfig } = require("@expo/config");
+const { withPlugins } = require("@expo/config-plugins");
+
 const projectRoot = import.meta.dirname;
 
 const info = {
@@ -679,33 +793,7 @@ const withInternal = (config, internals) => {
 async function applyConfigPlugins(options) {
   const { projectRoot } = options;
 
-  // To avoid making expo-desktop depend on Expo SDK 54 when we might be running
-  // on an Expo 55 project, we import Expo deps from the project itself.
-  /** @type {typeof import("@expo/config")} */
-  let expoConfigModule;
-  try {
-    expoConfigModule = require("@expo/config");
-  } catch (cause) {
-    throw new Error(
-      \`Error importing "@expo/config" relative to projectRoot "\${projectRoot}". Make sure to install node modules before running any prebuilds, and make sure that the project depends on the package named "expo".\`,
-      { cause },
-    );
-  }
-  const { getConfig } = expoConfigModule;
-
-  /** @type {typeof import("@expo/config-plugins")} */
-  let expoConfigPluginsModule;
-  try {
-    expoConfigPluginsModule = require("@expo/config-plugins");
-  } catch (cause) {
-    throw new Error(
-      \`Error importing "@expo/config-plugins" relative to projectRoot "\${projectRoot}". Make sure to install node modules before running any prebuilds, and make sure that the project depends on the package named "expo".\`,
-      { cause },
-    );
-  }
-  const { withPlugins } = expoConfigPluginsModule;
-
-  // (1) Filter out platforms that aren't in the app.json.
+  // Filter out platforms that aren't in the app.json.
   // https://github.com/expo/expo/blob/8dd645080f52927e2a8bf406167da7241a1d46d8/packages/%40expo/cli/src/prebuild/prebuildAsync.ts#L74
   let { exp: expoConfig } = getConfig(projectRoot);
   const { platforms, plugins } = expoConfig;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "expo-desktop",
-  "version": "0.1.34",
+  "version": "0.1.36",
   "description": "Best-effort desktop support for Expo",
   "keywords": [
     "android",
@@ -37,8 +37,8 @@
     "@clack/prompts": "^1.2.0",
     "arktype": "^2.2.0",
     "citty": "^0.2.2",
-    "expo-desktop-config-plugins": "^1.1.31",
-    "expo-desktop-prebuild-config": "^1.0.17",
+    "expo-desktop-config-plugins": "^1.1.33",
+    "expo-desktop-prebuild-config": "^1.0.19",
     "glob": "^10.5.0",
     "kleur": "^4.1.5",
     "mustache": "^4.2.0",
@@ -46,18 +46,14 @@
     "toml": "^4.1.1"
   },
   "devDependencies": {
-    "@expo/config": "^12.0.13",
-    "@expo/config-plugins": "^54.0.4",
+    "@expo/config": "^56.0.9",
+    "@expo/config-plugins": "^56.0.8",
     "@tsconfig/node24": "^24.0.4",
     "@types/mustache": "^4.2.6",
     "@types/node": "^24.12.2",
     "@typescript/native-preview": "^7.0.0-dev.20260425.1",
     "vitest": "^3.2.4"
   },
-  "peerDependencies": {
-    "@expo/config": ">=12.0.0",
-    "@expo/config-plugins": ">=54.0.0"
-  },
   "lint-staged": {
     "scripts/update-schema.ts": [
       "node --run schema",