Skip to content

Instantly share code, notes, and snippets.

@kiliman
Last active July 20, 2023 21:21
Show Gist options
  • Save kiliman/4b21a95b480d3b8b04b26cbc5ba42e29 to your computer and use it in GitHub Desktop.
Save kiliman/4b21a95b480d3b8b04b26cbc5ba42e29 to your computer and use it in GitHub Desktop.
Script to create Remix and Expo apps for Nx - Expo support is still work in progress
const { spawn } = require("child_process");
const fs = require("fs");
const command = process.argv[2];
const appName = process.argv[3];
if (!fs.existsSync("apps")) {
fs.mkdirSync("apps");
}
if (fs.existsSync(`apps/${appName}`)) {
console.log(`${appName} already exists`);
process.exit(1);
}
if (command === "remix") {
createRemixApp(appName);
} else if (command === "expo") {
createExpoApp(appName);
}
function createRemixApp(appName) {
const shell = spawn(
"npx",
[
"create-remix",
`apps/${appName}`,
"--template",
"remix",
"--no-install",
"--typescript",
],
{
stdio: "inherit",
}
);
shell.on("close", (code) => {
if (code !== 0) {
console.log(`create-remix process exited with code ${code}`);
process.exit(1);
}
updatePackageJson(appName);
createProjectJson(appName);
console.log(`🎉 ${appName} created`);
console.log(`👉 cd apps/${appName}`);
});
}
function createExpoApp(appName) {
const shell = spawn("npx", ["create-expo-app", `apps/${appName}`], {
stdio: "inherit",
});
shell.on("close", (code) => {
if (code !== 0) {
console.log(`create-expo-app process exited with code ${code}`);
process.exit(1);
}
updatePackageJson(appName);
createProjectJson(appName);
console.log(`🎉 ${appName} created`);
console.log(`👉 cd apps/${appName}`);
});
}
// updates nx workspace package.json with dependencies
// from newly created remix app
function updatePackageJson(appName) {
console.log(`📦 Updating package.json`);
const appPackageJson = JSON.parse(
fs.readFileSync(`apps/${appName}/package.json`).toString()
);
const nxPackageJson = JSON.parse(fs.readFileSync(`package.json`).toString());
// ensure dependencies and devDependencies exist
nxPackageJson.dependencies = nxPackageJson.dependencies || {};
nxPackageJson.devDependencies = nxPackageJson.devDependencies || {};
const deps = Object.keys(appPackageJson.dependencies).reduce((acc, dep) => {
if (nxPackageJson.dependencies[dep]) {
return acc;
}
acc[dep] = appPackageJson.dependencies[dep];
return acc;
}, {});
const devDeps = Object.keys(appPackageJson.devDependencies).reduce(
(acc, dep) => {
if (nxPackageJson.devDependencies[dep]) {
return acc;
}
acc[dep] = appPackageJson.devDependencies[dep];
return acc;
},
{}
);
nxPackageJson.dependencies = {
...nxPackageJson.dependencies,
...deps,
};
nxPackageJson.devDependencies = {
...nxPackageJson.devDependencies,
...devDeps,
};
fs.writeFileSync(`package.json`, JSON.stringify(nxPackageJson, null, 2));
}
// creates a new nx project.json file in the newly created remix app folder
// this adds new targets to the project that can be used by nx
// each target has an executor that is use to run the npm script in the package.json
function createProjectJson(appName) {
console.log(`✨ Creating project.json`);
let projectJson = {
name: appName,
$schema: "../../node_modules/nx/schemas/project-schema.json",
sourceRoot: `apps/${appName}`,
projectType: "application",
tags: [],
targets: {},
};
const appPackageJson = JSON.parse(
fs.readFileSync(`apps/${appName}/package.json`).toString()
);
Object.keys(appPackageJson.scripts).forEach((script) => {
projectJson.targets[script] = {
executor: "nx:run-script",
options: {
script,
cwd: `apps/${appName}`,
},
};
});
fs.writeFileSync(
`apps/${appName}/project.json`,
JSON.stringify(projectJson, null, 2)
);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment