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 traductionCode source (src/)
CoreBundle
Le plus grand bundle. Sous-répertoires notables :
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 :
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 :
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
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.
Mis à jour
Ce contenu vous a-t-il été utile ?