# JSON Editor JSON Editor is a web-based tool to view, edit, format, and validate JSON. It has various modes such as a tree editor, a code editor, and a plain text editor. The editor can be used as a component in your own web application. The library can be loaded as CommonJS module, AMD module, or as a regular javascript file. Supported browsers: Chrome, Firefox, Safari, Opera, Internet Explorer 9+. json editor   code editor ## Features ### Tree editor - Edit, add, move, remove, and duplicate fields and values. - Change type of values. - Sort arrays and objects. - Colorized code. - Search & highlight text in the tree view. - Undo and redo all actions. - JSON schema validation (powered by [ajv](https://github.com/epoberezkin/ajv)). ### Code editor - Colorized code (powered by [Ace](https://ace.c9.io)). - Inspect JSON (powered by [Ace](https://ace.c9.io)). - Format and compact JSON. - JSON schema validation (powered by [ajv](https://github.com/epoberezkin/ajv)). ### Text editor - Format and compact JSON. - JSON schema validation (powered by [ajv](https://github.com/epoberezkin/ajv)). ## Documentation - Documentation: - [API](https://github.com/josdejong/jsoneditor/tree/master/docs/api.md) - [Usage](https://github.com/josdejong/jsoneditor/tree/master/docs/usage.md) - [Shortcut keys](https://github.com/josdejong/jsoneditor/tree/master/docs/shortcut_keys.md) - [Examples](https://github.com/josdejong/jsoneditor/tree/master/examples) - [Source](https://github.com/josdejong/jsoneditor) - [History](https://github.com/josdejong/jsoneditor/blob/master/HISTORY.md) ## Install with npm (recommended): npm install jsoneditor with bower: bower install jsoneditor #### More There is a directive available for using `jsoneditor` in Angular.js: [https://github.com/angular-tools/ng-jsoneditor](https://github.com/angular-tools/ng-jsoneditor) ## Use ```html
``` ## Build The code of the JSON Editor is located in the folder `./src`. To build jsoneditor: - Install dependencies: ``` npm install ``` - Build JSON Editor: ``` npm run build ``` This will generate the file `./dist/jsoneditor.js` and `./dist/jsoneditor-minimalist.js` and corresponding source maps. - To automatically build when a source file has changed: ``` npm start ``` This will update `./dist/jsoneditor.js` on every change in the source code, but it will **NOT** update the minimalist version.