color scheme - theme - ¿Cómo agregar tema en Visual Studio Code?

visual studio code themes

Question

Recientemente descargué el editor de código VS, que es realmente agradable. pero el único problema que encuentro en él es el tema de color, uso el tema de color monokai como en el texto sublime y no puedo encontrar la manera de editar el tema de color o descargar un tema de color; solo hay 2 opciones:

1. Tema oscuro
2. Tema de luz

¿Cómo puedo agregar mi propio tema o duplicar uno existente para poder editar el esquema de color como quiero?

Me las arreglé para cambiar algunos de los colores en el siguiente archivo, pero aún no sé cómo agregar un tema completamente nuevo:

resources/app/client/vs/monaco/ui/workbench/native/native.main.css

Parece que los temas de color estarán disponibles pronto y formarán parte de un sistema de complementos

visual-studio-code/suggestions/7756227-theme

Answer 1

Ahora no se admite agregar un tema completamente nuevo. Puede enviar sus solicitudes de funciones aquí, ya escuché a la gente preguntando por este https://visualstudio.uservoice.com/forums/293070-visual-studio-code

Answer 2

Descubrí que el archivo - resources / app / client / vs / monaco / ui / workbench / native / native.main.css - también es el lugar adecuado para cambiar la forma en que se crean las fuentes. Estaba tratando de averiguar cómo desactivar el suavizado de fuentes en OS X y encontré que puedes hacerlo aquí agregando esta regla CSS en el archivo -

.monaco-editor {
-webkit-font-smoothing: none;
}

Answer 3

Visual Studio Code 0.9.0 y posterior

Hay una documentación oficial sobre cómo agregar un tema personalizado: https://github.com/Microsoft/vscode-docs/blob/0.9.0/release-notes/latest.md

Necesita un archivo .tmtheme para el tema que desea agregar. Puede encontrar archivos existentes, por ejemplo, en GitHub, ColorSublime o puede definir su propio archivo de tema (por ejemplo, con https://github.com/aziz/tmTheme-Editor ).

Después de encontrar un archivo .tmtheme , tiene dos formas de crear una extensión basada en él.

Opción 1: usar un generador Yeoman

• Instalar node.js (si aún no lo has hecho)
• Instálelo (si aún no lo ha hecho) ejecutando npm install -g yo
• Instale el generador Yo para el código: npm install -g generator-code
• Ejecuta tu yo code y selecciona New Color Theme
• Siga las instrucciones (defina el archivo .tmTheme , el nombre del tema, el tema ui, etc.)
• El generador crea un directorio para su extensión con el nombre del tema en su directorio de trabajo actual.

Opción 2: crea el directorio por tu cuenta

• Crea un directorio con el nombre de tu complemento (solo minúsculas). Digamos que lo llamamos mytheme .
• Agregue un themes subcarpeta y coloque el archivo .tmTheme dentro de él

• Cree un archivo package.json dentro de la raíz de la carpeta de extensiones con contenido como este

  {
  "name": "theme-mytheme",
  "version": "0.0.1",
  "engines": {
  "vscode": ">=0.9.0-pre.1"
  },
  "publisher": "me",
  "contributes": {
  "themes": [
  {
  "label": "My Theme",
  "uiTheme": "vs-dark", // use "vs" to select the light UI theme
  "path": "./themes/mytheme.tmTheme"
  }
  ]
  }
  }

Finalmente agregue su extensión al código de Visual Studio

Copie la carpeta de extensiones al directorio de extensiones. Esto es:

• en Windows %USERPROFILE%/.vscode/extensions

• en Mac / Linux $HOME/.vscode/extensions

Reinicie VSCode y seleccione el nuevo tema en File -> Preferences -> Color Theme

Visual Studio Code 0.8.0

Es posible agregar nuevos temas en Visual Studio Code 0.8.0 (lanzado para los iniciados en 2015-08-31 [conviértase en un conocedor: https://www.instant.ly/s/Y5nt1/nav#p/186a0] ).

Después de instalar VSCode 0.8.0 o superior, haga esto para aplicar su propio tema:

1. Descargue un archivo .tmTheme o cree uno propio (por ejemplo, con https://github.com/aziz/tmTheme-Editor )
2. Copie el archivo .tmTheme a %CODEFOLDER%/resources/app/plugins/vs.theme.starterkit/themes

3. Registre el archivo .tmTheme en %CODEFOLDER%/resources/app/plugins/vs.theme.starterkit/ticino.plugin.json agregando una entrada para este como sigue:

   {
   "id": "vs-theme-mynewtheme", // internal ID
   "label": "MyNewTheme", // displayed name for the theme
   "uiTheme": "vs-dark", // general UI appeareance (
   // "vs" for light themes,
   // "vs-dark" for dark themes)
   "path": "./themes/myNewTheme.tmTheme" // file path
   },

4. Reinicie VSCode y seleccione el nuevo tema en File -> Preferences -> Color Theme