vaderjs 1.3.3-alpha-114 → 1.3.3-alpha-116

package/package.json

@@ -2,7 +2,7 @@
   "name": "vaderjs",
   "description": "A Reactive library aimed to helping you build reactive applications inspired by react.js",
   "module": "vader.js",
-  "version": "1.3.3-alpha-114",
+  "version": "1.3.3-alpha-116",
   "bin": {
     "vader": "./vader.js"
   },

package/runtime/router.js

@@ -1 +1 @@
-import{Component}from"./vader.js";let middlewares=[];class VaderRouter{constructor(e,t){this.routes=[],this.middlewares=[],this.errorMiddlewares=[],this.listeners=[],this.basePath=e,console.log(this.basePath)}get(e,t){this.routes.push({path:e,handler:t,method:"get"})}use(e){this.middlewares.push(e)}listen(e,t){if(e||(e=Math.random().toString(36).substring(7)),this.listeners.push(e),1===this.listeners.length){let e=`/${window.location.pathname.split("/")[1]}`;this.handleRoute(e)}else this.listeners.pop();t&&t(),window.onpopstate=async e=>{let t=`/${window.location.pathname.split("/")[1]}`;routes.find((e=>e.url.includes(t)))||(t="/404");let s=(new DOMParser).parseFromString(await fetch(t,{cache:"reload"}).then((e=>e.text())),"text/html").documentElement;document.querySelector("#root").innerHTML=s.querySelector("#root").innerHTML,document.title=s.querySelector("title").innerHTML,document.querySelector('script[id="router"]').remove();let n=document.createElement("script");n.id="router",n.innerHTML=s.querySelector('script[id="router"]').innerHTML,n.setAttribute("type","module"),document.body.appendChild(n)}}extractParams(e,t){const s=e.split("/"),n=t.split("/"),r={};return s.forEach(((e,t)=>{if(e.startsWith(":")){const s=e.slice(1);r[s]=n[t]}else if(e.startsWith("*")){n.slice(t).forEach(((e,t)=>{r[t]=e}))}})),r}extractQueryParams(e){const t=e.split("?")[1];if(!t)return{};const s={};return t.split("&").forEach((e=>{const[t,n]=e.split("=");s[t]=n})),s}handleRoute(e){let t=200,s=e,n=this.routes.find((t=>{if(t.path===e)return!0;if(""===e&&"/"===t.path)return!0;if(e.includes("?")&&(e=e.split("?")[0]),t.path.includes("*")||t.path.includes(":")){const s=t.path.split("/"),n=e.split("/");if(s.length!==n.length&&!t.path.endsWith("*"))return!1;for(let e=0;e<s.length;e++){const t=s[e],r=n[e];if(!t.startsWith(":")&&!t.startsWith("*")&&t!==r)return!1}return!0}const n=this.extractParams(t.path,s);return Object.keys(n).length>0}));n||(n=window.routes.find((e=>{if(e.url.includes("/404"))window.history.replaceState({},"","/404");else if(!this.error&&e.url.includes("/404"))return!0})),t=n?200:404);const r=this.extractQueryParams(s),o=n&&n.path?this.extractParams(n.path,s):{};Object.keys(o).forEach((e=>{o[e]=o[e].split("?")?o[e].split("?")[0]:o[e]}));const i={headers:{},params:o,query:r,path:e,fileUrl:window.location.href.split(window.location.origin)[1],url:window.location.href,method:n?n.method:"get",pause:!1,timestamp:Date.now()};window.$CURRENT_URL=i.path,window.$FULL_URL=window.location.href.replace("#","");const a={status:t,log:e=>{void 0===e?console.log(`${i.path} ${i.method} ${a.status} ${i.timestamp}`):console.table({"Request Path":i.path,"Request Method":n.method,"Response Status":a.status,"Request Timestamp":i.timestamp})},refresh:()=>{this.handleRoute(window.location.hash)},redirect:e=>{!e.startsWith("/")&&(e=`/${e}`),window.location.hash=`#${e}`},render:async(e,t,s,n)=>{function isClass(e){return"function"==typeof e&&/^class\s/.test(Function.prototype.toString.call(e))}try{let n=new Component;if(isClass(e.default)){let t=new e.default;n.state=t.state,n=t}else{if(e.default.toString().includes("this.key"))throw new Error('Using this.key is not supported in functional components use the attribute key="a value" instead');n.key=e.default.toString().split('key="')[1]?e.default.toString().split('key="')[1].split('"')[0]:null;let i={key:n.key,render:()=>e.default.apply(n,[t,s]),request:t,response:s,params:o,queryParams:r,reset:n.reset.bind(n),onMount:n.onMount.bind(n),useState:null,router:{use:n.router.use.bind(n)},bindMount:n.bindMount.bind(n),memoize:n.memoize.bind(n),createComponent:n.createComponent.bind(n),isChild:!1,useState:n.useState.bind(n),parseStyle:n.parseStyle.bind(n),bind:n.bind.bind(n),useRef:n.useRef.bind(n),useReducer:n.useReducer.bind(n),onMount:n.onMount.bind(n),onUnmount:n.onUnmount.bind(n),hydrate:n.hydrate.bind(n)};n.render=i.render,n=i,console.log(t)}if(!document.querySelector("#root"))throw new Error("Root element not found, please add an element with id root");n.reset(),n.components={},n.request=t,n.response=s,n.router.use&&!n.isChild?await new Promise((async r=>{if(isClass(e.default))if(isClass(e.default))switch(await n.router.use(t,s),t.pause){case!0:console.log("pausing",t.pause);let e=setInterval((()=>{t.pause?console.log("still pausing",t.pause):(clearInterval(e),r())}),1e3);break;case!1:r()}else r();else switch(await e.default.apply(n,[t,s]),await n.router.use(t,s),t.pause){case!0:let e=setInterval((()=>{t.pause?console.log("still pausing  request",t.url):(clearInterval(e),r())}),1e3);break;case!1:r()}})):n.router.use&&n.isChild&&console.warn("Router.use() is not supported in child components");const i=await n.render();document.querySelector("#root").innerHTML!==i&&(console.log("rendering"),document.querySelector("#root").innerHTML=i),n.bindMount(),n.onMount()}catch(e){console.error(e)}},setQuery:e=>{let t="";Object.keys(e).forEach(((s,n)=>{t+=`${0===n?"?":"&"}${s}=${e[s]}`}));let s=window.location.hash.split("?")[0];t=t.replace("/","-").replaceAll("/","-"),window.location.hash=`${s}${t}`},send:e=>{document.querySelector("#root").innerHTML=e},json:e=>{const t=document.querySelector("#root");t.innerHTML="";const s=document.createElement("pre");s.textContent=JSON.stringify(e,null,2),t.appendChild(s)}};middlewares.forEach((e=>{e(i,a)})),n&&n.handler(i,a)}}window.VaderRouter=VaderRouter;export default VaderRouter;
+import{Component as e}from"./vader.js";let t=[];class VaderRouter{constructor(e,t){this.routes=[],this.middlewares=[],this.errorMiddlewares=[],this.listeners=[],this.basePath=e}get(e,t){this.routes.push({path:e,handler:t,method:"get"})}use(e){this.middlewares.push(e)}listen(e,t){e||(e=Math.random().toString(36).substring(7)),window.onpopstate=async e=>{let t=window.location.pathname,r=`/${t.split("/")[1]}`;this.checkroute(t)||(t="/404");let s=(new DOMParser).parseFromString(await fetch(r,{cache:"reload"}).then((e=>e.text())),"text/html").documentElement;document.querySelector("#root").innerHTML=s.querySelector("#root").innerHTML,document.title=s.querySelector("title").innerHTML,document.querySelector('script[id="router"]').remove();let n=document.createElement("script");n.id="router",n.innerHTML=s.querySelector('script[id="router"]').innerHTML,n.setAttribute("type","module"),document.body.appendChild(n)},this.listeners.push(e),1===this.listeners.length?this.handleRoute(window.location.pathname):this.listeners.pop(),t&&t()}extractParams(e,t){const r=e.split("/").filter((e=>""!==e)),s=t.split("/").filter((e=>""!==e)),n={};return r.forEach(((e,t)=>{if(e.startsWith(":")){const r=e.slice(1);n[r]=s[t]}else if(e.startsWith("*")){s.slice(t).forEach(((e,t)=>{n[t]=e}))}})),n}extractQueryParams(e){const t=e.split("?")[1];if(!t)return{};const r={};return t.split("&").forEach((e=>{const[t,s]=e.split("=");r[t]=s})),r}checkroute(e){return this.routes.find((t=>{if(t.path===e)return!0;if(""===e&&"/"===t.path)return!0;if(e.includes("?")&&(e=e.split("?")[0]),t.path.includes("*")||t.path.includes(":")){const r=t.path.split("/").filter((e=>""!==e)),s=e.split("/").filter((e=>""!==e));if(r.length!==s.length&&!t.path.endsWith("*"))return!1;for(let e=0;e<r.length;e++){const t=r[e],n=s[e];if(!t.startsWith(":")&&!t.startsWith("*")&&t!==n)return!1}return!0}const r=this.extractParams(t.path,e);return Object.keys(r).length>0}))}handleRoute(r){let s=200,n=r,o=this.checkroute(r);o||(o=window.routes.find((e=>e.url.includes("/404")&&!this.error?(window.history.pushState({},"","/404"),window.dispatchEvent(new Event("popstate")),this.error=!0,!1):!(this.error||!e.url.includes("/404"))||void 0)),s=o?200:404);const i=this.extractQueryParams(n),a=o&&o.path?this.extractParams(o.path,n):{};Object.keys(a).forEach((e=>{a[e]=a[e].split("?")?a[e].split("?")[0]:a[e]}));const l={headers:{},params:a,query:i,path:r,fileUrl:window.location.href.split(window.location.origin)[1],url:window.location.href,method:o?o.method:"get",pause:!1,timestamp:Date.now()};window.$CURRENT_URL=l.path,window.$FULL_URL=window.location.href.replace("#","");const u={status:s,log:e=>{void 0===e?console.log(`${l.path} ${l.method} ${u.status} ${l.timestamp}`):console.table({"Request Path":l.path,"Request Method":o.method,"Response Status":u.status,"Request Timestamp":l.timestamp})},refresh:()=>{this.handleRoute(window.location.pathname)},redirect:e=>{!e.startsWith("/")&&(e=`/${e}`),window.history.pushState({},"",e),window.dispatchEvent(new Event("popstate"))},render:async(t,r,s,n)=>{function isClass(e){return"function"==typeof e&&/^class\s/.test(Function.prototype.toString.call(e))}try{let n=new e;if(isClass(t.default)){let e=new t.default;n.state=e.state,n=e}else{if(t.default.toString().includes("this.key"))throw new Error('Using this.key is not supported in functional components use the attribute key="a value" instead');n.key=t.default.toString().split('key="')[1]?t.default.toString().split('key="')[1].split('"')[0]:null;let e={key:n.key,render:()=>t.default.apply(n,[r,s]),request:r,response:s,params:a,queryParams:i,reset:n.reset.bind(n),onMount:n.onMount.bind(n),useState:null,router:{use:n.router.use.bind(n)},bindMount:n.bindMount.bind(n),memoize:n.memoize.bind(n),createComponent:n.createComponent.bind(n),isChild:!1,useState:n.useState.bind(n),parseStyle:n.parseStyle.bind(n),bind:n.bind.bind(n),useRef:n.useRef.bind(n),useReducer:n.useReducer.bind(n),onMount:n.onMount.bind(n),onUnmount:n.onUnmount.bind(n),hydrate:n.hydrate.bind(n)};n.render=e.render,n=e}if(!document.querySelector("#root"))throw new Error("Root element not found, please add an element with id root");n.reset(),n.components={},n.request=r,n.response=s,n.router.use&&!n.isChild?await new Promise((async e=>{if(isClass(t.default))if(isClass(t.default))switch(await n.router.use(r,s),r.pause){case!0:console.log("pausing",r.pause);let t=setInterval((()=>{r.pause?console.log("still pausing",r.pause):(clearInterval(t),e())}),1e3);break;case!1:e()}else e();else switch(await t.default.apply(n,[r,s]),await n.router.use(r,s),r.pause){case!0:let t=setInterval((()=>{r.pause?console.log("still pausing  request",r.url):(clearInterval(t),e())}),1e3);break;case!1:e()}})):n.router.use&&n.isChild&&console.warn("Router.use() is not supported in child components");const o=await n.render();document.querySelector("#root").innerHTML!==o&&(document.querySelector("#root").innerHTML=o),n.bindMount(),n.onMount()}catch(e){console.error(e)}},setQuery:e=>{let t="";Object.keys(e).forEach(((r,s)=>{t+=`${0===s?"?":"&"}${r}=${e[r]}`}));let r=window.location.hash.split("?")[0];t=t.replace("/","-").replaceAll("/","-"),window.location.hash=`${r}${t}`},send:e=>{document.querySelector("#root").innerHTML=e},json:e=>{const t=document.querySelector("#root");t.innerHTML="";const r=document.createElement("pre");r.textContent=JSON.stringify(e,null,2),t.appendChild(r)}};t.forEach((e=>{e(l,u)})),o&&o.handler(l,u)}}window.VaderRouter=VaderRouter;export default VaderRouter;

package/vader.js

@@ -13,15 +13,15 @@ let errorCodes = {
 /**
  * define directories
  */
- 
 
-if(!fs.existsSync(process.cwd() + '/dist')){
+
+if (!fs.existsSync(process.cwd() + '/dist')) {
   fs.mkdirSync(process.cwd() + '/dist')
 }
 
 
 
-if (typeof process.env.isCloudflare !== "undefined" || !fs.existsSync(process.cwd() + '/dist/index.html')) { 
+if (typeof process.env.isCloudflare !== "undefined" || !fs.existsSync(process.cwd() + '/dist/index.html')) {
   let htmlFile = fs.readFileSync(process.cwd() + "/node_modules/vaderjs/runtime/index.html", 'utf8')
   fs.writeFileSync(process.cwd() + "/dist/index.html", htmlFile)
 }
@@ -100,7 +100,7 @@ function Compiler(func, file) {
     let functionAttributes = [];
     let functionMatch;
     while ((functionMatch = functionAttributeRegex.exec(code)) !== null) {
-      let [, attributeName, attributeValue] = functionMatch; 
+      let [, attributeName, attributeValue] = functionMatch;
       let attribute = {};
 
       if (attributeValue && attributeValue.includes("=>") || attributeValue && attributeValue.includes("function")) {
@@ -138,18 +138,18 @@ function Compiler(func, file) {
           }
         });
         // add ; after newlines  
-         
+
 
         let newvalue = attributeValue.includes('=>') ? attributeValue.split("=>").slice(1).join("=>").trim() : attributeValue.split("function").slice(1).join("function").trim()
 
-         
+
 
         newvalue = newvalue.trim();
 
         //remove starting {
         newvalue = newvalue.replace("{", "")
- 
-         
+
+
 
         let params = attributeValue
           .split("=>")[0]
@@ -164,23 +164,23 @@ function Compiler(func, file) {
         // split first {}
         newvalue = newvalue.trim();
 
-       
 
-            newvalue = newvalue.replace(/}\s*$/, '');
 
- 
-         
+        newvalue = newvalue.replace(/}\s*$/, '');
+
+
+
         newvalue = newvalue.trim();
 
         // remmove trailing }
 
-        newvalue = newvalue.trim();   
-         newvalue = newvalue.replace(/}\s*$/, '');
-        
+        newvalue = newvalue.trim();
+        newvalue = newvalue.replace(/}\s*$/, '');
+
+
+
+        functionparams.length > 0 ? params = params + ',' + functionparams.map((e) => e.name).join(',') : null
 
-    
-        functionparams.length > 0 ? params = params + ',' + functionparams.map((e) => e.name).join(',') : null 
- 
         newvalue = newvalue.replaceAll(',,', ',')
         let paramnames = params ? params.split(',').map((e) => e.trim()) : null
         paramnames = paramnames ? paramnames.filter((e) => e.length > 0) : null
@@ -195,7 +195,7 @@ function Compiler(func, file) {
           }
           return e
         }) : ''}" ${params ? params.split(',').map((e) => e.trim()).filter(Boolean).map((e) => `,${e}`).join('') : ''})}"`
-     
+
         string = string.replace(old, bind);
       }
     }
@@ -662,7 +662,7 @@ function Compiler(func, file) {
 
           }
 
-           
+
           if (newImport) {
             string = string.replace(beforeimport, newImport)
           }
@@ -720,24 +720,25 @@ async function Build() {
     globalThis.isBuilding = true
     console.log(`Generating html files for ${routes.length} routes`)
     routes.forEach(async (route) => {
-      if(route.url.includes(':')){
+      if (route.url.includes(':')) {
         console.log('Route ' + route.url + ' is a dynamic route and will not be generated')
-         return
+        return
       }
       console.log('Generating html file for route ' + route.url)
       let equalparamroute = routes.map((e) => {
-        
+        console.log(e.url, route.url)
         if (e.url.includes(':')) {
-           let url = e.url.split('/:')[0]    
-           if(url&&route.url === url){
-             return  e
-           }else{
-              return  null
-            
-           }
+          let url = e.url.split('/:')[0]
+          console.log(url, route.url)
+          if (url && route.url === url) {
+            return e
+          } else {
+            return null
+
+          }
         }
         return null
-      }).filter(Boolean)  
+      }).filter(Boolean)
       let document = `
       <!DOCTYPE html>
       <html lang="en">
@@ -809,77 +810,79 @@ async function Build() {
           let module = await import('/${route.fileName.replace('.jsx', '.js')}')
           res.render(module, req, res, module.$metadata)
         }) 
-        ${equalparamroute.length > 0 ? equalparamroute.map((e) => { 
-         
+        ${equalparamroute.length > 0 ? equalparamroute.map((e) => {
+
+
 
         return `router.get('${e.url}', async (req, res) => {
            let module = await import('/${e.fileName.replace('.jsx', '.js')}')
            res.render(module, req, res, module.$metadata)
         })\n`
-        }): ''}
+      }) : ''}
         router.listen(3000)
          
     </script> 
       </html>
     `;
-  
-    // generate random but common ports
-    let port =  Math.floor(Math.random() * (65535 - 49152 + 1) + 49152)
-     
-      const server = http.createServer((req, res) => {  
+
+      // generate random but common ports
+      let port = Math.floor(Math.random() * (65535 - 49152 + 1) + 49152)
+
+      const server = http.createServer((req, res) => {
         if (req.url === '/') {
           // Respond with the generated HTML
           res.writeHead(200, { 'Content-Type': 'text/html' });
           res.end(document);
         } else {
           // Serve static files (adjust the file paths based on your project structure)
-          const filePath =  process.cwd() +  '/dist/' + req.url
-           
+          const filePath = process.cwd() + '/dist/' + req.url
+
           fs.readFile(filePath, (err, data) => {
             if (err) {
-              res.writeHead(404, { 'Content-Type':  filePath.includes('js') ? 'text/javascript' : 'text/html' });
+              res.writeHead(404, { 'Content-Type': filePath.includes('js') ? 'text/javascript' : 'text/html' });
               res.end('File not found');
             } else {
               res.writeHead(200, { 'Content-Type': filePath.includes('js') ? 'text/javascript' : 'text/html' });
-              res.end(data); 
+              res.end(data);
             }
           });
         }
       });
-  
+
       server.listen(port)
-  
+
       globalThis.listen = true;
 
-      puppeteer.launch({ headless:  "new", args: ['--no-sandbox', '--disable-setuid-sandbox'], 
-     warning: false,
-    }).then(async (browser) => {
-        
+      puppeteer.launch({
+        headless: "new", args: ['--no-sandbox', '--disable-setuid-sandbox'],
+        warning: false,
+      }).then(async (browser) => {
+
         // remove /: from route
-        route.url = route.url.replaceAll(/\/:[a-zA-Z0-9_-]+/gs, '')   
-        const page = await browser.newPage(); 
+        route.url = route.url.replaceAll(/\/:[a-zA-Z0-9_-]+/gs, '')
+        const page = await browser.newPage();
         await page.goto(`http://localhost:${port}` + '#' + route.url, { waitUntil: 'networkidle2' });
-        await page.waitForSelector('#root');  
+        await page.waitForSelector('#root');
         await page.evaluate(() => {
           document.getElementById('meta').remove()
         })
         const html = await page.content();
-        await page.close(); 
+        await page.close();
         let isBasePath = route.url === '/' ? true : false
         await writer(process.cwd() + '/dist/' + (isBasePath ? 'index.html' : `${route.url}/` + 'index.html'), html)
         await browser.close();
-         // close http
-          server.close() 
+        // close http
+        server.close()
       })
-     
+
     })
-      
-    let timeout =  setTimeout(() => {
+
+    let timeout = setTimeout(() => {
       globalThis.isBuilding = false
       clearTimeout(timeout)
     }, 1000)
   }
- 
+
   globalThis.routes = []
 
   for await (let file of glb) {
@@ -909,7 +912,7 @@ async function Build() {
 
     let data = await fs.readFileSync(origin, "utf8");
     data = Compiler(data, origin);
-   
+
 
 
     await writer(process.cwd() + "/dist/" + fileName.replace('.jsx', '.js'), data).then(async () => {
@@ -939,11 +942,11 @@ async function Build() {
     obj.compiledPath = process.cwd() + "/dist/pages/" + fileName.replace('.jsx', '.js')
 
 
-     
-    globalThis.routes.push({fileName:fileName, url:obj.url, html:'/' + (isBasePath ? 'index.html' : `${obj.url}/` + 'index.html')})
- 
 
- 
+    globalThis.routes.push({ fileName: fileName, url: obj.url, html: '/' + (isBasePath ? 'index.html' : `${obj.url}/` + 'index.html') })
+
+
+
   }
 
   ssg(globalThis.routes)
@@ -1043,32 +1046,32 @@ async function Build() {
 
   globalThis.isBuilding = false
   console.log(`Build completed in ${Date.now() - start}ms with ${Math.round(bundleSize / 1000)}kb`)
- 
+
   bundleSize = 0;
   return true
-} 
-const s = ()=>{
-  
+}
+const s = () => {
+
   const server = http.createServer((req, res) => {
-       
-    if(!req.url.endsWith('.js') && !req.url.endsWith('.css') && !req.url.endsWith('.mjs') && !req.url.endsWith('.cjs') && !req.url.endsWith('.html') && !req.url.endsWith('.json')){
-      req.url = req.url !== '/' ? req.url.split('/')[1] : req.url 
+
+    if (!req.url.endsWith('.js') && !req.url.endsWith('.css') && !req.url.endsWith('.mjs') && !req.url.endsWith('.cjs') && !req.url.endsWith('.html') && !req.url.endsWith('.json')) {
+      req.url = req.url !== '/' ? req.url.split('/')[1] : req.url
       req.url = process.cwd() + '/dist/' + req.url + '/index.html'
-    }else{ 
+    } else {
       req.url = process.cwd() + '/dist/' + req.url
-    } 
-     
-    const filePath =  req.url  
+    }
+
+    const filePath = req.url
 
     fs.readFile(filePath, (err, data) => {
-        if (err) {
-            res.writeHead(404, { 'Content-Type': 'text/html' });
-            res.end(fs.existsSync(process.cwd() + '/dist/404') ? fs.readFileSync(process.cwd() + '/dist/404/index.html') : '404');
-        } else {
-            const contentType = getContentType(filePath);
-          switch(true){
-            case contentType === 'text/html' && globalThis.devMode:
-              data = data.toString() + `<script type="module">
+      if (err) {
+        res.writeHead(404, { 'Content-Type': 'text/html' });
+        res.end(fs.existsSync(process.cwd() + '/dist/404') ? fs.readFileSync(process.cwd() + '/dist/404/index.html') : '404');
+      } else {
+        const contentType = getContentType(filePath);
+        switch (true) {
+          case contentType === 'text/html' && globalThis.devMode:
+            data = data.toString() + `<script type="module">
                let ws = new WebSocket('ws://localhost:3000')
                 ws.onmessage = (e) => {
                   if(e.data === 'reload'){
@@ -1078,51 +1081,51 @@ const s = ()=>{
                 }
               </script>
               `
-          }
-            res.writeHead(200, { 'Content-Type': contentType });
-            res.end(data);
         }
+        res.writeHead(200, { 'Content-Type': contentType });
+        res.end(data);
+      }
     });
-});
+  });
+
 
- 
-const ws = new WebSocketServer({ server });
-ws.on('connection', (socket) => {
+  const ws = new WebSocketServer({ server });
+  ws.on('connection', (socket) => {
     console.log('Client connected');
     socket.on('close', () => console.log('Client disconnected'));
-});
+  });
 
 
-function getContentType(filePath) {
+  function getContentType(filePath) {
     if (filePath.includes('js')) {
-        return 'text/javascript';
+      return 'text/javascript';
     } else if (filePath.includes('.css')) {
-        return 'text/css';
+      return 'text/css';
     } else {
-        return 'text/html';
+      return 'text/html';
     }
-}
+  }
 
-const PORT = process.env.PORT || 3000;
-server.listen(PORT, () => {
+  const PORT = process.env.PORT || 3000;
+  server.listen(PORT, () => {
     console.log(`Server is running on port ${PORT}`);
-}); 
-let i = 
-setInterval(() => {
-  if (globalThis.isBuilding && globalThis.devMode) {
-     // reload page
-      console.log('Reloading page...')
-      ws.clients.forEach((client) => {
-        client.send('reload')
-        console.log('Reloaded page')
-      })
-  } else{
-    clearInterval(i)
-  }
-},120)
-  
+  });
+  let i =
+    setInterval(() => {
+      if (globalThis.isBuilding && globalThis.devMode) {
+        // reload page
+        console.log('Reloading page...')
+        ws.clients.forEach((client) => {
+          client.send('reload')
+          console.log('Reloaded page')
+        })
+      } else {
+        clearInterval(i)
+      }
+    }, 120)
+
 }
- 
+
 
 switch (true) {
   case process.argv.includes('--watch'):
@@ -1149,10 +1152,10 @@ Vader.js v1.3.3
           }
         }).on('error', (err) => console.log(err))
     })
-    
+
     s()
- 
-  globalThis.listen = true; 
+
+    globalThis.listen = true;
 
     break;
   case process.argv.includes('--build'):
@@ -1160,9 +1163,9 @@ Vader.js v1.3.3
     console.log(`
 Vader.js v1.3.3 
 Building to ./dist
-`) 
+`)
     Build()
-    
+
     break;
   case process.argv.includes('--serve'):
     let port = process.argv[process.argv.indexOf('--serve') + 1] || 3000