/JS-Encoder

一个前端在线编辑器,且致力于成为一个方便、快速的在线 Web 实例开发、调试工具。使用 Vue3 和 Codemirror6 构建。

Primary LanguageTypeScriptMIT LicenseMIT

JS-Encoder

👉 A front-end code editor based on Vue.js and Codemirror 👈

English | 简体中文

1614658567_1_.png

The code in this figure comes from CodePen

Preview

open JS-Encoder

If you can't visit this site:

open by github page

Describe

JS-Encoder gets some inspiration from JSBin, CodePen and JSFiddle, JS-Encoder inspired by these three excellent online compilers, built with Vue.js and Codemirror.

Feature 🌟

  • Live preview.
  • Support for a variety of front-end languages and pre-processing languages. Currently supported preprocessing languages are:
    • Markdown
    • Pug
    • Sass/Scss
    • Less
    • Stylus
    • TypeScript
    • CoffeeScript
    • JSX(Babel)
  • Support for external scripts and styles.
  • Local storage, where you can save code on the compiler locally, currently supports three forms:
    • Single file: A file include HTML, CSS and JS named index.html.
    • Zip: A zip file include HTML file, CSS file and JS file.
    • Preprocessing files: if you are using a preprocessing language, you can download a preprocessing language file that is not compiled.
  • File import, you can import the file from the local to the compiler, the compiler will automatically read the contents of the file and display in the edit window.
  • Support for multiple keyboard shortcuts, includes formatting, HTML Emmet extensions, and Markdown related shortcuts.
  • Add Markdown mode, support edit window and preview window real-time preview and synchronization scrolling, and join the shortcut menu bar.
  • Code Search.
  • CDN search, faster to add required CSS and JS external links(Powered by cdnjs).
  • Powerful console for displaying many common types of logs and debugging.
  • Code hinter.
  • Personalized settings.
  • linter for some languages.
  • Support for initializing templates, currently supported (vue2/3, React, Angular).

DOC(Chinese)

JS-Encoder 中文使用文档

Future ❓

  • rebuild, due to the new features of Vue3 and the support for TypeScript, JS-Encoder will be refactored after all dependent Vue plugins are compatible with Vue3.
  • Preprocessor support, JS-Encoder may support more front-end languages, such as component writing that supports Vue and React.
  • More personalized settings.

Support

If you want to support JS-Encoder, click star 💗 to support it!

LICENSE

The MIT LICENSE