0
# Templates and Resources
1

2
Template processing and resource file management for project scaffolding, including support for custom templates, starter configurations, and comprehensive file generation for both TypeScript and JavaScript projects.
3

4
## Capabilities
5

6
### Template Configuration Interface
7

8
Configuration structure for custom templates and starters.
9

10
```typescript { .api }
11
/**
12
 * Template configuration structure
13
 */
14
interface TemplateConfig {
15
  /** Package configuration overrides and additions */
16
  package: Record<string, unknown>;
17
}
18

19
/**
20
 * Package metadata information
21
 */
22
interface PackageInfo {
23
  /** Package name */
24
  name: string;
25
  /** Package version */
26
  version: string;
27
}
28
```
29

30
### Template Merging
31

32
Core template merging functionality for integrating custom templates with generated projects.
33

34
```typescript { .api }
35
/**
36
 * Merges custom template with generated project
37
 * Downloads and integrates template files, configurations, and dependencies
38
 * @param scope - Project configuration scope containing template URL/name
39
 * @param rootPath - Target project directory path
40
 * @throws Error if template installation fails
41
 */
42
function mergeTemplate(scope: Scope, rootPath: string): Promise<void>;
43
```
44

45
**Supported Template Sources:**
46
- GitHub repositories (public and private with authentication)
47
- npm packages containing Strapi templates
48
- Local file system paths
49
- Tarball URLs
50

51
**Template Integration Features:**
52
- Automatic dependency merging
53
- Configuration file overrides
54
- Asset and resource copying
55
- Template-specific setup scripts
56

57
### NPM Template Fetching
58

59
Utility for downloading and processing npm-based templates.
60

61
```typescript { .api }
62
/**
63
 * Fetches template from npm registry or URL
64
 * @param templateName - npm package name or URL
65
 * @param destination - Local directory to extract template
66
 * @returns Template metadata and configuration
67
 */
68
function fetchNpmTemplate(
69
  templateName: string,
70
  destination: string
71
): Promise<TemplateConfig>;
72
```
73

74
## Resource Templates
75

76
### Package.json Generation
77

78
Dynamic package.json generation with dependency management and project metadata.
79

80
```typescript { .api }
81
/**
82
 * Generates package.json content for new Strapi project
83
 * @param options - Package generation options
84
 * @returns Complete package.json object
85
 */
86
function generatePackageJson(options: {
87
  /** Core Strapi dependencies to include */
88
  strapiDependencies: string[];
89
  /** Additional dependencies (React, etc.) */
90
  additionalsDependencies: Record<string, string>;
91
  /** Strapi version for dependency versions */
92
  strapiVersion: string;
93
  /** Project name (kebab-case) */
94
  projectName: string;
95
  /** Unique project identifier */
96
  uuid: string;
97
  /** Strapi-specific package.json configuration */
98
  packageJsonStrapi: Record<string, unknown>;
99
}): Record<string, unknown>;
100
```
101

102
**Generated Package.json Features:**
103
- Automatic script configuration (develop, start, build, deploy)
104
- Engine requirements (Node.js, npm versions)
105
- Strapi-specific metadata
106
- Development and production dependencies
107
- License and repository information
108

109
### TypeScript Configuration Templates
110

111
Configuration file generators for TypeScript projects.
112

113
```typescript { .api }
114
/**
115
 * Generates tsconfig.json for admin panel
116
 * @returns TypeScript configuration object for admin
117
 */
118
function generateAdminTsConfig(): Record<string, unknown>;
119

120
/**
121
 * Generates tsconfig.json for server-side code
122
 * @returns TypeScript configuration object for server
123
 */
124
function generateServerTsConfig(): Record<string, unknown>;
125
```
126

127
**TypeScript Configuration Features:**
128
- Optimized compiler options for Strapi development
129
- Path mapping for module resolution
130
- Strict type checking configuration
131
- Build output configuration
132
- Source map generation setup
133

134
### JavaScript Configuration Templates
135

136
Configuration file generators for JavaScript projects.
137

138
```typescript { .api }
139
/**
140
 * Generates jsconfig.json for JavaScript projects
141
 * @returns JavaScript project configuration object
142
 */
143
function generateJsConfig(): Record<string, unknown>;
144
```
145

146
### Environment Configuration
147

148
Environment file and configuration generation.
149

150
```typescript { .api }
151
/**
152
 * Creates .env file content with default environment variables
153
 * @returns Environment file content as string
154
 */
155
function createEnvFile(): string;
156
```
157

158
**Generated Environment Variables:**
159
```bash
160
# Server
161
HOST=0.0.0.0
162
PORT=1337
163

164
# Secrets
165
APP_KEYS=generated-keys
166
API_TOKEN_SALT=generated-salt
167
ADMIN_JWT_SECRET=generated-secret
168
TRANSFER_TOKEN_SALT=generated-salt
169

170
# Security
171
JWT_SECRET=generated-secret
172
```
173

174
## File Templates and Resources
175

176
### TypeScript Project Templates
177

178
Complete file templates for TypeScript Strapi projects.
179

180
**Configuration Files:**
181
- `config/admin.ts` - Admin panel configuration
182
- `config/api.ts` - API configuration  
183
- `config/middlewares.ts` - Middleware configuration
184
- `config/plugins.ts` - Plugin configuration
185
- `config/server.ts` - Server configuration
186

187
**Application Files:**
188
- `src/index.ts` - Main application entry point
189
- `src/admin/webpack.config.example.js` - Webpack configuration example
190

191
### JavaScript Project Templates
192

193
Complete file templates for JavaScript Strapi projects.
194

195
**Configuration Files:**
196
- `config/admin.js` - Admin panel configuration
197
- `config/api.js` - API configuration
198
- `config/middlewares.js` - Middleware configuration  
199
- `config/plugins.js` - Plugin configuration
200
- `config/server.js` - Server configuration
201

202
**Application Files:**
203
- `src/index.js` - Main application entry point
204
- `src/admin/webpack.config.example.js` - Webpack configuration example
205

206
### Dot Files and Configuration
207

208
Project configuration and tooling files.
209

210
**Common Dot Files:**
211
- `.gitignore` - Git ignore patterns
212
- `.env.example` - Environment variable template
213
- `.editorconfig` - Editor configuration
214
- `.eslintrc.js` - ESLint configuration
215
- `.prettierrc` - Prettier configuration
216

217
**JavaScript-Specific:**
218
- Additional JavaScript tooling configuration
219
- JSDoc configuration
220
- Babel configuration (if applicable)
221

222
## Template Processing Workflow
223

224
### Template Resolution
225

226
```typescript
227
// Template source resolution
228
if (scope.template.startsWith('http')) {
229
  // URL-based template (GitHub, tarball, etc.)
230
  await downloadTemplate(scope.template, tempPath);
231
} else if (scope.template.includes('/')) {
232
  // npm scoped package
233
  await fetchNpmTemplate(scope.template, tempPath);
234
} else {
235
  // Simple npm package name
236
  await fetchNpmTemplate(scope.template, tempPath);
237
}
238
```
239

240
### File Copying Strategy
241

242
```typescript
243
// Language-specific file copying
244
const language = scope.useTypescript ? 'ts' : 'js';
245

246
// Copy base template files
247
await fse.copy(
248
  join(resourcesPath, 'files', language),
249
  scope.rootPath
250
);
251

252
// Copy common dot files
253
await copyDotFiles('common');
254

255
// Copy language-specific dot files
256
if (!scope.useTypescript) {
257
  await copyDotFiles('js');
258
}
259
```
260

261
### Template Integration
262

263
```typescript
264
// Merge template configuration
265
if (scope.template) {
266
  const templateConfig = await mergeTemplate(scope, scope.rootPath);
267
  
268
  // Merge dependencies
269
  Object.assign(configuration.dependencies, templateConfig.package.dependencies);
270
  
271
  // Apply configuration overrides
272
  applyTemplateOverrides(scope, templateConfig);
273
}
274
```
275

276
## Usage Examples
277

278
### Custom GitHub Template
279

280
```typescript
281
import { generateNewApp } from "@strapi/generate-new";
282

283
await generateNewApp("./my-app", {
284
  template: "https://github.com/strapi/strapi-template-blog",
285
  typescript: true
286
});
287
```
288

289
### NPM Template Package
290

291
```typescript
292
await generateNewApp("./my-app", {
293
  template: "@strapi/template-corporate",
294
  starter: "blog"
295
});
296
```
297

298
### Template with Custom Configuration
299

300
```typescript
301
await generateNewApp("./my-app", {
302
  template: "https://github.com/user/custom-strapi-template",
303
  typescript: true,
304
  dbclient: "postgres",
305
  dbhost: "localhost"
306
});
307
```