add ViteService for React tasks

mate-scripts/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mate-academy/scripts",
-  "version": "1.8.1",
+  "version": "1.8.2",
   "description": "Scripts to init, run, test, deploy Mate academy homework projects",
   "main": "bin/mateScripts.js",
   "scripts": {

mate-scripts/src/commands/Build.command.ts

@@ -3,6 +3,8 @@ import fs from 'fs-extra';
 import { DESTINATION_DIR } from '../constants';
 import { ParcelService, ReactScriptsService } from '../services';
 import { Command } from './Command';
+import { NodeJsVersions } from '../typedefs';
+import { ViteService } from '../services/Vite.service';
 
 export interface BuildOptions {
   shouldShowInternalLogs: boolean;
@@ -11,7 +13,10 @@ export interface BuildOptions {
 export class BuildCommand extends Command {
   private readonly parcel = new ParcelService(this.rootDir);
 
-  private reactScripts = new ReactScriptsService(this.rootDir);
+  private readonly reactScripts =
+    this.config.nodejsMajorVersion === NodeJsVersions.v20
+      ? new ViteService(this.rootDir)
+      : new ReactScriptsService(this.rootDir);
 
   protected common(): void {
     // do nothing

mate-scripts/src/commands/Start.command.ts

@@ -1,6 +1,8 @@
 import { JestService, ParcelService, ReactScriptsService } from '../services';
 import { Command } from './Command';
 import { ExecResult } from '../tools';
+import { NodeJsVersions } from '../typedefs';
+import { ViteService } from '../services/Vite.service';
 
 export interface StartOptions {
   shouldShowInternalLogs: boolean;
@@ -13,7 +15,10 @@ export class StartCommand extends Command {
 
   private readonly jest = new JestService();
 
-  private readonly reactScripts = new ReactScriptsService(this.rootDir);
+  private readonly reactScripts =
+    this.config.nodejsMajorVersion === NodeJsVersions.v20
+      ? new ViteService(this.rootDir)
+      : new ReactScriptsService(this.rootDir);
 
   protected common(): void {
     // do nothing

mate-scripts/src/services/Vite.service.ts

@@ -0,0 +1,61 @@
+import path from 'path';
+import {
+  execBashCodeControlled, execBashCodeSync, ExecResult,
+} from '../tools';
+
+interface StartOptions {
+  port?: number;
+  open?: boolean;
+  showLogs?: boolean;
+}
+
+export class ViteService {
+  private readonly binDir = path.join(this.rootDir, 'node_modules/.bin/');
+
+  constructor(private readonly rootDir: string) {
+  }
+
+  start<Async extends boolean, Result = ExecResult<Async>>(
+    options: StartOptions = {},
+    async: Async = false as Async,
+  ): Result {
+    const {
+      port,
+      open = true,
+      showLogs = false,
+    } = options;
+
+    const execFn = async
+      ? execBashCodeControlled
+      : execBashCodeSync;
+
+    const PORT = port
+      ? ` --port=${port}`
+      : '';
+
+    const OPEN = open
+      ? ' --open'
+      : '';
+
+    return execFn(
+      `${this.binDir}vite dev${PORT}${OPEN}`,
+      showLogs,
+    ) as any;
+  }
+
+  build(
+    buildPath?: string,
+    showLogs = true,
+  ) {
+    const BUILD_PATH = buildPath
+      ? ` --out-dir ${buildPath}`
+      : '';
+    const command = `cross-env ${this.binDir}vite build${BUILD_PATH}`;
+
+    if (showLogs) {
+      console.log(`Execute command: ${command}`);
+    }
+
+    return execBashCodeSync(command);
+  }
+}

mate-scripts/src/tools/getDefaultConfig.ts

@@ -1,12 +1,13 @@
 import { defaultLintersConfig, defaultTestsConfig } from '../constants';
 import {
-  Config, Linters, ProjectTypes, Tests,
+  Config, Linters, NodeJsVersions, ProjectTypes, Tests,
 } from '../typedefs';
 
 export const getDefaultConfig = (
   projectType = ProjectTypes.None,
 ): Config => ({
   projectType,
+  nodejsMajorVersion: NodeJsVersions.v14,
   linters: {
     ...getDefaultLintersConfig(projectType),
   },

mate-scripts/src/typedefs.ts

@@ -9,6 +9,11 @@ export enum ProjectTypes {
   NodeJs = 'nodeJs',
 }
 
+export enum NodeJsVersions {
+  v14 = '14',
+  v20 = '20',
+}
+
 export interface Linters {
   html: boolean;
   bem: boolean;
@@ -27,6 +32,7 @@ export interface Tests {
 
 export interface Config {
   projectType: ProjectTypes;
+  nodejsMajorVersion: NodeJsVersions;
   linters: Linters;
   tests: Tests;
 }