2008-10-13 9 views
44

Todos hemos visto editores de texto enriquecido en el navegador, que le permiten editar texto de color/estilo de forma WYSIWYG. Pero, ¿qué pasa con los editores de código, que resaltan automáticamente el código según las reglas del lenguaje a medida que escribe? Piensa en Eclipse en un área de texto (pero sin el soporte de refactorización).¿Hay un buen editor de código en el navegador?

¿Existen tales cosas? Imagino que escalar sería un problema: archivos más grandes serían difíciles de editar eficientemente.

+4

Debe marcar estas preguntas como resueltas – Nitroware

+0

¿Algo que use paquetes de texto para definiciones de sintaxis y lenguaje? –

+0

@BillyMoon Ambos [Ace] (https://github.com/ajaxorg/ace/wiki/Importing-.tmtheme-and-.tmlanguage-Files-into-Ace) y [Cloud9] (https: // cloud9-sdk .readme.io/docs/import-a-textmate-bundle) importar paquetes de TextMate. – niutech

Respuesta

8

La biblioteca de JavaScript editArea hace un muy buen trabajo. Es utilizado por el sistema de gestión de contenido OpenCMS ya que está en el lugar el editor JSP y JavaScript. La coloración se confunde un poco cuando el archivo es> 2000 líneas más o menos.

La lista de características de su página es:

  • Fácil de integrar, sólo una secuencia de comandos incluir y una llamada a la función
  • apoyo Tab (permiten escribir código fuente bien formateado)
  • Buscar y reemplazar (con regexp)
  • de sintaxis personalizable en tiempo real destacando (en la actualidad: PHP, CSS, Javascript, Python, HTML, XML, VB, C, CPP, SQL, Pascal, Basic, Brainf * ck)
  • sangrado automático nuevas líneas
  • la numeración de líneas
  • Soporte multilenguaje (en la actualidad: croata, danés, Inglés, Francés, alemán, italiano, japonés, polaco, portugués)
  • modo de pantalla completa
  • pueden trabajar en el mismo entorno que no sea "protype" y "mootools" como bibliotecas.
+0

Ese enlace no funcionó para mí ... creo que lo encontré aquí: http://www.cdolivet.com/index.php?page=editArea&sess=a360c094f88adf6d14a74197bdd1a182 –

+1

Mientras esto está ahora en git (https: // github.com/cdolivet/EditArea), ya no es compatible y también es vulnerable a XSS. –

1

Javascript VI, tiene algunos errores pero es una idea interesante. VI FTW!

+0

que no funciona en mi navegador ... quizás es porque estoy usando el plugin vimperator para FF. vim ftw! –

37

CodeMirror viene con soporte para más de 60 idiomas, y complementos que implementan funciones de edición más avanzadas (autocompletado, plegado de código, asociaciones de teclas configurables, búsqueda &, integración de reemplazo, etc.). Una rica API de programación y un sistema de sombreado de CSS están disponibles para personalizar CodeMirror y ampliarlo con nuevas funcionalidades.

Se ha desarrollado desde principios de 2007, tiene un Wikipedia page, y se está utilizando en una gran cantidad de proyectos populares de código abierto (Joomla, Firebug, etc.).

+1

parece exactamente lo que busco, gracias –

+0

CodeMirror es excelente y lo utiliza el patio de juegos API de Google: http://code.google.com/apis/ajax/playground/ –

+0

no tiene ni siquiera el código básico completado (como dobles corchetes automáticos, etc.), la sangría no parece funcionar correctamente, no estoy seguro de que esta sea una gran opción ... (Acabo de probar su demostración en vivo) – Rick

1

Esta es una sugerencia de lado - pero yo uso el Firefox plugin "It's All Text!" para enviar mi texto-a áreas para la edición - todos los buenos márgenes de beneficio, buscando, etc.

Por supuesto, esto depende del usuario, y puede No se lanzará fácilmente a los visitantes, si esa es tu intención.

Sin embargo, tiendo a irritarme por las limitaciones de los editores en el navegador, de todos modos. (La forma capta así que mi Ck durante las ediciones todavía me pilla con la guardia baja ... [lo que significa que no editan todo en Emacs ...])

+0

Esto es realmente útil en realidad, creo que es una de las mejores opciones actualmente disponibles, para mí, estoy tratando de construir una interfaz IDE para que pueda hacer cosas como tener varias carpetas de archivos abiertas a la vez (odio desplazarme hacia arriba y hacia abajo en las carpetas), así que parece un ajuste perfecto, ya que puedes obtener el texto de un área de texto y editarlo con un editor externo – Rick

7

Bespin de Mozilla se veía muy interesante, pero el proyecto fue discontinued.

+0

. También vi a Bespin y tratando de implementar (solo la versión incrustada) y no puedo hacer que funcione, parece prometedor pero no tienen mucha documentación, así que tal vez no sea la mejor opción para empezar, ya que no puedo encontrar un foro de soporte o cualquier cosa para obtener comentarios sobre lo que podría estar haciendo mal – Rick

+1

Bespin se ha fusionado en [Ace] (http://ajaxorg.github.io/ace/) – niutech

1

Cloud9 parece interesante si eres un desarrollador de JavaScript.

Amy Editor es otro editor basado en navegador que he encontrado hoy - parece que está tratando de emular TextMate en el navegador - incluyendo paquetes y fragmentos - aunque el proyecto parece que probablemente esté muerto ... Homepage/Demo y source on GitHub

1

se puede extraer dockPHPStackHive para el desarrollo web (basado en CodeMirror). En este momento se apoya el desarrollo de HTML/CSS, pero estoy trabajando en vivo

Negación Javascript-ción, así ..: Soy el fundador en dockPHP :)

+0

: P buena auto promoción allí –

+0

se ve muy bien también, pero lo estoy realmente lo que buscas es solo un buen editor de texto como eclipse pero que puedes usar en tu navegador. algunas características pueden ser cuando presiona {inserta automáticamente} e inicia una nueva línea o algo. –

+1

jaja gracias .. En realidad estoy trabajando en la modernización de una parte principal de dockPHP ... También puedes mirar Nitrous.io ... de lo contrario, la opción más simple sería usar Codemirror para arreglar algo por ti mismo. Tienen un tutorial extenso ... y puedes controlar qué funciones habilitar. –

1

Uso codiad. Lo utilicé con PHP, JS y C. Características:

  • Soporte para más de 40 idiomas Plugin Biblioteca
  • Comprobación de errores & notificaciones
  • apoyo a los usuarios de Mutliple
  • división de pantalla del editor de redundancia
  • LocalStorage
  • Herramientas de búsqueda avanzada
  • Smart autocompletar
  • en tiempo real de edición colaborativa
  • Más de 20 temas de color de sintaxis
  • completamente de código abierto
  • fácilmente personalizado fuente
  • se ejecuta en su propio servidor
  • rápido Descargar copias de seguridad
  • máximo de pantalla editor espacio
  • i18n Idioma Soporte

http://codiad.com

Cuestiones relacionadas