Ctrlk
Modifier

Structure du projet

Répertoires de niveau supérieur

chamilo/
├── assets/          # Code source frontend
│   ├── vue/         # Application Vue 3 (composants, vues, routeur, stores)
│   ├── css/         # Feuilles de style SCSS
│   └── js/          # JavaScript legacy
├── config/          # Configuration Symfony (routes, services, packages)
├── public/          # Racine web (index.php, pages PHP legacy, plugins)
│   ├── main/        # Modules PHP legacy (un sous-répertoire par outil)
│   └── plugin/      # Plugins intégrés et personnalisés
├── src/             # Code source PHP (bundles Symfony)
│   ├── CoreBundle/  # Logique de la plateforme principale
│   ├── CourseBundle/# Fonctionnalités spécifiques aux cours
│   └── LtiBundle/   # Intégration LTI 1.3
├── templates/       # Modèles Twig
├── var/             # Cache, journaux, téléversements (généré)
├── vendor/          # Dépendances Composer (généré)
├── node_modules/    # Dépendances npm (généré)
└── translations/    # Fichiers de traduction

Code source (src/)

CoreBundle

Le plus grand bundle. Sous-répertoires notables :

Répertoire
Contenu

Entity/

Entités Doctrine (User, Course, Session, ResourceNode, etc.)

Controller/

Contrôleurs d'administration, d'actions API et de pages (le sous-dossier Api/ contient des actions personnalisées pour API Platform)

Settings/

Fichiers de schéma de configuration (configuration de la plateforme)

Repository/

Référentiels Doctrine

AiProvider/

Implémentations de fournisseurs d'IA (OpenAI, Gemini, Mistral, DeepSeek, Grok)

Tool/

Définitions des outils de cours

Security/

Voters, authentificateurs, autorisation

EventListener/

Écouteurs d'événements

EventSubscriber/

Abonnés aux événements

Command/

Commandes de console Symfony

Migrations/

Migrations de base de données

Twig/

Extensions Twig

Storage/

Adaptateurs de stockage Flysystem

CourseBundle

Entités et logique spécifiques aux cours :

Répertoire
Contenu

Entity/

Entités de contenu de cours (CDocument, CQuiz, CLp, CForum, CStudentPublication, etc.)

Controller/

Contrôleurs de cours

Settings/

Schémas de configuration au niveau des cours

Component/CourseCopy/

Import/export de cours (Common Cartridge, Moodle)

LtiBundle

Intégration LTI 1.3 :

Répertoire
Contenu

Entity/

Entités de plateforme, d'outil et de déploiement LTI

Controller/

Points de terminaison de lancement et de configuration LTI

Frontend (assets/vue/)

Configuration (config/)

Symfony fusionne automatiquement les fichiers de base packages/*.yaml avec ceux du sous-répertoire correspondant à l'environnement (dev/, prod/, ou test/), de sorte que les fichiers spécifiques à un environnement n'ont besoin de surcharger que les valeurs qui diffèrent.

Configuration de la compilation

Fichier
Objectif

webpack.config.js

Configuration de Webpack Encore (entrées, chargeurs, plugins)

tailwind.config.js

Configuration de Tailwind CSS (chemins de contenu, extensions de thème, plugins)

tsconfig.json

Configuration de TypeScript

eslint.config.mjs

Règles d'ESLint (configuration plate)

.prettierrc.json

Règles de formatage de Prettier

Tous les fichiers se trouvent à la racine du projet. Les plugins PostCSS (Tailwind + Autoprefixer) sont configurés directement dans webpack.config.js via enablePostCssLoader() — il n'y a pas de fichier indépendant postcss.config.js. Le fichier webpack.config.js lit tailwind.config.js indirectement via PostCSS, donc les modifications apportées aux sections content ou theme de Tailwind prennent effet lors de la prochaine exécution de yarn encore dev / yarn encore production.

Points d'entrée Webpack

La compilation produit ces bundles :

JavaScript :

  • vue — Application principale Vue 3 (assets/vue/main.js)

  • vue_installer — Assistant d'installation (assets/vue/main_installer.js)

  • legacy_app, legacy_exercise, legacy_lp, legacy_document — JS legacy pour les pages non encore migrées vers Vue

CSS :

  • app — Feuille de style principale (assets/css/app.scss)

  • Plus des feuilles spécialisées : chat, document, editor, editor_content, markdown, print, responsive, scorm

Structure CSS (assets/css/)

Tailwind CSS

Tailwind est intégré via PostCSS. assets/css/_tailwind.scss génère les couches de base, de composants et d'utilitaires ; assets/css/app.scss l'importe en premier afin que les utilitaires Tailwind soient disponibles dans tous les autres partiels. La configuration de Tailwind — chemins de contenu pour le nettoyage, extensions de thème et plugins — se trouve dans tailwind.config.js à la racine du projet (/var/www/chamilo/tailwind.config.js).

Les classes utilitaires personnalisées et les classes de composants définies avec @layer (visibles dans app.scss) suivent la convention de superposition de Tailwind afin que les classes définies par l'utilisateur respectent les mêmes règles de spécificité que les utilitaires générés.

Thèmes de couleurs

Chamilo prend en charge un système de thématisation des couleurs qui peut être configuré directement depuis l'interface d'administration (Administration > Thèmes de couleurs). Chaque thème enregistré écrit ses fichiers dans un répertoire dédié sous var/themes/ :

colors.css définit les propriétés CSS personnalisées sous forme de triplets de canaux RVB séparés par des espaces plutôt que des valeurs rgb(), ce qui permet à Tailwind de composer des variantes d'opacité (par ex. bg-primary/50) sans configuration supplémentaire :

La couche de thème se superpose au bundle Tailwind/SCSS compilé : le navigateur charge colors.css après la feuille de style principale, de sorte que les modifications de thème prennent effet immédiatement sans étape de compilation.

PrécédentConfiguration du développementSuivantBackend

Mis à jour

Ce contenu vous a-t-il été utile ?