sinto 1.6.1 → 1.8.0

package/README.md

@@ -61,6 +61,7 @@ This command is generate public directory from src directory.
 * sin rmno - Delete node_modules directory
 * sin ts - Generate tsconfig.json and add dependencies
 * sin web - Generate HTML and empty CSS files
+* sin esbuild - Generate esbuild project
 
 The Default task manager is gulp. Development serve is browser-sync.
 
@@ -156,16 +157,89 @@ Write the tests in test directory and run the tests:
 npm test
 ```
 
-## TypeScript config and dependencies
+## TypeScript
 
-The **sin ts** command generate a tsconfig.json and add dependencies to package.json.
+### TypeScript config and dependencies
 
-The **sin ts** command does not install the dependencies, it just writes them into the package.json file. Install the dependencies with the **npm i** or **pnpm i** command.
+The **sin addts** command generate a tsconfig.json and add dependencies to package.json.
+
+The **sin addts** command does not install the dependencies, it just writes them into the package.json file. Install the dependencies with the **npm i** or **pnpm i** command.
 
 Using:
 
 ```cmd
 sin init
+sin addts
+npm i
+```
+
+### TypeScript Node.js project
+
+The **sin ts** command generate a TypeScript Node.js project.
+
+Using:
+
+```cmd
 sin ts
 npm i
 ```
+
+Generated directories and files:
+
+```txt
+app01/
+  |-src/
+  |  |-assets/
+  |  |-app.ts
+  |  |-index.html
+  |  `-style.css
+  |-bs-config.json
+  |-gulpfile.js  
+  |-package.json
+  |-README.md
+  `-tsconfig.json  
+```
+
+## ESBuild project generator
+
+The sin esbuild command generate a esbuild project.
+
+Using:
+
+```cmd
+sin esbuild
+pnpm i
+pnpm dev
+pnpm start
+```
+
+Generated directories and files:
+
+```txt
+app01/
+  |-public/
+  |  |-index.html
+  |  `-style.css
+  |-src/
+  |  `-index.js
+  |-package.json
+  `-README.md
+```
+
+Update the src/app.ts your index file.
+
+Example:
+
+* src/app.ts
+* src/index.ts
+* src/app.js
+* src/index.js
+* src/script.js
+
+To build production run next command:
+
+```cmd
+pnpm build
+```
+
+This command is generate dist directory from src directory. The build command not copy the public directory.

package/addts/addts.js

@@ -0,0 +1,43 @@
+const tsconfigContent = require('./tsconfigContent.js');
+const { createFile } = require('../tools/tools.js');
+const jsonfile = require('jsonfile');
+const { addDevDep } = require('../tools/dep.js');
+
+const fs = require('fs');
+
+const supplementTypescript = () => {
+    writeConfigFile();
+    showMsg();
+    addDependencies();
+}
+
+const writeConfigFile = () => {
+    const dir = process.cwd();
+    const path = `${dir}/tsconfig.json`;
+    jsonfile.writeFileSync(path, tsconfigContent, { spaces: 2 });
+}
+
+const showMsg = () => {
+    console.log(`
+Install dependencies with npm or pnpm command:
+
+pnpm install
+        `);
+}
+
+const addDependencies = () => {
+
+    const dir = process.cwd();
+    const path = `${dir}/package.json`;
+
+    if (!fs.existsSync(path)) {
+        console.log('package.json file does not exist.');
+        return;
+    }
+    
+
+
+    addDevDep(path, ['typescript']);
+}
+
+module.exports.supplementTypescript = supplementTypescript;

package/addts/tsconfigContent.js

@@ -0,0 +1,13 @@
+
+const tsconfigContent = 
+{
+    "compilerOptions": {
+        "target": "ES6",
+        "module": "ES6",
+        "outDir": "./app",
+        "strict": true,
+        "esModuleInterop": true
+    }
+}
+
+module.exports = tsconfigContent;

package/esbuild/contents/esbuildPackage.json

@@ -0,0 +1,19 @@
+{
+  "name": "sinto-project",
+  "version": "0.0.1",
+  "description": "A project created by the Sinto command",
+  "scripts": {
+  "test": "echo \"Error: no test specified\" && exit 1",
+  "start": "browser-sync start --config bs-config.json",
+  "dev": "npx esbuild src/app.ts --outdir=public --bundle --watch",
+  "build": "npx esbuild src/app.ts --outdir=dist --bundle --minify"
+  },
+  "dependencies": {
+    "bootstrap": "^5.3.3"
+  },
+  "devDependencies": {
+    "esbuild": "^0.23.1",
+    "browser-sync": "^3.0.2"
+  }
+}
+  

package/esbuild/contents/indexHtml.js

@@ -0,0 +1,18 @@
+
+module.exports = `
+<!DOCTYPE html>
+<html lang="hu">
+  <head>
+    <meta charset="UTF-8">
+    <title>Sinto esbuild</title>
+  </head>
+  <body>
+    <div class="container">
+        <h1>Sinto</h1>
+        <p>The website generated by Sinto.</p>      
+
+    </div>
+    <script src="app.js"></script>
+  </body>
+</html>
+`

package/esbuild/generate.js

@@ -0,0 +1,47 @@
+const { debug } = require('../config.json')
+const { createFile, createDirectory } = require('../tools/tools.js');
+const jsonfile = require('jsonfile');
+
+const swcPackageContent = require('./contents/esbuildPackage.json');
+const indexHtmlContent = require('./contents/indexHtml.js');
+const defaultBsconfigContent = require('./generators/genBsconfig.js');
+
+const createEsbuildProject = () => {
+    const dir = process.cwd();
+
+    createDirectory(`${dir}/src`);
+    createDirectory(`${dir}/public`);
+    createDirectory(`${dir}/public/assets`);
+  
+    createFile(`${dir}/public/index.html`, indexHtmlContent);  
+    createFile(`${dir}/public/style.css`, '');  
+    createFile(`${dir}/src/app.ts`, '');
+
+    createFile(`${dir}/README.md`, '# Sinto ESBuild client\n');
+    
+    createPackageJsonFile(dir);
+    createBsconfigFile(dir);
+  
+    console.log('ESBuild client created.');
+    console.log('Run next commands:');
+    console.log('  pnpm i');
+    console.log('  pnpm dev');
+    console.log('  pnpm start');
+}
+
+const createPackageJsonFile = (directory) => {
+    const packageJsonPath = `${directory}/package.json`;
+    jsonfile.writeFileSync(packageJsonPath, swcPackageContent, { spaces: 2 });
+    if(debug) {
+        console.log('package.json file created.');
+    }
+}
+
+const createBsconfigFile = (dir) => {
+    const bsconfigPath = `${dir}/bs-config.json`;
+    jsonfile.writeFileSync(bsconfigPath, defaultBsconfigContent, { spaces: 2 });
+    if(debug)
+    console.log('bs-config.json file created.');
+}
+
+module.exports.createEsbuildProject = createEsbuildProject;

package/esbuild/generators/genBsconfig.js

@@ -0,0 +1,13 @@
+
+const bsconfigContent = 
+{
+    server: [
+        "public",
+        "node_modules/bootstrap/dist/css",
+        "node_modules/bootstrap/dist/js"
+    ],
+    port: 3000,
+    watch: true
+};
+
+module.exports = bsconfigContent;

package/gents/generators/genTsGulpfile.js

@@ -0,0 +1,45 @@
+
+const tsGulfileContent = `
+import {src, dest, parallel} from 'gulp';
+import cleanCss from 'gulp-clean-css';
+import replace from 'gulp-replace';
+import concat from 'gulp-concat'
+import ts from 'gulp-typescript';
+import uglify from 'gulp-uglify';
+
+import {create as bsCreate} from 'browser-sync';
+const browserSync = bsCreate();
+ 
+function genHTML(cb) {
+    src('src/**/*.html')
+    .pipe(dest('public'))
+    cb();
+}
+
+
+function streamTs(cb) {
+  src('src/**/*.ts')
+    .pipe(ts())
+    .pipe(uglify())
+    .pipe(dest('public'));
+  cb();
+}
+
+function minifyCSS(cb) {
+  src([
+    'src/**/*.css', 
+    'node_modules/bootstrap/dist/css/bootstrap.css'])
+    .pipe(cleanCss())
+    .pipe(dest('public'));
+  cb();
+}
+
+function build(cb) {
+  parallel(genHTML, streamTs, minifyCSS)(cb);
+}
+
+export default build
+
+`;
+
+module.exports = tsGulfileContent;

package/gents/gents.js

@@ -1,12 +1,17 @@
-const tsconfigContent = require('./tsconfigContent');
+const {debug} = require('../config.json');
+const tsconfigContent = require('./tsconfigContent.js');
 const { createFile } = require('../tools/tools.js');
 const jsonfile = require('jsonfile');
-const { addDevDep } = require('../tools/dep.js');
+const { addDevDep, addScript } = require('../tools/dep.js');
+const fs = require('fs');
+const { createWeb } = require('../genweb/genweb');
+const defaultTsPackageContent = require('./tsPackageContent.js');
 
-const supplementTypescript = () => {
-    writeConfigFile();
-    showMsg();
-    addDependencies();
+const initTypescriptProject = async () => {
+  createWeb('ts');
+  createPackageJsonFile(process.cwd());
+  writeConfigFile();
+  showMsg();
 }
 
 const writeConfigFile = () => {
@@ -16,21 +21,19 @@ const writeConfigFile = () => {
 }
 
 const showMsg = () => {
-    console.log(`
-Proposal:
-In the tsconfig.json file, leave the module value
-at commonjs for a NodeJS project. In the case of 
-an ES project, rewrite it to, for example, ES6.
+    console.log(`TypeScript project initialized.
+Install dependencies with npm or pnpm command:
 
-Install dependencies:
 pnpm install
         `);
 }
 
-const addDependencies = () => {
-    const dir = process.cwd();
-    const path = `${dir}/package.json`;
-    addDevDep(path, ['typescript']);
+const createPackageJsonFile = (dir) => {
+  const packageJsonPath = `${dir}/package.json`;
+  jsonfile.writeFileSync(packageJsonPath, defaultTsPackageContent, { spaces: 2 });
+  if(debug) {
+      console.log('package.json file created.');
+  }        
 }
 
-module.exports.supplementTypescript = supplementTypescript;
+module.exports.initTypescriptProject = initTypescriptProject;

package/gents/tsPackageContent.js

@@ -0,0 +1,27 @@
+
+const packageTsContent = 
+{
+    name: 'sinto-project',
+    version: '0.0.1',
+    description: 'A project created by the Sinto command',
+    scripts: {
+      'start': 'browser-sync start --config bs-config.json',
+      'build': 'gulp',
+      'ts': 'tsc'
+    },
+    "dependencies": {
+      "bootstrap": "^5.3.3"
+    },
+    "devDependencies": {
+      "browser-sync": "^3.0.2",
+      "gulp": "^5.0.0",
+      "gulp-clean-css": "^4.3.0",
+      "gulp-concat": "^2.6.1",
+      "gulp-uglify": "^3.0.2",
+      "gulp-replace": "^1.1.4",
+      "gulp-typescript": "6.0.0-alpha.1"
+    },
+    "type": "module"
+}
+
+module.exports = packageTsContent;

package/gents/tsconfigContent.js

@@ -3,7 +3,7 @@ const tsconfigContent =
 {
     "compilerOptions": {
         "target": "ES6",
-        "module": "commonjs",
+        "module": "ES6",
         "outDir": "./app",
         "strict": true,
         "esModuleInterop": true
@@ -11,4 +11,4 @@ const tsconfigContent =
 }
 
 
-module.exports = tsconfigContent;
+module.exports = tsconfigContent;

package/genweb/genweb.js

@@ -5,26 +5,37 @@ const fsExtra = require('fs-extra');
 const defaultPackageContent = require('../genweb/generators/genPackage');
 const defaultHtmlContent = require('../genweb/generators/genHtml');
 const defaultGulpfileContent = require('../genweb/generators/genGulpfile');
+const defaultTsGulpfileContent = require('../gents/generators/genTsGulpfile');
 const defaultBsconfigContent = require('../genweb/generators/genBsconfig');
 
+
 const {
     createDirectory, 
     createFile
   } = require('../tools/tools');
 
-const createWeb = () => {
+const createWeb = (type) => {
     const currentDirectory = process.cwd();
   
     createDirectory(`${currentDirectory}/src`);
     createDirectory(`${currentDirectory}/src/assets`);
   
-    createFile(`${currentDirectory}/src/style.css`, '');  
-    createFile(`${currentDirectory}/src/app.js`, '');
+    createFile(`${currentDirectory}/src/style.css`, '');
+
+    let content = '';
+    if(type === 'ts') {
+        createFile(`${currentDirectory}/src/app.ts`, '');
+        content = defaultTsGulpfileContent;
+    }else {
+        createFile(`${currentDirectory}/src/app.js`, '');
+        content = defaultGulpfileContent;
+    }
+
     createFile(`${currentDirectory}/README.md`, '# Sinto Project');
     
     createPackageJsonFile(currentDirectory);
     createIndexHtmlFile(currentDirectory);
-    createGulpfileJsFile(currentDirectory);
+    createGulpfileJsFile(currentDirectory, content);    
     createBsconfigFile(currentDirectory);
   
     console.log('Base directories and files created.');
@@ -45,13 +56,15 @@ const createIndexHtmlFile = (directory) => {
   console.log('index.html file created');
 }
 
-const createGulpfileJsFile = (directory) => {
+const createGulpfileJsFile = (directory, content) => {
   const gulpfileJsPath = `${directory}/gulpfile.js`;
-  fsExtra.writeFileSync(gulpfileJsPath, defaultGulpfileContent);
+  fsExtra.writeFileSync(gulpfileJsPath, content);
   if(debug)
   console.log('gulpfile.js file created.');
 }
 
+
+
 const createBsconfigFile = (directory) => {
   const bsconfigPath = `${directory}/bs-config.json`;
   jsonfile.writeFileSync(bsconfigPath, defaultBsconfigContent, { spaces: 2 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sinto",
-  "version": "1.6.1",
+  "version": "1.8.0",
   "description": "Website project development manager",
   "bin": {
     "sin": "sin.js"

package/sin.js

@@ -7,8 +7,10 @@ const { build } = require('./build/build');
 const { rmno } = require('./rmno/rmno');
 const { createApi } = require('./haiserver/apigen');
 const { createWebpack } = require('./webpack/generate');
+const { createEsbuildProject } = require('./esbuild/generate');
 const { createPuppeteerTest } = require('./gentest/generate');
-const { supplementTypescript } = require('./gents/gents');
+const { supplementTypescript } = require('./addts/addts');
+const { initTypescriptProject } = require('./gents/gents');
 const { createIndexHtmlCssFile } = require('./htmlcss/htmlcss');
 
 const program = new Command();
@@ -16,11 +18,11 @@ const program = new Command();
 program
     .name('sin')
     .description('Project handler')
-    .version('1.6.1');
+    .version('1.8.0');
 
 program
     .command('init')
-    .description('Initialize the web project')
+    .description('Initialize the Node.js web project')
     .action(() => {
         createWeb();
     });
@@ -69,12 +71,20 @@ program
     })
 
 program
-    .command('ts')
+    .command('addts')
     .description('Supplement with TypeScript')
     .action(() => {
         supplementTypescript();
     })
 
+program
+    .command('ts')
+    .description('Initialize TypeScript Node.js project')
+    .action(() => {
+        initTypescriptProject();
+    })
+
+
 program
     .command('web')
     .description('HTML és üres CSS fájl')
@@ -82,4 +92,11 @@ program
         createIndexHtmlCssFile();
     })
 
+program
+    .command('esbuild')
+    .description('ESBuild client')
+    .action(() => {
+        createEsbuildProject();
+    });
+
 program.parse();

package/tools/dep.js

@@ -31,6 +31,7 @@ async function readJsonFile(filePath) {
 }
 
 async function addDependencies(obj, packageNames, devDep) {
+    console.log(`Adding dependencies...`);
     for(const packageName of packageNames) {
         try {
             const newDependency = await getPackageInfo(packageName);
@@ -65,7 +66,8 @@ async function writeJsonFile(path, obj) {
     try {
         await jsonfile.writeFile(path, obj, { spaces: 2});
         if(debug) {
-            console.log(`Added new depencies`);
+            console.log(`Written new JSON file: ${path}`);
+            console.log(obj);
         }
     } catch (err) {
         console.error('Error! Failed to write package.json:');