makepack 1.0.0 → 1.0.2

package/README.md

@@ -0,0 +1,132 @@
+# MakePack CLI Documentation
+
+## Overview
+
+**MakePack** is a command-line interface (CLI) tool that helps you to quickly set up, build, and manage JavaScript, TypeScript, React, and React-TypeScript libraries for use in npm projects. With just a few simple commands, you can generate your own libraries, start a development server, or build and publish your project to the npm repository.
+
+## Installation
+
+To install **MakePack** globally, run the following command:
+
+```bash
+npm install -g makepack
+```
+
+This will allow you to use the `makepack` command anywhere in your terminal.
+
+## Commands
+
+### `create`
+
+The `create` command is used to create a new library project. It initializes the project structure, configures essential files, and sets up the environment for you to start working on your library.
+
+#### Usage
+
+```bash
+makepack create
+```
+
+#### Description
+
+- Creates a new library project by setting up the necessary configurations and boilerplate files.
+  
+This command will guide you through the initial setup for your library.
+
+---
+
+### `serve`
+
+The `serve` command starts a development server for your library, providing you with a live-reload environment where you can test and iterate on your library in real-time.
+
+#### Usage
+
+```bash
+makepack serve [options]
+```
+
+#### Options
+
+- `-p, --port <type>`  
+  _Port number_ (default is `3000`).
+  
+- `-e, --entry <type>`  
+  _Entry file_ (optional). The entry point for your application. Specify the main JavaScript/TypeScript file to start the server.
+
+#### Description
+
+- Starts a local development server for testing and debugging your library.
+  
+Example:
+
+```bash
+makepack serve --port 4000 --entry src/index.ts
+```
+
+---
+
+### `pack`
+
+The `pack` command is used to build your library and optionally publish it to the npm repository. This command compiles your code into a distributable format and prepares it for sharing with others.
+
+#### Usage
+
+```bash
+makepack pack [options]
+```
+
+#### Options
+
+- `-e, --entry <type>`  
+  _Entry file or directory_ (default is `src/**/*.{tsx,ts,js,jsx}`).  
+  Specify the entry file or use a glob pattern to select the files to include in your library.
+
+- `-p, --publish`  
+  _Publish the project to the npm repository_ (default is `false`).  
+  Add this flag if you want to publish the library to npm after building it.
+
+#### Description
+
+- Builds the project by compiling and bundling your library.
+- Optionally publishes the library to the npm repository.
+
+Example:
+
+```bash
+makepack pack --entry src/index.ts --publish
+```
+
+This will compile the project from `src/index.ts` and then publish the library to npm.
+
+---
+
+## Example Workflow
+
+1. Create a new project:
+
+```bash
+makepack create
+```
+
+2. Start the server for development:
+
+```bash
+makepack serve --port 4000 --entry src/index.ts
+```
+
+3. Once you're ready to build and publish your library:
+
+```bash
+makepack pack --entry src/**/*.{tsx,ts,js,jsx} --publish
+```
+
+This will build your library and publish it to npm.
+
+## GitHub Repository
+
+For more details, open issues, or contribute to the project, visit the [MakePack GitHub Repository](https://github.com/devnax/makepack).
+
+---
+
+## License
+
+This project is licensed under the MIT License. See the LICENSE file for more information.

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "makepack",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "type": "module",
-  "description": "A simple CLI tool to create a new npm package",
+  "description": "A CLI tool to create, build, and manage JavaScript, TypeScript, React, and React-TypeScript libraries for npm projects.",
   "categories": [
     "Other"
   ],
@@ -15,31 +15,29 @@
     "type": "git",
     "url": "https://github.com/devnax/makepack"
   },
+  "bugs": {
+    "url": "https://github.com/devnax/makepack/issues"
+  },
+  "homepage": "https://github.com/devnax/makepack#readme",
   "scripts": {},
-  "devDependencies": {
-    "@eslint/js": "^9.15.0",
-    "@types/express": "^5.0.0",
-    "@types/node": "^22.10.1",
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
-    "@vitejs/plugin-react": "^4.3.4",
+  "devDependencies": {},
+  "dependencies": {
     "commander": "^12.1.0",
+    "inquirer": "^12.1.0",
     "esbuild": "^0.24.2",
-    "eslint": "^9.15.0",
-    "eslint-plugin-react-hooks": "^5.0.0",
-    "eslint-plugin-react-refresh": "^0.4.14",
     "express": "^4.21.1",
     "fs-extra": "^11.2.0",
-    "globals": "^15.12.0",
-    "inquirer": "^12.1.0",
-    "tsx": "^4.19.2",
     "typescript": "^5.7.2",
-    "typescript-eslint": "^8.15.0",
-    "vite": "^6.0.2"
+    "vite": "^6.0.2",
+    "glob": "^11.0.0"
   },
-  "dependencies": {
-    "glob": "^11.0.0",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1"
-  }
+  "keywords": [
+    "CLI",
+    "npm",
+    "library",
+    "JavaScript",
+    "TypeScript",
+    "React",
+    "npm-package"
+  ]
 }

package/src/actions/create/files/gitignore.js

@@ -0,0 +1,6 @@
+export default (args) => {
+   return {
+      content: `node_modules\n$${args.outdir}`,
+      filename: ".gitignore"
+   }
+}

package/src/actions/create/files/makepack.js

@@ -0,0 +1,19 @@
+export default (args) => {
+   const makepack = {
+      "template": `${args.template}`,
+      "serve": {
+         "port": 3000,
+         "entry": `${args.rootdir}/${args.entry}`
+      },
+      "build": {
+         "entry": `${args.rootdir}/**/*.{tsx,ts,js,jsx}`,
+         "outdir": `${args.outdir}`,
+         "esbuild": {
+         }
+      },
+   }
+   return {
+      content: `const makepack = ${JSON.stringify(makepack, null, 2)}\nexport default makepack\n`,
+      filename: "makepack.js"
+   }
+}

package/src/actions/create/files/package-json.js

@@ -0,0 +1,38 @@
+export default (args) => {
+   let dependencies = {}
+   let devDependencies = {
+      "makepack": "latest"
+   }
+
+   if (args.template.includes("react")) {
+      dependencies = {
+         "react": "^17.0.2",
+         "react-dom": "^17.0.2"
+      }
+   }
+
+   if (args.template.includes("typescript")) {
+      devDependencies["typescript"] = "^4.4.2"
+      devDependencies["@types/react"] = "^18.3.12"
+      devDependencies["@types/react-dom"] = "^18.3.1"
+   }
+
+   const json = {
+      name: args.diraname,
+      version: "1.0.0",
+      description: "",
+      main: `${args.outdir}/${args.entry}`,
+      scripts: {
+         "start": "makepack serve",
+         "build": "makepack build",
+      },
+      dependencies,
+      devDependencies,
+      keywords: [],
+   }
+
+   return {
+      content: JSON.stringify(json, null, 3),
+      filename: "package.json"
+   }
+}

package/src/actions/create/files/project-js.js

@@ -0,0 +1,13 @@
+export default (args) => {
+  const content = `
+function add(a, b) {
+  return a + b;
+}
+
+console.log(add(5, 3));
+  `
+  return {
+    content,
+    filename: `${args.rootdir}/${args.entry}`
+  }
+}

package/src/actions/create/files/project-react-js.js

@@ -0,0 +1,25 @@
+export default (args) => {
+  const content = `import React from 'react';
+const App = () => {
+  return (
+    <div style={{ textAlign: 'center', marginTop: '50px' }}>
+      <h1>Welcome to React JS with makepack CLI!</h1>
+      <p>Edit <code>index.tsx</code> and save to reload.</p>
+      <a
+        href="https://reactjs.org"
+        target="_blank"
+        rel="noopener noreferrer"
+        style={{ color: '#61dafb', textDecoration: 'none' }}
+      >
+        Learn React
+      </a>
+    </div>
+  );
+};
+export default App;
+  `
+  return {
+    content,
+    filename: `${args.rootdir}/${args.entry}`
+  }
+}

package/src/actions/create/files/project-react-ts.js

@@ -0,0 +1,25 @@
+export default args => {
+  const content = `import React from 'react';
+const App: React.FC  = () => {
+  return (
+    <div style={{ textAlign: 'center', marginTop: '50px' }}>
+      <h1>Welcome to React Typescript with makepack CLI!</h1>
+      <p>Edit <code>index.tsx</code> and save to reload.</p>
+      <a
+        href="https://reactjs.org"
+        target="_blank"
+        rel="noopener noreferrer"
+        style={{ color: '#61dafb', textDecoration: 'none' }}
+      >
+        Learn React
+      </a>
+    </div>
+  );
+}
+export default App;
+  `
+  return {
+    content,
+    filename: `${args.rootdir}/${args.entry}`
+  }
+}

package/src/actions/create/files/project-ts.js

@@ -0,0 +1,11 @@
+export default args => {
+  const content = `
+function add(a: number, b: number): number {
+  return a + b;
+}
+console.log(add(5, 3)); `
+  return {
+    content,
+    filename: `${args.rootdir}/${args.entry}`
+  }
+}

package/src/actions/create/files/tsconfig.js

@@ -0,0 +1,32 @@
+export default args => {
+   const content = {
+      "compilerOptions": {
+         "target": "es5",
+         "lib": [
+            "dom",
+            "dom.iterable",
+            "esnext"
+         ],
+         "allowJs": true,
+         "skipLibCheck": true,
+         "esModuleInterop": true,
+         "allowSyntheticDefaultImports": true,
+         "strict": true,
+         "forceConsistentCasingInFileNames": true,
+         "module": "esnext",
+         "moduleResolution": "node",
+         "resolveJsonModule": true,
+         "isolatedModules": true,
+         "noEmit": true,
+      },
+      "include": [args.rootdir],
+      "exclude": [
+         "node_modules"
+      ]
+   }
+
+   return {
+      content: JSON.stringify(content, null, 2),
+      filename: "tsconfig.json"
+   }
+}

package/src/actions/create/index.js

@@ -0,0 +1,26 @@
+import { execSync, logLoader, __dirname } from "../../helpers.js"
+import makeProjectInformation from "./makeProjectInformation.js"
+import makeFiles from "./makeFiles.js"
+
+const create = async () => {
+   let projectInformation = await makeProjectInformation()
+   let loader = logLoader("Creating project...")
+   await makeFiles(projectInformation)
+   loader.stop("")
+
+   loader = logLoader("Installing dependencies...")
+   execSync("npm install", {
+      cwd: projectInformation.cwd,
+   })
+
+   loader.stop("Project setup complete!")
+   if (projectInformation.isCurrentDir) {
+      console.log(`Run the development server: \n makepack serve\nEnjoy your new project! 😊`);
+   } else {
+      console.log(`To start working with your project:\n1. Navigate to your project directory:\ncd ${projectInformation.dirname}\n2. Run the development server:\nmakepack serve\nEnjoy your new project! 😊`);
+   }
+
+
+}
+
+export default create

package/src/actions/create/makeFiles.js

@@ -0,0 +1,42 @@
+// import makepack from "./files/makepack.js";
+import packageJson from "./files/package-json.js";
+import gitignore from "./files/gitignore.js";
+import tsconfig from "./files/tsconfig.js";
+import projectJs from "./files/project-js.js";
+import projectTs from "./files/project-ts.js";
+import projectReactJs from "./files/project-react-js.js";
+import projectReactTs from "./files/project-react-ts.js";
+
+import fs from "fs-extra"
+import path from "path"
+
+export default async (args) => {
+   const files = [
+      packageJson(args),
+      gitignore(args),
+   ];
+
+   switch (args.template) {
+      case "typescript":
+         files.push(projectTs(args))
+         break;
+      case "javascript":
+         files.push(projectJs(args))
+         break;
+      case "react with typescript":
+         files.push(projectReactTs(args))
+         break;
+      case "react with javascript":
+         files.push(projectReactJs(args))
+         break;
+   }
+
+   // push ts config
+   if (args.template.includes("typescript")) {
+      files.push(tsconfig(args))
+   }
+
+   for (let file of files) {
+      fs.writeFileSync(path.join(args.cwd, file.filename), file.content)
+   }
+}

package/src/actions/create/makeProjectDirectory.js

@@ -0,0 +1,42 @@
+import path from "path"
+import fs from "fs-extra"
+import inquirer from "inquirer"
+const cwd = process.cwd()
+const cwdFolder = cwd.split(path.sep).pop()
+
+export default async () => {
+   const { projectDirName } = await inquirer.prompt([
+      {
+         type: 'input',
+         name: 'projectDirName',
+         message: 'Enter the project name',
+         default: cwdFolder
+      }
+   ])
+
+   let projectDir = cwd
+
+   if (projectDirName !== cwdFolder) {
+      projectDir = path.join(cwd, projectDirName);
+      if (fs.existsSync(projectDir)) {
+         const { proceed } = await inquirer.prompt([
+            {
+               type: "confirm",
+               name: 'proceed',
+               message: "The directory already exists, do you want to overwrite it?",
+               default: cwdFolder
+            }
+         ])
+         if (!proceed) {
+            console.log('Project creation canceled.');
+            return
+         }
+      }
+   }
+
+   return {
+      cwd: projectDir,
+      diraname: path.basename(projectDir),
+      isCurrentDir: projectDirName === cwdFolder
+   }
+}

package/src/actions/create/makeProjectInformation.js

@@ -0,0 +1,66 @@
+import inquirer from "inquirer"
+import makeProjectDirectory from "./makeProjectDirectory.js"
+import fs from "fs-extra"
+import path from "path"
+const cwd = process.cwd()
+const cwdFolder = cwd.split(path.sep).pop()
+
+const makeProjectInformation = async () => {
+   const projectDir = await makeProjectDirectory()
+   const information = await inquirer.prompt([
+      {
+         type: 'list',
+         name: 'template',
+         message: 'Select a template',
+         choices: ['typescript', 'javascript', 'react with typescript', 'react with javascript'],
+         default: 'typeScript'
+      },
+   ])
+
+   if (projectDir.diraname !== cwdFolder) {
+      fs.removeSync(projectDir.cwd)
+      fs.mkdirSync(projectDir.cwd)
+   }
+   information.entry = "index"
+   information.rootdir = "src"
+
+   switch (information.template) {
+      case "typescript":
+         information.entry = information.entry + ".ts"
+         break;
+      case "javascript":
+         information.entry = information.entry + ".js"
+         break;
+      case "react with typescript":
+         information.entry = information.entry + ".tsx"
+         break;
+      case "react with javascript":
+         information.entry = information.entry + ".jsx"
+         break;
+   }
+
+   fs.mkdirSync(path.join(projectDir.cwd, information.rootdir))
+
+   /* 
+   {
+     port: 3000,
+     outdir: "pack",
+     cwd: 'C:\xampp\htdocs\makepack\asd',
+     diraname: 'asd',
+     isCurrentDir: false,
+     template: 'typescript',
+     rootdir: 'src',
+     entry: 'index'
+   }
+   */
+
+   return {
+      port: 3000,
+      outdir: "pack",
+      rootdir: "src",
+      ...projectDir,
+      ...information
+   }
+}
+
+export default makeProjectInformation

package/src/actions/{build.js → pack.js}

@@ -1,19 +1,21 @@
-import inquirer from 'inquirer'
 import esbuild from 'esbuild';
 import fs from 'fs-extra';
 import path from 'path';
 import { glob } from 'glob'
 import ts from 'typescript'
+import { execSync, logLoader } from '../helpers';
 
 const pack = async (args) => {
+   args.outdir = 'pack'
    try {
       fs.removeSync(path.join(process.cwd(), args.outdir));
    } catch (err) { }
 
-   const files = await glob('test/**/*.{tsx,ts,js,jsx}') || []
+   const files = await glob('src/**/*.{tsx,ts,js,jsx}') || []
    const entries = files.map(entry => path.join(process.cwd(), entry))
+   let loader = logLoader("Generating a production build for the package...")
 
-   esbuild.build({
+   esbuild.buildSync({
       entryPoints: entries,
       outdir: path.join(process.cwd(), args.outdir),
       minify: true,
@@ -21,13 +23,18 @@ const pack = async (args) => {
       format: "esm",
       platform: 'node',
       loader: { '.ts': 'ts' },
-      tsconfig: path.join(process.cwd(), 'tsconfig.json'),
-   }).then(() => {
-      console.log('Build completed successfully!');
-   }).catch((err) => {
-      console.error('Build failed:', err);
-   });
-
+      //       tsconfig: path.join(process.cwd(), 'tsconfig.json'),
+      //       tsconfigRaw: `{
+      //   "compilerOptions": {
+      //     "declaration": true,
+      //     "emitDeclarationOnly": true,
+      //     "jsx": "react",
+      //     "module": "esnext",
+      //   }
+      // }`
+   })
+   loader.stop()
+   loader = logLoader("🔄 Generating TypeScript declarations...")
    const options = {
       declaration: true,
       emitDeclarationOnly: true,
@@ -53,8 +60,23 @@ const pack = async (args) => {
          }
       });
    } else {
-      console.log('Type declarations generated successfully!');
+      console.log('✅ TypeScript declaration files generated successfully!');
    }
+   loader.stop()
+
+   fs.copyFileSync(path.join(process.cwd(), '/package.json'), path.join(process.cwd(), args.outdir, `/package.json`))
+   console.log('✅ Production build generated successfully! The package is ready for deployment.');
+
+   if (args.publish) {
+      console.log("Publishing the production build to the npm repository...")
+      execSync(`npm publish`, {
+         cwd: path.join(process.cwd(), args.outdir)
+      })
+   } else {
+      console.log(`To publish your package:\n1. Navigate to the ${args.outdir} directory:\ncd ./${args.outdir}\n2. Publish the package to npm:\nnpm publish\nYour package is ready to share with the world! 🚀`);
+   }
+
+
 }
 
 export default pack

package/src/actions/serve.js

@@ -1,19 +1,33 @@
 import inquirer from 'inquirer'
+import fs from 'fs-extra'
+import path from 'path'
 import { createServer as createViteServer } from 'vite';
 import express from 'express';
+import { glob } from 'glob'
 
 const app = express();
 
 const serve = async (args) => {
 
    if (args.entry === undefined) {
-      const { entry } = await inquirer.prompt([{
-         type: 'input',
-         name: 'entry',
-         message: 'Enter the root file',
-         default: 'src/index.js'
-      }]);
-      args.entry = entry;
+      const indexes = await glob('src/index.{ts,js,tsx,jsx}', {
+         cwd: process.cwd()
+      })
+      if (!indexes.length) {
+         let { entry } = await inquirer.prompt([{
+            type: 'input',
+            name: 'entry',
+            message: 'Enter the root file',
+         }]);
+         entry = "src/" + entry
+
+         if (!fs.existsSync(path.join(process.cwd(), entry))) {
+            throw new Error(`invalid entry: ${entry}`);
+         }
+         args.entry = entry;
+      } else {
+         args.entry = indexes[0];
+      }
    }
 
    let template = `

package/src/helpers.js

@@ -2,9 +2,8 @@ import child_process from 'child_process'
 import path from 'path';
 import fs from 'fs';
 import { fileURLToPath } from 'url'
-
 export const packageDir = process.cwd() + "/node_modules/xanos"
-const __dirname = path.dirname(fileURLToPath(import.meta.url))
+export const __dirname = path.dirname(fileURLToPath(import.meta.url))
 
 
 export const logLoader = (message = "") => {
@@ -57,4 +56,5 @@ export const packageJson = () => {
    } catch (error) {
       console.error('Error reading package.json', error);
    }
-}
+}
+

package/src/index.js

@@ -2,8 +2,9 @@
 
 import { Command } from "commander";
 import serve from "./actions/serve.js";
-import build from "./actions/build.js";
-import create from "./actions/create.js";
+import pack from "./actions/pack.js";
+import create from "./actions/create/index.js";
+
 const program = new Command();
 
 program.name("Make Pack").description("Usages");
@@ -21,10 +22,9 @@ program
    .action(serve);
 
 program
-   .command("build")
-   .option("-e, --entry <type>", "entry file o directory (you can use glob pattern)", "src/**/*.{tsx,ts,js,jsx}")
-   .option("-out, --outdir <type>", "output directory", "build")
-   .description("build the project")
-   .action(build);
-
+   .command("pack")
+   .option("-e, --entry <type>", "Entry file or directory (you can use a glob pattern)", "src/**/*.{tsx,ts,js,jsx}")
+   .option("-p, --publish", "Publish the project to the npm repository", false)
+   .description("Build the project and optionally publish it to the npm repository")
+   .action(pack);
 program.parse();

package/index.html

@@ -1,16 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-   <meta charset="UTF-8" />
-   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-   <meta http-equiv="X-UA-Compatible" content="ie=edge" />
-   <title>Playground</title>
-</head>
-
-<body>
-   <div id="root"></div>
-   <script type="module" src="./index.tsx"></script>
-</body>
-
-</html>

package/src/actions/create.js

@@ -1,195 +0,0 @@
-import path from "path"
-import fs from "fs-extra"
-import inquirer from "inquirer"
-import { execSync, logLoader } from "../helpers.js"
-const cwd = process.cwd()
-const cwdFolder = cwd.split(path.sep).pop()
-
-const create = async (args) => {
-   const { projectDirName } = await inquirer.prompt([
-      {
-         type: 'input',
-         name: 'projectDirName',
-         message: 'Enter the project name',
-         default: cwdFolder
-      }
-   ])
-
-   let projectDir = cwd
-
-   if (projectDirName !== cwdFolder) {
-      projectDir = path.join(cwd, projectDirName);
-      if (fs.existsSync(projectDir)) {
-         const { proceed } = await inquirer.prompt([
-            {
-               type: "confirm",
-               name: 'proceed',
-               message: "The directory already exists, do you want to overwrite it?",
-               default: cwdFolder
-            }
-         ])
-         if (!proceed) {
-            console.log('Project creation canceled.');
-            return
-         }
-      }
-
-   }
-
-   let { template } = await inquirer.prompt([
-      {
-         type: 'list',
-         name: 'template',
-         message: 'Select a template',
-         choices: ['typescript', 'javascript', 'react with typescript', 'react with javascript'],
-         default: 'typeScript'
-      }
-   ])
-
-   if (projectDirName !== cwdFolder) {
-      fs.removeSync(projectDir)
-      fs.mkdirSync(projectDir)
-   }
-   let dependencies = {}
-   let devDependencies = {
-      // "make-pack": "@latest"
-   }
-
-   if (template.includes("react")) {
-      dependencies = {
-         "react": "^17.0.2",
-         "react-dom": "^17.0.2"
-      }
-   }
-
-   if (template.includes("typescript")) {
-      devDependencies["typescript"] = "^4.4.2"
-      devDependencies["@types/react"] = "^18.3.12"
-      devDependencies["@types/react-dom"] = "^18.3.1"
-   }
-
-   let loader = logLoader("Creating project...")
-   fs.mkdirSync(path.join(projectDir, "src"))
-   fs.writeFileSync(path.join(projectDir, "package.json"), JSON.stringify({
-      name: projectDirName,
-      version: "1.0.0",
-      description: "",
-      main: "index.js",
-      scripts: {
-         "start": "makepack serve",
-         "build": "makepack build",
-      },
-      dependencies,
-      devDependencies,
-      keywords: [],
-   }, null, 2), "utf-8")
-
-   switch (template) {
-      case "typescript":
-         fs.writeFileSync(path.join(projectDir, "src/index.ts"), `console.log("Hello, World!")`, "utf-8")
-         break;
-      case "react with typescript":
-         fs.writeFileSync(path.join(projectDir, "src/index.tsx"), `import React from 'react';
-
-const App: React.FC = () => {
-  return (
-    <div style={{ textAlign: 'center', marginTop: '50px' }}>
-      <h1>Welcome to React Typescript with make-pack CLI!</h1>
-      <p>Edit <code>index.tsx</code> and save to reload.</p>
-      <a
-        href="https://reactjs.org"
-        target="_blank"
-        rel="noopener noreferrer"
-        style={{ color: '#61dafb', textDecoration: 'none' }}
-      >
-        Learn React
-      </a>
-    </div>
-  );
-};
-
-export default App;
-         `)
-
-         break;
-      case "javascript":
-         fs.writeFileSync(path.join(projectDir, "src/index.js"), `console.log("Hello, World!")`, "utf-8")
-         break;
-      case "react with javascript":
-         fs.writeFileSync(path.join(projectDir, "src/index.jsx"), `import React from 'react';
-
-const App: React.FC = () => {
-  return (
-    <div style={{ textAlign: 'center', marginTop: '50px' }}>
-      <h1>Welcome to React JS with make-pack CLI!</h1>
-      <p>Edit <code>index.jsx</code> and save to reload.</p>
-      <a
-        href="https://reactjs.org"
-        target="_blank"
-        rel="noopener noreferrer"
-        style={{ color: '#61dafb', textDecoration: 'none' }}
-      >
-        Learn React
-      </a>
-    </div>
-  );
-};
-export default App;
-         `)
-         break;
-   }
-
-   // generate tsconfig.json
-   if (template.includes("typescript")) {
-      let config = {
-         "compilerOptions": {
-            "target": "es5",
-            "lib": ["dom", "dom.iterable", "esnext"],
-            "allowJs": true,
-            "skipLibCheck": true,
-            "esModuleInterop": true,
-            "allowSyntheticDefaultImports": true,
-            "strict": true,
-            "forceConsistentCasingInFileNames": true,
-            "module": "esnext",
-            "moduleResolution": "node",
-            "resolveJsonModule": true,
-            "isolatedModules": true,
-            "noEmit": true,
-         },
-         "include": ["src"]
-      }
-      // config for react 
-      if (template.includes("react")) {
-         config.compilerOptions["jsx"] = "react-jsx"
-         config.compilerOptions["jsxImportSource"] = "react"
-      }
-      fs.writeFileSync(path.join(projectDir, "tsconfig.json"), JSON.stringify(config, null, 2), "utf-8")
-   }
-
-   // generate .gitignore
-   fs.writeFileSync(path.join(projectDir, ".gitignore"), "node_modules\n", "utf-8")
-
-   loader.stop("")
-
-   loader = logLoader("Installing dependencies...")
-   execSync("npm install", {
-      cwd: projectDir,
-   })
-
-   loader.stop("Project setup complete!")
-
-   console.log(`
-
-  To start working with your project:
-  1. Navigate to your project directory:
-     cd ${projectDirName}
-  
-  2. Run the development server:
-     makepack serve
-
-  Enjoy your new project! 😊`);
-
-}
-
-export default create

package/test/browser.js

@@ -1,5 +0,0 @@
-alert()
-
-export default () => {
-   return "Hello World"
-}

package/test/client.tsx

@@ -1,10 +0,0 @@
-import ReactDOM from 'react-dom/client'
-import React from 'react'
-import calc from '.'
-const OSMain = () => {
-   return (
-      <div>{calc(2, 2)}</div>
-   )
-}
-
-ReactDOM.createRoot(document.getElementById('root') as any).render(<OSMain />)

package/test/index.ts

@@ -1,8 +0,0 @@
-
-export type Calc = (a: number, b: number) => number;
-
-const calc = (a: number, b: number) => {
-   return a + b;
-}
-
-export default calc;

package/tsconfig.json

@@ -1,29 +0,0 @@
-{
-  "compilerOptions": {
-    "declaration": true,
-    "emitDeclarationOnly": true,
-    "jsx": "react",
-    "module": "esnext",
-    "lib": [
-      "dom",
-      "esnext"
-    ],
-    "target": "ESNext",
-    "importHelpers": true,
-    "sourceMap": true,
-    "strict": true,
-    "noFallthroughCasesInSwitch": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "moduleResolution": "node",
-    "esModuleInterop": true,
-    "skipLibCheck": true,
-    "forceConsistentCasingInFileNames": true,
-  },
-  "include": [
-    "test/**/*"
-  ],
-  "exclude": [
-    "node_modules"
-  ]
-}