[WIP] Implement plop base

code/react/handlebar-templates/App.tsx.hbs

@@ -1,8 +1,8 @@
 import { Suspense } from "react";
 {{#if router}}
-import { Router } from './routes';
+  import { Router } from './routes';
 {{else}}
-import Home from './ui/pages';
+  import Home from './ui/pages';
 {{/if}}
 import { AppProviders } from "./context";
 

package.json

@@ -13,7 +13,7 @@
     "eslint-config-custom": "workspace:*",
     "husky": "8.0.3",
     "lint-staged": "13.1.1",
-    "prettier": "2.8.4",
+    "prettier": "3.2.5",
     "turbo": "1.7.4"
   },
   "lint-staged": {

packages/start-frontend/src/index.ts

@@ -1,6 +1,5 @@
 #!/usr/bin/env node
-// @ts-ignore
-import { format } from "prettier";
+import prettier from "prettier";
 import fse from "fs-extra";
 import meow from "meow";
 import os from "node:os";
@@ -237,7 +236,7 @@ async function copyTests(
 /**
  * Copy common files into the target app directory
  */
-function copyCommon(appDir: string, sharedConfigDir: string) {
+async function copyCommon(appDir: string, sharedConfigDir: string) {
   fse.copySync(`${sharedConfigDir}/gitignore`, `${appDir}/gitignore`);
 
   // Rename dot files
@@ -269,7 +268,9 @@ function copyCommon(appDir: string, sharedConfigDir: string) {
   // Rewrite tsconfig.json
   fse.writeFileSync(
     path.join(appDir, "tsconfig.json"),
-    format(JSON.stringify(tsconfigObjs, null, 2), { parser: "json" })
+    await prettier.format(JSON.stringify(tsconfigObjs, null, 2), {
+      parser: "json",
+    })
   );
 }
 
@@ -335,10 +336,10 @@ async function run() {
   });
 
   const baseGenerator = plop.getGenerator("constructBase");
-  baseGenerator.runActions({});
+  await baseGenerator.runActions({});
 
   // Copy commons
-  copyCommon(appDir, sharedConfigDir);
+  await copyCommon(appDir, sharedConfigDir);
 
   console.log();
   console.log(`Success! Created a new app at "${path.basename(appDir)}".`);

packages/start-frontend/src/plopfile.ts

@@ -1,5 +1,6 @@
 import type { NodePlopAPI } from "node-plop";
 import path from "node:path";
+import prettier from "prettier";
 
 const TEMP_DIR = path.resolve(__dirname, "temp");
 
@@ -19,6 +20,9 @@ module.exports = function (plop: NodePlopAPI) {
           "handlebar-templates",
           "app.tsx.hbs"
         ),
+        transform: async (template) => {
+          return await prettier.format(template, { parser: "typescript" });
+        },
       },
     ],
   });

packages/start-frontend/tsup.config.ts

@@ -7,5 +7,6 @@ export default defineConfig((options: Options) => ({
   define: {
     "process.env.BRANCH_NAME": `"${process.env.BRANCH_NAME}"`,
   },
+  shims: true,
   ...options,
 }));