WIP: Component CLI

bin/createFragment/createFragment.js

@@ -0,0 +1,61 @@
+const fs = require('fs');
+const path = require('path');
+
+const args = process?.argv?.slice(2);
+const newFragmentName = args?.[0];
+
+if (!newFragmentName) {
+    console.error("Component name is required");
+    return;
+}
+
+const renderComponentTemplate = (componentName, routePath) => (`
+const voltran = require('@voltran/core');
+
+import React from 'react';
+import classNames from 'classnames';
+
+import ROUTE_PATHS from '../../appRoute/routeConstants';
+
+import style from './${componentName}.scss';
+
+function ${componentName}({ initialState }) {
+  return (
+    <div className={classNames(style.root)}>
+      <div className={classNames(style.container)}>
+        <h1>Welcome to the VoltranJS</h1>
+      </div>
+    </div>
+  );
+}
+
+const component = voltran.default.withBaseComponent(${componentName}, ROUTE_PATHS.${routePath});
+
+export default component;
+`);
+
+const createComponet = () => {
+    const componetName = newFragmentName;
+    const routeName = newFragmentName?.toUpperCase();
+
+    const fileContents = [{
+        ext: 'js',
+        renderFn: renderComponentTemplate
+    },
+    {
+        ext: 'scss',
+        renderFn: () => ''
+    }
+    ];
+
+    const partialsFolder = path.resolve('src', 'partials', componetName);
+
+    fs.mkdir(partialsFolder, () => {
+        fileContents.map(fileContent => {
+            const componentFolder = path.resolve('src', 'partials', componetName, `${componetName}.${fileContent?.ext}`);
+            fs.writeFileSync(componentFolder, fileContent?.renderFn(componetName, routeName), { encoding: 'utf-8' });
+        })
+    });
+}
+
+createComponet();

package.json

@@ -4,10 +4,11 @@
   "author": "Hepsiburada Technology Team",
   "license": "MIT",
   "dependencies": {
-    "voltranjs": "^1.0.16"
+    "voltranjs": "^1.0.22"
   },
   "scripts": {
     "start": "yarn voltran --config voltran-app.config.js --dev",
-    "serve": "yarn voltran --config voltran-app.config.js"
+    "serve": "yarn voltran --config voltran-app.config.js",
+    "create-fragment": "node ./bin/createFragment/createFragment.js"
   }
-}
+}

src/appRoute/routeConstants.js

@@ -1,5 +1,5 @@
 const ROUTE_PATHS = {
-  HELLO_WORLD: '/Desktop/HelloWorld',
+  HELLO_WORLD: '/HelloWorld',
 };
 
 export default ROUTE_PATHS;

src/partials/HelloWorld/HelloWorld.js

@@ -15,7 +15,7 @@ function HelloWorld({ initialState }) {
         <h1>Welcome to the VoltranJS</h1>
 
         <span>Hello World! It is a Micro Frontend Library</span>
-        <img className={style.voltran} src={`${appConfig.mediaUrl}/images/voltran.png`}/>
+        <img className={style.voltran} src={`${appConfig.mediaUrl}/images/voltran.png`} />
       </div>
     </div>
   );

src/partials/newComponent/newComponent.js

@@ -0,0 +1,23 @@
+
+const voltran = require('@voltran/core');
+
+import React from 'react';
+import classNames from 'classnames';
+
+import ROUTE_PATHS from '../../appRoute/routeConstants';
+
+import style from './newComponent.scss';
+
+function newComponent({ initialState }) {
+  return (
+    <div className={classNames(style.root)}>
+      <div className={classNames(style.container)}>
+        <h1>Welcome to the VoltranJS</h1>
+      </div>
+    </div>
+  );
+}
+
+const component = voltran.default.withBaseComponent(newComponent, ROUTE_PATHS.NEWCOMPONENT);
+
+export default component;

yarn.lock

@@ -8872,10 +8872,10 @@ vm-browserify@^1.0.1:
   resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-1.1.2.tgz#78641c488b8e6ca91a75f511e7a3b32a86e5dda0"
   integrity sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==
 
-voltranjs@^1.0.16:
-  version "1.0.18"
-  resolved "https://registry.yarnpkg.com/voltranjs/-/voltranjs-1.0.18.tgz#845f77d51bf64c4a84c7c8e464f4d5ed9870d9ca"
-  integrity sha512-Bvsw1N3Se8Tgn6o4bWIEC3y95c7X1XvzL17d6mx742WacWvt6TF4NzciybvrvjldkAwvbdf0qBLIOLf+wNl4WA==
+voltranjs@^1.0.22:
+  version "1.0.22"
+  resolved "https://registry.yarnpkg.com/voltranjs/-/voltranjs-1.0.22.tgz#57838cc7c036d639d70840447c67f1449561b3de"
+  integrity sha512-vcBYVnZv6Kek9J3a57YKCwAvXk3yAr+Y6cbU7adZNxji6c51COg4V925ueIap6WtbZLfOmEeC3HmKHNEkRAiDA==
   dependencies:
     "@babel/core" "7.14.3"
     "@babel/eslint-parser" "^7.12.1"