frontend-hamroun 1.1.60 → 1.1.62

package/bin/cli.js

@@ -36,8 +36,8 @@ async function buildProject(root, isDev = false) {
     bundle: true,
     outfile: path.join(root, 'dist/bundle.js'),
     loader: { '.tsx': 'tsx', '.ts': 'ts' },
-    jsxFactory: '_jsx',
-    jsxFragment: '_Fragment',
+    jsxFactory: 'createElement',
+    jsxFragment: 'Fragment',
     platform: 'browser',
     target: 'es2020',
     minify: !isDev,
@@ -45,7 +45,19 @@ async function buildProject(root, isDev = false) {
     define: {
       'process.env.NODE_ENV': JSON.stringify(isDev ? 'development' : 'production')
     },
-    inject: [path.join(root, 'src/jsx-shim.js')],
+    plugins: [{
+      name: 'jsx-import',
+      setup(build) {
+        build.onResolve({ filter: /\.[tj]sx$/ }, args => ({
+          path: args.path,
+          namespace: 'jsx-namespace'
+        }));
+        build.onLoad({ filter: /\.[tj]sx$/, namespace: 'jsx-namespace' }, async args => ({
+          contents: `import { createElement, Fragment } from 'frontend-hamroun';\n${await fs.readFile(args.path, 'utf8')}`,
+          loader: 'tsx'
+        }));
+      }
+    }]
   };
 
   if (isDev) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "frontend-hamroun",
-  "version": "1.1.60",
+  "version": "1.1.62",
   "description": "A lightweight frontend framework with hooks and virtual DOM",
   "type": "module",
   "main": "./dist/index.js",

package/templates/basic-app/package.json

@@ -1,19 +1,20 @@
-{
-  "name": "esbuild",
-  "private": true,
-  "version": "0.0.0",
-  "type": "module",
-  "scripts": {
-    "dev": "npx frontend-hamroun dev",
-    "build": "npx frontend-hamroun build",
-    "lint": "eslint src --ext ts,tsx"
-  },
-  "dependencies": {
-    "frontend-hamroun": "latest"
-  },
-  "devDependencies": {
-    "esbuild": "^0.19.2",
-    "sirv-cli": "^2.0.2",
-    "typescript": "^5.0.0"
-  }
-}
+{
+  "name": "ctttt",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "npx frontend-hamroun dev",
+    "build": "npx frontend-hamroun build",
+    "lint": "eslint src --ext ts,tsx",
+    "typecheck": "tsc --noEmit"
+  },
+  "devDependencies": {
+    "esbuild": "^0.19.2",
+    "sirv-cli": "^2.0.2",
+    "typescript": "^5.0.0"
+  },
+  "dependencies": {
+    "frontend-hamroun": "^1.1.59"
+  }
+}

package/templates/basic-app/src/main.tsx

@@ -1,15 +1,19 @@
-import { render, useState, Link, useRouter } from 'frontend-hamroun';
+import { render, useState, Link, useRouter, jsx, Fragment } from 'frontend-hamroun';
 
 // Home component
 function Home() {
-  const [count, setCount] = useState(0);
+  const [count, setCount] = useState<number>(0);
+  
+  const decrement = () => setCount((prev: number) => Math.max(0, prev - 1));
+  const increment = () => setCount((prev: number) => prev + 1);
+  
   return (
     <div>
       <h1>Home Page</h1>
       <div>
-        <button onClick={() => setCount(count - 1)}>-</button>
-        <span style={{ margin: '0 10px' }}>{count}</span>
-        <button onClick={() => setCount(count + 1)}>+</button>
+        <button onClick={decrement}>-</button>
+        <span>{count ?? 0}</span>
+        <button onClick={increment}>+</button>
       </div>
     </div>
   );

package/templates/basic-app/tsconfig.json

@@ -1,13 +1,22 @@
 {
   "compilerOptions": {
     "target": "ES2020",
-    "module": "ESNext",
+    "useDefineForClassFields": true,
     "lib": ["ES2020", "DOM", "DOM.Iterable"],
-    "jsx": "preserve",
+    "module": "ESNext",
+    "skipLibCheck": true,
     "moduleResolution": "bundler",
-    "esModuleInterop": true,
+    "allowImportingTsExtensions": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "preserve",
+    "jsxFactory": "jsx",
+    "jsxImportSource": "frontend-hamroun",
     "strict": true,
-    "skipLibCheck": true
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true
   },
   "include": ["src"]
 }

package/templates/basic-app/vite.config.ts

@@ -0,0 +1,15 @@
+import { defineConfig } from 'vite';
+import path from 'path';
+
+export default defineConfig({
+  resolve: {
+    alias: {
+      'frontend-hamroun': path.resolve(__dirname, 'node_modules/frontend-hamroun')
+    }
+  },
+  esbuild: {
+    jsxFactory: 'createElement',
+    jsxFragment: 'Fragment',
+    jsxInject: `import { createElement, Fragment } from 'frontend-hamroun'`
+  }
+});

package/templates/basic-app/esbuild.config.js

@@ -1,28 +0,0 @@
-import * as esbuild from 'esbuild';
-
-const isWatch = process.argv.includes('--watch');
-
-const config = {
-  entryPoints: ['src/main.tsx'],
-  bundle: true,
-  outfile: 'dist/bundle.js',
-  loader: { '.tsx': 'tsx' },
-  jsxFactory: 'createElement',
-  jsxFragment: 'null',
-  platform: 'browser',
-  target: 'es2020',
-  minify: true,
-  inject: ['./src/jsx-shim.ts'],
-  define: {
-    'Fragment': 'null'
-  }
-};
-
-if (isWatch) {
-  const ctx = await esbuild.context(config);
-  await ctx.watch();
-  console.log('Watching...');
-} else {
-  await esbuild.build(config);
-  console.log('Build complete');
-}

package/templates/basic-app/server.js

@@ -1,24 +0,0 @@
-import { spawn } from 'child_process';
-import sirv from 'sirv';
-import http from 'http';
-
-// Start esbuild in watch mode
-const esbuild = spawn('node', ['esbuild.config.js', '--watch'], {
-  stdio: 'inherit'
-});
-
-// Create simple static server
-const serve = sirv('.', {
-  dev: true,
-  single: true
-});
-
-const server = http.createServer(serve);
-server.listen(3000);
-console.log('Server running at http://localhost:3000');
-
-process.on('SIGTERM', () => {
-  esbuild.kill();
-  server.close();
-  process.exit();
-});

package/templates/basic-app/src/jsx-shim.ts

@@ -1,4 +0,0 @@
-import { jsx as createElement, Fragment } from 'frontend-hamroun';
-
-window.createElement = createElement;
-window.Fragment = Fragment;