Skip to content

Commit 265a993

Browse files
amoskyaloamoskyalo
authored
Merge pull request #34 from amoskyalo/cra_config
Feat: Added CRA template
2 parents eeb4df9 + 202dfcd commit 265a993

File tree

10 files changed

+60
-269
lines changed

10 files changed

+60
-269
lines changed

‎commands/installComponent.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
const { input } = require('@inquirer/prompts');
2-
const path = require('path');
3-
const fs = require('fs-extra');
42
const { logger } = require('../utils/logger');
53
const { componentChoices } = require('../utils/constants');
4+
const path = require('path');
5+
const fs = require('fs-extra');
66
const ComponentGenerator = require('../utils/singleComponentTemplate');
77

88
async function installComponent(componentName) {

‎commands/projectInit.js

Lines changed: 24 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -1,87 +1,48 @@
1-
const { spawn } = require('child_process');
1+
const { exec } = require('child_process');
22
const { checkbox } = require('@inquirer/prompts');
33
const { componentChoices } = require('../utils/constants')
4-
const { logger } = require('../utils/logger');
5-
const { getPackageManager } = require('../utils/getPackageManager');
6-
const runInstall = require('../utils/runInstall');
4+
const chalk = require('chalk');
75
const ComponentGenerator = require('../utils/getComponentTemplate');
86

9-
//OBJECTIVES.
10-
// 1. Check if node is present;
11-
// 2. Check the node version if its present and if its unrecommended version show warning;
12-
// 3. Run create react app;
13-
// 4. Install material UI, and material UI icons;
14-
// 5. Create components folder and install all components;
15-
16-
async function projectInit(appName, installAll, architecture) {
17-
// exec('node -v', (error, stdout, stderr) => {
18-
// if (error) {
19-
// console.log(error);
20-
// }
21-
22-
// if (stderr) {
23-
// console.error();
24-
// }
25-
26-
// // const v = stdout.toString();
27-
// // const x = parseInt(v.slice(v.indexOf(1)));
28-
29-
// // if(x < 16){
30-
// // console.log(chalk.yellow(''))
31-
// // }
32-
33-
// exec('npx create-react-app my-react-app', (error, stdout, stderr) => {
34-
// if(error){
35-
// console.log(error)
36-
// }
37-
38-
// if(stderr){
39-
// console.log(stderr)
40-
// }
41-
42-
// console.log(stdout)
43-
// })
44-
// });
45-
46-
function getCommand() {
47-
switch (architecture) {
48-
case 'mono-repo': return { command: "yarn", args: ["create", "react-app", appName] };
49-
default: return { command: "npx", args: ["create-react-app", appName] }
7+
async function projectInit(projectName, installAll, architecture, tool, monorepoName) {
8+
function getTemplateUrl() {
9+
switch (tool) {
10+
case 'cra': return "https://github.com/amoskyalo/mui-cra-template";
11+
case 'vite': return "https://github.com/amoskyalo/vite-template"
12+
default: return null;
5013
}
5114
}
5215

53-
const { command, args } = getCommand();
54-
55-
logger.success("\nSetting up react project...")
56-
57-
const child = spawn("npx", ["create-react-app", appName], { shell: true, stdio: 'inherit' });
16+
console.log(chalk.green("info"), "Applying the following file system updates:");
17+
console.log(chalk.green("CREATE"), `${projectName} at`, chalk.green(`${process.cwd()}`));
5818

59-
child.on("error", error => {
60-
throw new Error(error);
61-
});
19+
exec(`git clone ${getTemplateUrl()} ${projectName}`, (error) => {
20+
if (error) {
21+
throw new Error(error);
22+
}
6223

63-
child.on('close', () => {
64-
console.log("\n");
24+
console.log(chalk.green("info"), "Done!");
6525

6626
try {
67-
process.chdir(appName);
27+
process.chdir(projectName);
6828

69-
runInstall(getPackageManager(), async () => {
70-
const answers = installAll ?
29+
(async () => {
30+
const components = installAll ?
7131
componentChoices.map(c => c.value) :
7232
await checkbox({
7333
message: "Which components would you like to install to your project?",
74-
choices: componentChoices
34+
choices: componentChoices,
35+
required: true,
36+
pageSize: 10
7537
});
7638

77-
new ComponentGenerator(answers, appName, architecture).generateComponent();
78-
});
39+
new ComponentGenerator(components, projectName, architecture, tool, monorepoName).generateComponent();
40+
})()
7941

8042
} catch (error) {
8143
throw new Error(error);
8244
}
83-
});
84-
45+
})
8546
}
8647

8748
module.exports = projectInit;

‎commands/themeInit.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
const path = require("path");
2-
const createTheme = require("../templates/theme");
2+
const createTheme = require("../components/theme");
33
const fs = require('fs');
44
const { logger } = require('../utils/logger')
55
const { defaultColors } = require('../utils/constants');

‎components/Landing/ReactCSSContents.js

Lines changed: 0 additions & 25 deletions
This file was deleted.

‎components/Landing/ReactJsContents.js

Lines changed: 0 additions & 104 deletions
This file was deleted.

‎components/theme.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,6 @@ const themeConfig = (mode= 'dark') => (
4545
},
4646
},
4747
typography: {
48-
fontFamily: [].join(','),
4948
fontSize: 16,
5049
h4: {
5150
fontWeight: 700

‎index.js

Lines changed: 12 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@
22

33
const { exec } = require('child_process')
44
const { program } = require('commander');
5-
const { getPackageManager } = require('./utils/getPackageManager');
65
const { logger } = require('./utils/logger');
76
const { select, confirm, input } = require('@inquirer/prompts');
87
const CLI = require('clui');
@@ -20,7 +19,6 @@ const lerna_spinner = new Spinner('Installing lerna... ', ['⣾', '⣽', '⣻',
2019

2120
program.version("0.0.1").description("Material UI CLI");
2221

23-
// generate theme template
2422
program
2523
.command("theme-init")
2624
.description("Initialize theme")
@@ -32,7 +30,6 @@ program
3230
.option("-x, --success [string], success color option")
3331
.action(options => validateMUI(() => themeInit(options)));
3432

35-
//validate theme;
3633
program
3734
.command("theme-validate")
3835
.description("Validate theme")
@@ -45,25 +42,17 @@ program
4542
.option('--ignore-warn [string], ignore warning in theme')
4643
.action(options => validateMUI(() => validateTheme(options)));
4744

48-
// install single component to existing project.
4945
program.command('install <componentName>')
5046
.description('Install a Material-UI component')
5147
.action((componentName) => {
5248
validateMUI(() => installComponent(componentName));
5349
});
5450

55-
// initialize new project.
5651
program.command('project-init')
5752
.option('-a, --all, Install all components')
5853
.description("Initialize a new project")
5954
.action(async (options) => {
60-
const appName = process.argv[3];
61-
62-
if (!appName) {
63-
logger.error("Project name must be provided");
64-
65-
process.exit(1);
66-
}
55+
const projectName = await input({ message: "Project name:", default: "mui-project" });
6756

6857
const tool = await select({
6958
message: "Choose your preferred tool for your project:",
@@ -72,7 +61,7 @@ program.command('project-init')
7261
{ name: "Vite", value: "vite" },
7362
{ name: "Next.js", value: "next.js" }
7463
]
75-
});
64+
});
7665

7766
const architecture = await select({
7867
message: "Choose your preferred project architecture:",
@@ -85,10 +74,15 @@ program.command('project-init')
8574
if (architecture === "mono-repo") {
8675
logger.info(boxen(`Since you've chosen a monorepo setup, we'll use Lerna to manage our packages. Lerna is ideal for monorepo management, simplifying tasks like versioning and publishing. Check out the docs: https://lerna.js.org/docs/getting-started`, { padding: 1 }))
8776

88-
const monorepoName = await input({ message: "Enter your monorepo app name" });
77+
const monorepoName = await input({ message: "Enter your monorepo app name", default: "mui-apps" });
8978

9079
const useWorkspaces = await confirm({ message: "Would you like to integrate Yarn Workspaces with Lerna for better dependency management?" });
9180

81+
function runMonorepo() {
82+
return monorepoInit(monorepoName, () => projectInit(projectName, options.all || false, architecture, tool, monorepoName));
83+
}
84+
85+
9286
if (useWorkspaces) {
9387
exec("lerna --version", async (error) => {
9488
if (error && error.message.includes("'lerna' is not recognized")) {
@@ -106,19 +100,15 @@ program.command('project-init')
106100

107101
lerna_spinner.stop();
108102

109-
monorepoInit(
110-
monorepoName,
111-
() => projectInit(appName, options.all || false, architecture)
112-
);
103+
runMonorepo();
113104
})
114105
}
115-
} else {
116-
monorepoInit(monorepoName, () => projectInit(appName, options.all || false, architecture));
117-
}
106+
107+
} else runMonorepo();
118108
})
119109
}
120110
} else {
121-
projectInit(appName, options.all || false, architecture);
111+
projectInit(projectName, options.all || false, architecture, tool);
122112
}
123113
});
124114

‎templates/mui-cra-template

‎templates/vite-js

0 commit comments

Comments
 (0)