很完善的一款网页版JSON编辑器源码 需要的自取

---

一、详细介绍

JSON 编辑器是一个基于 Web 的工具，用于查看、编辑、格式化和验证 JSON。它具有树编辑器、代码编辑器和纯文本编辑器等多种模式。编辑器可以用作您自己的 Web 应用程序中的组件。它可以作为 CommonJS 模块、AMD 模块或常规 javascript 文件加载。

支持所有主流浏览器：等…。

JSON 编辑器是一个基于 Web 的工具，用于查看、编辑、格式化和验证 JSON。它具有树编辑器、代码编辑器和纯文本编辑器等多种模式。编辑器可以用作您自己的 Web 应用程序中的组件。它可以作为 CommonJS 模块、AMD 模块或常规 javascript 文件加载。

JSONEditor 具有多种模式，具有以下功能。

更改、添加、移动、删除和复制字段和值。

对数组和对象进行排序。

转换 JSON 使用 JMESPath 查询

彩色代码。

颜色选择器。

在树视图中搜索并突出显示文本。

撤消并重做所有操作。

JSON 架构验证（由 ajv 提供支持）。

代码模式

彩色代码（由 Ace 提供支持）。

检查 JSON（由 Ace 提供支持）。

格式化和紧凑的 JSON。

修复 JSON。

JSON 架构验证（由 ajv 提供支持）。

文本模式

格式化和紧凑的 JSON。

修复 JSON。

预览模式

处理最大 500 MiB 的大型 JSON 文档。

转换 JSON 使用 JMESPath 查询

格式化和紧凑的 JSON。

修复 JSON。

二、效果展示

1.部分代码

代码如下（示例）：

const fs = require('fs')
const path = require('path')
const gulp = require('gulp')
const log = require('fancy-log')
const format = require('date-format')
const concatCss = require('gulp-concat-css')
const minifyCSS = require('gulp-clean-css')
const sass = require('gulp-sass')(require('sass'))
const { mkdirp } = require('mkdirp')
const webpack = require('webpack')
const uglify = require('uglify-js')
const btoa = require('btoa')

const NAME = 'jsoneditor'
const NAME_MINIMALIST = 'jsoneditor-minimalist'
const ENTRY = './src/js/JSONEditor.js'
const HEADER = './src/js/header.js'
const IMAGE = './src/scss/img/jsoneditor-icons.svg'
const DOCS = './src/docs/*'
const DIST = path.join(__dirname, 'dist')

// generate banner with today's date and correct version
function createBanner () {
  const today = format.asString('yyyy-MM-dd', new Date()) // today, formatted as yyyy-MM-dd
  const version = require('./package.json').version // math.js version

  return String(fs.readFileSync(HEADER))
    .replace('@@date', today)
    .replace('@@version', version)
}

2.效果图展示

---