quick-scaffolds-cli 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +94 -0
- package/bin/cli.js +42 -0
- package/package.json +15 -0
- package/templates/css/style.css +0 -0
- package/templates/index.html +12 -0
- package/templates/js/app.js +0 -0
package/README.md
ADDED
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
# quick-scaffolds
|
|
2
|
+
|
|
3
|
+
A lightweight CLI tool for quickly scaffolding web projects with pre-configured templates.
|
|
4
|
+
|
|
5
|
+
## Overview
|
|
6
|
+
|
|
7
|
+
`quick-scaffolds` is an npm package that provides an interactive command-line interface to generate new projects with starter templates. It's designed to help developers quickly bootstrap projects without manually creating directory structures and boilerplate files.
|
|
8
|
+
|
|
9
|
+
## Installation
|
|
10
|
+
|
|
11
|
+
Install globally to use the `create-project` command anywhere:
|
|
12
|
+
|
|
13
|
+
```bash
|
|
14
|
+
npm install -g quick-scaffolds
|
|
15
|
+
```
|
|
16
|
+
|
|
17
|
+
Or use `npx` to run without installing:
|
|
18
|
+
|
|
19
|
+
```bash
|
|
20
|
+
npx quick-scaffolds
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
## Usage
|
|
24
|
+
|
|
25
|
+
### Create a New Project
|
|
26
|
+
|
|
27
|
+
Run the following command in your terminal:
|
|
28
|
+
|
|
29
|
+
```bash
|
|
30
|
+
create-project
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
The interactive prompt will guide you through the setup:
|
|
34
|
+
|
|
35
|
+
1. **Project Name**: Enter the name of your project (default: `my-new-project`)
|
|
36
|
+
2. **Project Type**: Select the type of project to scaffold (currently: `Static HTML/CSS/JS`)
|
|
37
|
+
|
|
38
|
+
The CLI will create a new directory with your project name and populate it with the selected template files.
|
|
39
|
+
|
|
40
|
+
### Example
|
|
41
|
+
|
|
42
|
+
```bash
|
|
43
|
+
$ create-project
|
|
44
|
+
? What is your project name? my-awesome-website
|
|
45
|
+
? What do you want to build? Static HTML/CSS/JS
|
|
46
|
+
Successfully scaffolded - my-awesome-website
|
|
47
|
+
```
|
|
48
|
+
|
|
49
|
+
This creates a `my-awesome-website` directory with the following structure:
|
|
50
|
+
|
|
51
|
+
```
|
|
52
|
+
my-awesome-website/
|
|
53
|
+
├── index.html
|
|
54
|
+
├── css/
|
|
55
|
+
│ └── style.css
|
|
56
|
+
└── js/
|
|
57
|
+
└── app.js
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
## Features
|
|
61
|
+
|
|
62
|
+
- 🚀 **Interactive CLI**: User-friendly command-line prompts using [inquirer.js](https://github.com/SBoudrias/Inquirer.js)
|
|
63
|
+
- 📁 **Template Management**: Pre-built project templates ready to use
|
|
64
|
+
- 🛠️ **Easy Setup**: Bootstrap new projects in seconds
|
|
65
|
+
- 📦 **Lightweight**: Minimal dependencies for fast installation
|
|
66
|
+
- 🎯 **Extensible**: Easy to add new project templates
|
|
67
|
+
|
|
68
|
+
## Project Structure
|
|
69
|
+
|
|
70
|
+
```
|
|
71
|
+
quick-scaffolds/
|
|
72
|
+
├── bin/
|
|
73
|
+
│ └── cli.js # CLI entry point
|
|
74
|
+
├── templates/ # Project templates
|
|
75
|
+
│ ├── index.html
|
|
76
|
+
│ ├── css/
|
|
77
|
+
│ │ └── style.css
|
|
78
|
+
│ └── js/
|
|
79
|
+
│ └── app.js
|
|
80
|
+
├── package.json
|
|
81
|
+
└── README.md
|
|
82
|
+
```
|
|
83
|
+
|
|
84
|
+
## Dependencies
|
|
85
|
+
|
|
86
|
+
- `inquirer` (v13.3.2) - Interactive command-line prompts
|
|
87
|
+
|
|
88
|
+
## License
|
|
89
|
+
|
|
90
|
+
MIT
|
|
91
|
+
|
|
92
|
+
## Contributing
|
|
93
|
+
|
|
94
|
+
Contributions are welcome! Feel free to fork, create a feature branch, and submit a pull request.
|
package/bin/cli.js
ADDED
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
|
|
3
|
+
import fs from 'node:fs/promises';
|
|
4
|
+
import path from 'node:path';
|
|
5
|
+
import { fileURLToPath } from 'node:url';
|
|
6
|
+
import inquirer from 'inquirer';
|
|
7
|
+
|
|
8
|
+
const __filename = fileURLToPath(import.meta.url);
|
|
9
|
+
const __dirname = path.dirname(__filename);
|
|
10
|
+
|
|
11
|
+
async function main() {
|
|
12
|
+
const answers = await inquirer.prompt([
|
|
13
|
+
{
|
|
14
|
+
type: 'input',
|
|
15
|
+
name: 'projectName',
|
|
16
|
+
message: 'What is your project name?',
|
|
17
|
+
default: 'my-new-project'
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
type: 'list',
|
|
21
|
+
name: 'projectType',
|
|
22
|
+
message: 'What do you want to build?',
|
|
23
|
+
default: 'Static HTML/CSS/JS Page',
|
|
24
|
+
choices: ['Static HTML/CSS/JS'
|
|
25
|
+
],
|
|
26
|
+
},
|
|
27
|
+
]);
|
|
28
|
+
|
|
29
|
+
const projectName = answers.projectName;
|
|
30
|
+
const targetPath = path.join(process.cwd(), projectName);
|
|
31
|
+
const templatePath = path.join(__dirname, '../templates');
|
|
32
|
+
|
|
33
|
+
try {
|
|
34
|
+
await fs.mkdir(targetPath, { recursive: true });
|
|
35
|
+
await fs.cp(templatePath, targetPath, { recursive: true });
|
|
36
|
+
console.log('Successfully scaffolded the project')
|
|
37
|
+
} catch (err) {
|
|
38
|
+
console.error('Error - ${err.message}')
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
main();
|
package/package.json
ADDED
|
File without changes
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>My web site</title>
|
|
7
|
+
<link rel="stylesheet" href="./css/style.css">
|
|
8
|
+
</head>
|
|
9
|
+
<body>
|
|
10
|
+
<script src="./js/app.js"></script>
|
|
11
|
+
</body>
|
|
12
|
+
</html>
|
|
File without changes
|