monaco editor
v0.52.2
L'éditeur de Monaco est l'éditeur de code entièrement présenté de VS Code. Consultez les documents de code vs pour voir certaines des fonctionnalités prises en charge.
Essayez l'éditeur et voyez divers exemples dans notre terrain de jeu interactif.
Le terrain de jeu est la meilleure façon de savoir comment utiliser l'éditeur, quelles fonctionnalités sont les supports, d'essayer différentes versions et de créer des exemples reproductibles minimaux pour les rapports de bogues.
> npm install monaco-editor
Vous obtiendrez:
/esm : version ESM de l'éditeur (compatible avec EG WebPack)/dev : AMD groupé, non minifié/min : AMD groupé et minifié/min-maps : cartes source pour minmonaco.d.ts : Cela spécifie l'API de l'éditeur (c'est ce qui est réellement versé, tout le reste est considéré comme privé et pourrait rompre avec n'importe quelle version). Il est recommandé de se développer contre la version dev et en production pour utiliser la version min .
Monaco Editor est surtout connu pour être l'éditeur de texte qui alimente le code. Cependant, c'est un peu plus nuancé. Une certaine compréhension de base des concepts sous-jacentes est nécessaire pour utiliser efficacement l'éditeur Monaco.
Les modèles sont au cœur de l'éditeur de Monaco. C'est ce que vous interagissez lors de la gestion du contenu. Un modèle représente un fichier ouvert. Cela pourrait représenter un fichier qui existe sur un système de fichiers, mais il n'est pas nécessaire. Par exemple, le modèle détient le contenu texte, détermine la langue du contenu et suit l'historique d'édition du contenu.
Chaque modèle est identifié par un URI. C'est pourquoi il n'est pas possible que deux modèles aient le même URI. Idéalement, lorsque vous représentez le contenu dans monaco Editor, vous devez penser à un système de fichiers virtuel qui correspond aux fichiers que vos utilisateurs modifient. Par exemple, vous pouvez utiliser file:/// comme chemin de base. Si un modèle est créé sans URI, son URI sera inmemory://model/1 . Le nombre augmente à mesure que davantage de modèles sont créés.
Un éditeur est une vue face à l'utilisateur du modèle. C'est ce qui est attaché au DOM et à ce que vos utilisateurs voient visuellement. Les opérations typiques de l'éditeur affichent un modèle, géraient l'état de vue ou exécutent des actions ou des commandes.
Les fournisseurs fournissent des fonctionnalités éditeurs intelligentes. Par exemple, cela inclut les informations d'achèvement et de survol. Ce n'est pas la même chose que, mais les caractéristiques des fonctionnalités du protocole de serveur de langage.
Les fournisseurs travaillent sur les modèles. Certaines fonctionnalités intelligentes dépendent du fichier URI. Par exemple, pour que TypeScript résolve les importations, ou pour JSON Intellisense pour déterminer quel schéma JSON s'appliquer à quel modèle. Il est donc important de choisir les uris modèles appropriés.
De nombreux objets liés à Monaco implémentent souvent la méthode .dispose() . Cette méthode est destinée à effectuer des nettoyages lorsqu'une ressource n'est plus nécessaire. Par exemple, l'appel model.dispose() le désinscritra, libérant l'URI pour un nouveau modèle. Les éditeurs doivent être disposés pour libérer des ressources et supprimer leurs auditeurs de modèle.
monaco.d.ts .Créez des problèmes dans ce référentiel pour tout ce qui concerne l'éditeur de Monaco. Veuillez rechercher les problèmes existants pour éviter les doublons.
❓ Quelle est la relation entre le code vs et l'éditeur Monaco?
L'éditeur de Monaco est généré directement à partir des sources de VS Code avec quelques cales autour des services dont le code a besoin pour le faire s'exécuter dans un navigateur Web en dehors de sa maison.
❓ Quelle est la relation entre la version de VS Code et la version de l'éditeur Monaco?
Aucun. L'éditeur Monaco est une bibliothèque et il reflète directement le code source.
❓ J'ai écrit une extension pour VS Code, cela fonctionnera-t-il sur l'éditeur Monaco dans un navigateur?
Non.
Remarque: Si l'extension est entièrement basée sur le LSP et que si le serveur de langue est rédigé dans JavaScript, ce serait possible.
❓ Pourquoi tous ces employés du Web et pourquoi devrais-je m'en soucier?
Les services linguistiques créent des travailleurs Web pour calculer des choses lourdes en dehors du fil d'interface utilisateur. Ils ne coûtent pratiquement rien en termes de frais généraux de ressources et vous ne devriez pas trop vous inquiéter à leur sujet, tant que vous les faites travailler (voir ci-dessus dans le cas du domaine croisé).
❓ Quel est ce loader.js ? Puis-je utiliser require.js ?
Il s'agit d'un chargeur AMD que nous utilisons dans VS Code. Oui.
❓ Je vois l'avertissement "ne pourrait pas créer de travailleur Web". Que dois-je faire?
HTML5 n'autorise pas les pages chargées sur file:// pour créer des travailleurs Web. Veuillez charger l'éditeur avec un serveur Web sur http:// ou https:// schémas.
❓ L'éditeur est-il pris en charge dans les navigateurs mobiles ou les frameworks d'applications Web mobiles?
Non.
❓ Pourquoi l'éditeur ne prend-il pas en charge les grammaires Textmate?
monaco-editor , vscode-oniguruma et vscode-textmate pour obtenir le support de grammaire TM dans l'éditeur. Nous accueillons des contributions de la communauté! Veuillez consulter la contribution pour que vous puissiez contribuer efficacement, comment vous pouvez exécuter l'éditeur à partir de sources et comment vous pouvez déboguer et résoudre les problèmes.
Ce projet a adopté le code de conduite open source Microsoft. Pour plus d'informations, consultez le code de conduite FAQ ou contactez [email protected] avec toute question ou commentaire supplémentaire.
Licencié sous la licence du MIT.
