ether-code 0.2.0 → 0.2.3

package/cli/ether.js

@@ -2,10 +2,11 @@
 
 const fs = require('fs')
 const path = require('path')
+const http = require('http')
 const { EtherCompiler } = require('./compiler')
 const { Watcher } = require('./watcher')
 
-const VERSION = '0.2.0'
+const VERSION = '0.2.3'
 
 const COLORS = {
   reset: '\x1b[0m',
@@ -62,7 +63,7 @@ ${COLORS.bright}UTILISATION${COLORS.reset}
 ${COLORS.bright}COMMANDES${COLORS.reset}
   ${COLORS.cyan}init${COLORS.reset}              Initialiser un nouveau projet Ether
   ${COLORS.cyan}build${COLORS.reset}             Compiler les fichiers .eth
-  ${COLORS.cyan}dev${COLORS.reset}               Mode développement (watch + compilation auto)
+  ${COLORS.cyan}dev${COLORS.reset}               Mode développement (watch + serveur + live-reload)
   ${COLORS.cyan}check${COLORS.reset}             Vérifier la syntaxe sans compiler
   ${COLORS.cyan}help${COLORS.reset}              Afficher cette aide
   ${COLORS.cyan}version${COLORS.reset}           Afficher la version
@@ -70,10 +71,12 @@ ${COLORS.bright}COMMANDES${COLORS.reset}
 ${COLORS.bright}OPTIONS${COLORS.reset}
   -c, --config        Chemin vers le fichier de configuration
   -o, --output        Dossier de sortie
+  -p, --port          Port du serveur (défaut: 3000)
   -w, --watch         Surveiller les changements (alias de dev)
   -v, --verbose       Mode verbeux
   -q, --quiet         Mode silencieux
   --no-color          Désactiver les couleurs
+  --no-server         Désactiver le serveur en mode dev
 
 ${COLORS.bright}EXEMPLES${COLORS.reset}
   ${COLORS.dim}# Initialiser un projet${COLORS.reset}
@@ -82,11 +85,11 @@ ${COLORS.bright}EXEMPLES${COLORS.reset}
   ${COLORS.dim}# Compiler le projet${COLORS.reset}
   ether build
 
-  ${COLORS.dim}# Mode développement${COLORS.reset}
+  ${COLORS.dim}# Mode développement avec serveur${COLORS.reset}
   ether dev
 
-  ${COLORS.dim}# Compiler avec config personnalisée${COLORS.reset}
-  ether build -c ./mon-config.js
+  ${COLORS.dim}# Mode développement sur port 8080${COLORS.reset}
+  ether dev -p 8080
 
 ${COLORS.bright}DOCUMENTATION${COLORS.reset}
   https://ether-code.com/docs
@@ -103,6 +106,7 @@ function loadConfig(configPath) {
     out: './dist',
     targets: {},
     i18n: 'fr',
+    port: 3000,
     watch: {
       ignored: ['node_modules', '.git', 'dist']
     }
@@ -135,6 +139,142 @@ function loadConfig(configPath) {
   return defaultConfig
 }
 
+const MIME_TYPES = {
+  '.html': 'text/html',
+  '.css': 'text/css',
+  '.js': 'application/javascript',
+  '.json': 'application/json',
+  '.png': 'image/png',
+  '.jpg': 'image/jpeg',
+  '.jpeg': 'image/jpeg',
+  '.gif': 'image/gif',
+  '.svg': 'image/svg+xml',
+  '.ico': 'image/x-icon',
+  '.woff': 'font/woff',
+  '.woff2': 'font/woff2',
+  '.ttf': 'font/ttf',
+  '.eot': 'application/vnd.ms-fontobject'
+}
+
+const LIVE_RELOAD_SCRIPT = `
+<script>
+(function() {
+  var source = new EventSource('/__ether_live_reload');
+  source.onmessage = function(e) {
+    if (e.data === 'reload') {
+      window.location.reload();
+    }
+  };
+  source.onerror = function() {
+    console.log('[Ether] Connexion au serveur perdue, tentative de reconnexion...');
+  };
+})();
+</script>
+`
+
+function createDevServer(outDir, port) {
+  const clients = []
+  
+  const server = http.createServer((req, res) => {
+    if (req.url === '/__ether_live_reload') {
+      res.writeHead(200, {
+        'Content-Type': 'text/event-stream',
+        'Cache-Control': 'no-cache',
+        'Connection': 'keep-alive',
+        'Access-Control-Allow-Origin': '*'
+      })
+      res.write('data: connected\n\n')
+      clients.push(res)
+      req.on('close', () => {
+        const index = clients.indexOf(res)
+        if (index !== -1) clients.splice(index, 1)
+      })
+      return
+    }
+    
+    let filePath = path.join(outDir, req.url === '/' ? 'index.html' : req.url)
+    
+    if (!filePath.includes('.') && !filePath.endsWith('/')) {
+      const htmlPath = filePath + '.html'
+      if (fs.existsSync(htmlPath)) {
+        filePath = htmlPath
+      }
+    }
+    
+    if (fs.existsSync(filePath) && fs.statSync(filePath).isDirectory()) {
+      filePath = path.join(filePath, 'index.html')
+    }
+    
+    if (!fs.existsSync(filePath)) {
+      res.writeHead(404, { 'Content-Type': 'text/html' })
+      res.end(`
+        <!DOCTYPE html>
+        <html>
+        <head><title>404 - Non trouvé</title></head>
+        <body style="font-family: system-ui; padding: 40px; text-align: center;">
+          <h1>404</h1>
+          <p>Fichier non trouvé: ${req.url}</p>
+          <p style="color: #666;">Serveur Ether Dev</p>
+        </body>
+        </html>
+      `)
+      return
+    }
+    
+    const ext = path.extname(filePath).toLowerCase()
+    const mimeType = MIME_TYPES[ext] || 'application/octet-stream'
+    
+    fs.readFile(filePath, (err, content) => {
+      if (err) {
+        res.writeHead(500)
+        res.end(`Erreur serveur: ${err.message}`)
+        return
+      }
+      
+      if (ext === '.html') {
+        let html = content.toString()
+        if (html.includes('</body>')) {
+          html = html.replace('</body>', `${LIVE_RELOAD_SCRIPT}</body>`)
+        } else if (html.includes('</html>')) {
+          html = html.replace('</html>', `${LIVE_RELOAD_SCRIPT}</html>`)
+        } else {
+          html += LIVE_RELOAD_SCRIPT
+        }
+        content = html
+      }
+      
+      res.writeHead(200, { 'Content-Type': mimeType })
+      res.end(content)
+    })
+  })
+  
+  server.listen(port, () => {
+    logSuccess(`Serveur démarré sur ${COLORS.cyan}http://localhost:${port}${COLORS.reset}`)
+  })
+  
+  server.on('error', (err) => {
+    if (err.code === 'EADDRINUSE') {
+      logError(`Le port ${port} est déjà utilisé. Essayez: ether dev -p ${port + 1}`)
+    } else {
+      logError(`Erreur serveur: ${err.message}`)
+    }
+    process.exit(1)
+  })
+  
+  return {
+    server,
+    reload: () => {
+      clients.forEach(client => {
+        client.write('data: reload\n\n')
+      })
+    },
+    close: () => {
+      clients.forEach(client => client.end())
+      server.close()
+    }
+  }
+}
+
 async function cmdInit() {
   showBanner()
   logInfo('Initialisation du projet Ether...')
@@ -153,11 +293,50 @@ async function cmdInit() {
     logSuccess('Dossier dist/ créé')
   }
 
+  const publicDir = path.join(cwd, 'public')
+  if (!fs.existsSync(publicDir)) {
+    fs.mkdirSync(publicDir, { recursive: true })
+    logSuccess('Dossier public/ créé')
+  }
+
+  const imagesDir = path.join(publicDir, 'images')
+  if (!fs.existsSync(imagesDir)) {
+    fs.mkdirSync(imagesDir, { recursive: true })
+    logSuccess('Dossier public/images/ créé')
+  }
+
+  const videosDir = path.join(publicDir, 'videos')
+  if (!fs.existsSync(videosDir)) {
+    fs.mkdirSync(videosDir, { recursive: true })
+    logSuccess('Dossier public/videos/ créé')
+  }
+
+  const projectName = path.basename(cwd)
+  const packageJsonPath = path.join(cwd, 'package.json')
+  if (!fs.existsSync(packageJsonPath)) {
+    const packageJson = {
+      name: projectName.toLowerCase().replace(/[^a-z0-9-]/g, '-'),
+      version: '1.0.0',
+      description: 'Projet Ether',
+      main: 'dist/index.html',
+      scripts: {
+        dev: 'ether dev',
+        build: 'ether build'
+      },
+      keywords: ['ether'],
+      author: '',
+      license: 'MIT'
+    }
+    fs.writeFileSync(packageJsonPath, JSON.stringify(packageJson, null, 2))
+    logSuccess('Fichier package.json créé')
+  }
+
   const configContent = `module.exports = {
   src: './src',
   out: './dist',
   
   i18n: 'fr',
+  port: 3000,
   
   targets: {
     css: {
@@ -188,29 +367,379 @@ async function cmdInit() {
     logWarning('ether.config.js existe déjà')
   }
 
-  const exampleEth = `// cible: html
+  const exampleHtml = `// cible: html
 
 document
   tete
-    titre "Ma première page Ether"
+    meta charset: "UTF-8"
+    meta name: "viewport", content: "width=device-width, initial-scale=1.0"
+    titre "Ether - Le langage intentionnel"
+    lien rel: "stylesheet", href: "styles.css"
   
   corps
-    entete
-      titre1 "Bienvenue sur Ether"
+    entete classe: "hero"
+      nav classe: "navbar"
+        div classe: "logo"
+          span classe: "logo-icon"
+            "◈"
+          span "Ether"
+        liste-non-ordonnee classe: "nav-links"
+          element-liste
+            lien href: "#features"
+              "Fonctionnalités"
+          element-liste
+            lien href: "#examples"
+              "Exemples"
+          element-liste
+            lien href: "#docs"
+              "Documentation"
+      
+      div classe: "hero-content"
+        titre1 classe: "hero-title"
+          "Écrivez du code"
+          saut-ligne
+          span classe: "gradient-text"
+            "comme vous pensez"
+        paragraphe classe: "hero-subtitle"
+          "Ether est un langage intentionnel qui compile vers HTML, CSS, JavaScript et plus encore. Naturel, intuitif, puissant."
+        div classe: "hero-buttons"
+          lien href: "#start", classe: "btn btn-primary"
+            "Commencer"
+          lien href: "#learn", classe: "btn btn-secondary"
+            "En savoir plus"
     
     principal
-      section
-        titre2 "Le langage intentionnel"
-        paragraphe "Ether permet d'écrire du code comme on pense."
-        
-    pied
-      paragraphe "Créé avec Ether"
+      section id: "features", classe: "features"
+        titre2 classe: "section-title"
+          "Pourquoi Ether ?"
+        div classe: "features-grid"
+          article classe: "feature-card"
+            div classe: "feature-icon"
+              "🎯"
+            titre3 "Intuitif"
+            paragraphe "Écrivez du code en langage naturel. Plus besoin de mémoriser des syntaxes complexes."
+          article classe: "feature-card"
+            div classe: "feature-icon"
+              "⚡"
+            titre3 "Rapide"
+            paragraphe "Compilation instantanée avec rechargement automatique en mode développement."
+          article classe: "feature-card"
+            div classe: "feature-icon"
+              "🌍"
+            titre3 "Multilingue"
+            paragraphe "Codez en français, anglais, espagnol et plus. Votre langue, votre code."
+          article classe: "feature-card"
+            div classe: "feature-icon"
+              "🔧"
+            titre3 "Flexible"
+            paragraphe "Compile vers HTML, CSS, JS, PHP, Python, SQL et bien d'autres langages."
+      
+      section id: "examples", classe: "examples"
+        titre2 classe: "section-title"
+          "Simple et élégant"
+        div classe: "code-comparison"
+          div classe: "code-block"
+            div classe: "code-header"
+              "Ether"
+            pre
+              code
+                "document\\n  corps\\n    titre1 \\"Bonjour\\"\\n    paragraphe \\"Le monde\\""
+          div classe: "code-arrow"
+            "→"
+          div classe: "code-block"
+            div classe: "code-header"
+              "HTML"
+            pre
+              code
+                "&lt;!DOCTYPE html&gt;\\n&lt;html&gt;\\n  &lt;body&gt;\\n    &lt;h1&gt;Bonjour&lt;/h1&gt;\\n    &lt;p&gt;Le monde&lt;/p&gt;\\n  &lt;/body&gt;\\n&lt;/html&gt;"
+    
+    pied classe: "footer"
+      paragraphe
+        "Créé avec"
+        span classe: "heart"
+          " ♥ "
+        "par la communauté Ether"
+      paragraphe classe: "copyright"
+        "© 2025 Ether. MIT License."
+    
+    script src: "app.js"
+`
+
+  const exampleCss = `// cible: css
+
+racine
+  couleur-primaire: "#6366f1"
+  couleur-secondaire: "#8b5cf6"
+  couleur-accent: "#06b6d4"
+  couleur-fond: "#0f0f23"
+  couleur-surface: "#1a1a2e"
+  couleur-texte: "#e2e8f0"
+  couleur-texte-pale: "#94a3b8"
+
+*
+  marge: 0
+  remplissage: 0
+  modele-boite: border-box
+
+corps
+  famille-police: "system-ui", "-apple-system", "sans-serif"
+  couleur-fond: var(--couleur-fond)
+  couleur: var(--couleur-texte)
+  hauteur-ligne: 1.6
+
+.hero
+  min-hauteur: 100vh
+  fond: "linear-gradient(135deg, var(--couleur-fond) 0%, var(--couleur-surface) 100%)"
+  position: relative
+  debordement: cache
+
+.navbar
+  affichage: flex
+  justifier-contenu: space-between
+  aligner-elements: center
+  remplissage: "1.5rem 5%"
+  position: fixed
+  largeur: 100%
+  haut: 0
+  z-index: 100
+  fond: "rgba(15, 15, 35, 0.9)"
+  flou-fond: "10px"
+
+.logo
+  affichage: flex
+  aligner-elements: center
+  espace: "0.5rem"
+  taille-police: "1.5rem"
+  poids-police: 700
+
+.logo-icon
+  taille-police: "2rem"
+  couleur: var(--couleur-primaire)
+
+.nav-links
+  affichage: flex
+  liste-style: none
+  espace: "2rem"
+
+.nav-links lien
+  couleur: var(--couleur-texte-pale)
+  decoration-texte: none
+  transition: "couleur 0.3s"
+  au survol
+    couleur: var(--couleur-primaire)
+
+.hero-content
+  texte-aligne: center
+  remplissage: "12rem 5% 5rem"
+  max-largeur: "800px"
+  marge: "0 auto"
+
+.hero-title
+  taille-police: "3.5rem"
+  poids-police: 800
+  marge-bas: "1.5rem"
+  hauteur-ligne: 1.2
+
+.gradient-text
+  fond: "linear-gradient(90deg, var(--couleur-primaire), var(--couleur-accent))"
+  decoupe-fond: text
+  couleur: transparent
+
+.hero-subtitle
+  taille-police: "1.25rem"
+  couleur: var(--couleur-texte-pale)
+  marge-bas: "2.5rem"
+  max-largeur: "600px"
+  marge-gauche: auto
+  marge-droite: auto
+
+.hero-buttons
+  affichage: flex
+  espace: "1rem"
+  justifier-contenu: center
+
+.btn
+  remplissage: "0.875rem 2rem"
+  rayon-bordure: "0.5rem"
+  taille-police: "1rem"
+  poids-police: 600
+  decoration-texte: none
+  transition: "transform 0.2s, box-shadow 0.2s"
+  au survol
+    transformation: "translateY(-2px)"
+
+.btn-primary
+  fond: "linear-gradient(90deg, var(--couleur-primaire), var(--couleur-secondaire))"
+  couleur: white
+  au survol
+    ombre-boite: "0 10px 30px rgba(99, 102, 241, 0.4)"
+
+.btn-secondary
+  fond: transparent
+  couleur: var(--couleur-texte)
+  bordure: "2px solid var(--couleur-primaire)"
+  au survol
+    fond: "rgba(99, 102, 241, 0.1)"
+
+.features
+  remplissage: "6rem 5%"
+
+.section-title
+  texte-aligne: center
+  taille-police: "2.5rem"
+  marge-bas: "3rem"
+
+.features-grid
+  affichage: grid
+  colonnes-grille: "repeat(auto-fit, minmax(250px, 1fr))"
+  espace: "2rem"
+  max-largeur: "1200px"
+  marge: "0 auto"
+
+.feature-card
+  fond: var(--couleur-surface)
+  remplissage: "2rem"
+  rayon-bordure: "1rem"
+  texte-aligne: center
+  transition: "transform 0.3s"
+  au survol
+    transformation: "translateY(-5px)"
+
+.feature-icon
+  taille-police: "3rem"
+  marge-bas: "1rem"
+
+.feature-card titre3
+  marge-bas: "0.75rem"
+  taille-police: "1.25rem"
+
+.feature-card paragraphe
+  couleur: var(--couleur-texte-pale)
+
+.examples
+  remplissage: "6rem 5%"
+  fond: var(--couleur-surface)
+
+.code-comparison
+  affichage: flex
+  aligner-elements: center
+  justifier-contenu: center
+  espace: "2rem"
+  flex-wrap: wrap
+  max-largeur: "1000px"
+  marge: "0 auto"
+
+.code-block
+  fond: var(--couleur-fond)
+  rayon-bordure: "0.75rem"
+  debordement: cache
+  min-largeur: "300px"
+
+.code-header
+  fond: "rgba(99, 102, 241, 0.2)"
+  remplissage: "0.75rem 1rem"
+  poids-police: 600
+  couleur: var(--couleur-primaire)
+
+.code-block pre
+  remplissage: "1.5rem"
+  marge: 0
+
+.code-block code
+  famille-police: "Fira Code", "Monaco", monospace
+  taille-police: "0.9rem"
+  blanc: pre
+
+.code-arrow
+  taille-police: "2rem"
+  couleur: var(--couleur-primaire)
+
+.footer
+  texte-aligne: center
+  remplissage: "3rem 5%"
+  fond: var(--couleur-fond)
+
+.heart
+  couleur: "#ef4444"
+
+.copyright
+  marge-haut: "0.5rem"
+  couleur: var(--couleur-texte-pale)
+  taille-police: "0.875rem"
+
+@media (max-largeur: 768px)
+  .hero-title
+    taille-police: "2.5rem"
+  .nav-links
+    affichage: none
+  .code-arrow
+    transformation: "rotate(90deg)"
+`
+
+  const exampleJs = `// cible: js
+
+constante annee = nouveau Date().getFullYear()
+
+fonction initialiser()
+  constante copyright = document.querySelector(".copyright")
+  si copyright
+    copyright.textContent = "© " + annee + " Ether. MIT License."
+  
+  constante liens = document.querySelectorAll("a[href^='#']")
+  pour chaque lien dans liens
+    lien.addEventListener "click", fonction(e)
+      e.preventDefault()
+      constante cible = document.querySelector(this.getAttribute("href"))
+      si cible
+        cible.scrollIntoView({ behavior: "smooth" })
+
+document.addEventListener "DOMContentLoaded", initialiser
 `
 
   const examplePath = path.join(srcDir, 'index.eth')
   if (!fs.existsSync(examplePath)) {
-    fs.writeFileSync(examplePath, exampleEth)
-    logSuccess('Fichier exemple src/index.eth créé')
+    fs.writeFileSync(examplePath, exampleHtml)
+    logSuccess('Fichier src/index.eth créé')
+  }
+  
+  const cssPath = path.join(srcDir, 'styles.eth')
+  if (!fs.existsSync(cssPath)) {
+    fs.writeFileSync(cssPath, exampleCss)
+    logSuccess('Fichier src/styles.eth créé')
+  }
+  
+  const jsPath = path.join(srcDir, 'app.eth')
+  if (!fs.existsSync(jsPath)) {
+    fs.writeFileSync(jsPath, exampleJs)
+    logSuccess('Fichier src/app.eth créé')
+  }
+
+  const logoSvg = `<?xml version="1.0" encoding="UTF-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 499 500">
+  <defs>
+    <linearGradient id="g1" gradientUnits="userSpaceOnUse" x1="1.106" y1="250.0527" x2="498.8623" y2="250.0527">
+      <stop offset="0" style="stop-color:#03AFC6"/><stop offset="0.5126" style="stop-color:#31BAD3"/><stop offset="1" style="stop-color:#3EC4DD"/>
+    </linearGradient>
+    <linearGradient id="g2" gradientUnits="userSpaceOnUse" x1="56.332" y1="250.0532" x2="470.3037" y2="250.0532">
+      <stop offset="0" style="stop-color:#4758A7"/><stop offset="0.2597" style="stop-color:#6F53A2"/><stop offset="0.5939" style="stop-color:#924A9D"/><stop offset="0.8518" style="stop-color:#A64399"/><stop offset="1" style="stop-color:#AE4097"/>
+    </linearGradient>
+    <linearGradient id="g3" gradientUnits="userSpaceOnUse" x1="144.1313" y1="289.1055" x2="448.2786" y2="147.2793">
+      <stop offset="0" style="stop-color:#5E6AB2"/><stop offset="0.1138" style="stop-color:#5A77B7"/><stop offset="0.4161" style="stop-color:#4D96C8"/><stop offset="0.6753" style="stop-color:#3DADD5"/><stop offset="0.8782" style="stop-color:#30BBDD"/><stop offset="1" style="stop-color:#24C1E1"/>
+    </linearGradient>
+    <linearGradient id="g4" gradientUnits="userSpaceOnUse" x1="223.2749" y1="258.8877" x2="387.1369" y2="182.4776">
+      <stop offset="0" style="stop-color:#5E6AB2"/><stop offset="0.1138" style="stop-color:#5A77B7"/><stop offset="0.4161" style="stop-color:#4D96C8"/><stop offset="0.6753" style="stop-color:#3DADD5"/><stop offset="0.8782" style="stop-color:#30BBDD"/><stop offset="1" style="stop-color:#24C1E1"/>
+    </linearGradient>
+  </defs>
+  <path fill="url(#g1)" d="M5.381,238.563c-5.468-13.48-5.838-18.365-0.256-29.006c5.582-10.641,129.113-178.821,157.852-196.679C191.716-4.979,414.415,0.938,431.034,1.795c16.621,0.856,39.463,3.869,45.858,10.234c6.395,6.365,10.242,8.502,12.175,17.908c1.932,9.406,7.304,45.665,8.664,91.185c1.362,45.521,1.822,152.92-0.505,186.578c-2.325,33.658-1.465,47.184-14.553,67.173c-13.089,19.987-218.044,111.611-232.689,117.413c-14.646,5.801-35.404,16.623-62.205-6.569C160.979,462.526,5.381,238.563,5.381,238.563z"/>
+  <path fill="url(#g2)" d="M291.136,436.653c-7.71,3.354-52.39,24.228-61.917,23.915c-10.871-0.359-16.045-4.679-36.578-31.196C157.484,383.969,67.434,258.436,60.702,243.983c-5.766-12.377-6.472-19.474,1.826-32.931c8.299-13.456,105.229-151.605,117.666-160.906c12.648-9.458,23.041-10.032,35.5-10.188c55.329-0.694,152.766-0.725,225.992,1.368c16.294,0.466,24.063,11.799,24.653,21.583c5.707,94.576,6.6,150.435-6.481,266.374c-3.107,27.537-16.15,39.634-36.553,49.895C402.604,389.586,301.741,432.036,291.136,436.653z"/>
+  <path fill="url(#g3)" d="M397.598,278.148c2.596,0.083,3.073,1.179,3.474,1.965c0.642,1.265,0.51,3.642-0.264,5.969c-0.545,1.638-10.225,33.388-13.646,43.11c-1.364,3.871-2.896,4.9-5.702,6.357c-2.692,1.396-132.598,52.559-143.222,56.099c-6.013,2.006-6.541,0.742-9.292-1.695c-2.749-2.437-107.08-151.266-109.972-155.301c-2.893-4.034-1.419-6.227-0.711-7.854c1.636-3.759,78.848-110.176,84.417-116.574c5.57-6.398,8.097-8.37,12.46-11.03c2.771-1.689,5.406-3.374,11.53-3.739c12.276-0.731,183.793-0.426,192.787,0.333c4.049,0.342,7.233,1.441,6.384,6.319c-0.853,4.879-9.874,46.584-8.671,43.199c1.204-3.385-1.01,5.33-8.432,5.348c-7.422,0.02-153.731,0-157.729,0.039c-6.107,0.06-6.991,0.443-7.952,1.426c-2.176,2.226-54.269,71.788-57.427,75.836c-3.157,4.048-2.247,5.316,1.448,9.065c3.695,3.748,69.606,62.824,69.606,62.824s-10.604-21.547-8.459-21.547"/>
+  <path fill="url(#g4)" d="M213.282,235.909c14.12-20.019,28.129-36.342,31.945-40.798c5.362-6.26,5.762-5.197,8.629-5.197c2.869,0,132.714,0.003,132.714,0.003s2.916-0.469,4.863,1.864c1.029,1.235-0.298,5.654-0.298,5.654l-9.552,40.332c0,0-1.318,5.72-6.366,5.649C334.696,242.847,208.748,250.903,213.282,235.909"/>
+</svg>`
+
+  const logoPath = path.join(imagesDir, 'Logo_Ether.svg')
+  if (!fs.existsSync(logoPath)) {
+    fs.writeFileSync(logoPath, logoSvg)
+    logSuccess('Fichier public/images/Logo_Ether.svg créé')
   }
 
   console.log('')
@@ -219,7 +748,7 @@ document
   logInfo('Prochaines étapes:')
   console.log(`  1. Éditer ${COLORS.cyan}src/index.eth${COLORS.reset}`)
   console.log(`  2. Lancer ${COLORS.cyan}ether dev${COLORS.reset} pour le mode développement`)
-  console.log(`  3. Ou ${COLORS.cyan}ether build${COLORS.reset} pour compiler`)
+  console.log(`  3. Ouvrir ${COLORS.cyan}http://localhost:3000${COLORS.reset} dans le navigateur`)
   console.log('')
 }
 
@@ -304,17 +833,32 @@ async function cmdDev(options) {
   const config = loadConfig(options.config)
   const srcDir = path.resolve(process.cwd(), config.src)
   const outDir = path.resolve(process.cwd(), options.output || config.out)
+  const port = options.port || config.port || 3000
   
   if (!fs.existsSync(srcDir)) {
     logError(`Dossier source introuvable: ${srcDir}`)
     process.exit(1)
   }
   
+  if (!fs.existsSync(outDir)) {
+    fs.mkdirSync(outDir, { recursive: true })
+  }
+  
   logInfo(`Surveillance de ${srcDir}`)
   logInfo(`Sortie vers ${outDir}`)
+  console.log('')
   
   await cmdBuild({ ...options, quiet: true })
   
+  let devServer = null
+  if (!options.noServer) {
+    devServer = createDevServer(outDir, port)
+  }
+  
+  console.log('')
+  logInfo('En attente de modifications... (Ctrl+C pour arrêter)')
+  console.log('')
+  
   const watcher = new Watcher(srcDir, config.watch)
   const compiler = new EtherCompiler(config)
   
@@ -338,6 +882,10 @@ async function cmdDev(options) {
         fs.writeFileSync(outPath, output.content)
         logSuccess(`→ ${output.path}`)
       }
+      
+      if (devServer) {
+        devServer.reload()
+      }
     } catch (err) {
       logError(err.message)
     }
@@ -363,6 +911,10 @@ async function cmdDev(options) {
         fs.writeFileSync(outPath, output.content)
         logSuccess(`→ ${output.path}`)
       }
+      
+      if (devServer) {
+        devServer.reload()
+      }
     } catch (err) {
       logError(err.message)
     }
@@ -379,6 +931,9 @@ async function cmdDev(options) {
     console.log('')
     logInfo('Arrêt du mode développement')
     watcher.stop()
+    if (devServer) {
+      devServer.close()
+    }
     process.exit(0)
   })
 }
@@ -457,9 +1012,11 @@ function parseArgs(args) {
     command: null,
     config: null,
     output: null,
+    port: null,
     verbose: false,
     quiet: false,
-    watch: false
+    watch: false,
+    noServer: false
   }
   
   let i = 0
@@ -470,6 +1027,8 @@ function parseArgs(args) {
       options.config = args[++i]
     } else if (arg === '-o' || arg === '--output') {
       options.output = args[++i]
+    } else if (arg === '-p' || arg === '--port') {
+      options.port = parseInt(args[++i], 10)
     } else if (arg === '-v' || arg === '--verbose') {
       options.verbose = true
     } else if (arg === '-q' || arg === '--quiet') {
@@ -480,6 +1039,8 @@ function parseArgs(args) {
       for (const key in COLORS) {
         COLORS[key] = ''
       }
+    } else if (arg === '--no-server') {
+      options.noServer = true
     } else if (!arg.startsWith('-')) {
       if (!options.command) {
         options.command = arg

package/ether-parser.js

@@ -349,7 +349,13 @@ class EtherParser {
       'html': 'html',
       'document': 'html',
       'tete': 'head',
-      'titre': 'h1',
+      'titre': 'title',
+      'titre1': 'h1',
+      'titre2': 'h2',
+      'titre3': 'h3',
+      'titre4': 'h4',
+      'titre5': 'h5',
+      'titre6': 'h6',
       'paragraphe': 'p',
       'lien': 'a',
       'image': 'img',
@@ -871,7 +877,7 @@ class EtherParser {
       'section': 'section',
       'article': 'article',
       'cote': 'aside',
-      'titre': 'h1',
+      'titre': 'title',
       'titre1': 'h1',
       'titre2': 'h2',
       'titre3': 'h3',

package/generators/html-generator.js

@@ -374,6 +374,7 @@ class HTMLGenerator {
     switch (node.type) {
       case 'Document':
       case 'document':
+        this.output += '<!DOCTYPE html>\n'
         if (node.children) {
           for (const child of node.children) {
             this.generateNode(child)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ether-code",
-  "version": "0.2.0",
+  "version": "0.2.3",
   "description": "Ether - Le langage intentionnel",
   "main": "cli/compiler.js",
   "bin": {