官宣！XiangJsonCraft 2.0 正式版上线，纯JSON驱动的前端框架来了

官宣🎉！XiangJsonCraft 2.0 正式版上线，纯JSON驱动的前端框架来了

大家好，我是董翔，今天正式官宣：XiangJsonCraft 2.0 从一个不起眼的“寄人篱下”小npm包，蜕变为可独立部署、开箱即用的正式前端框架！经过无数次踩坑、调试和优化，终于实现全流程闭环，现在正式邀请所有前端开发者体验——Write JSON, Get a Website，用JSON写页面，从此告别繁琐的CSS/JS配置！

📌 框架蜕变历程（从“卖鱼佬”到“建工大佬”的前端版狂飙）

说起来有点搞笑，也有点感慨，XiangJsonCraft的起点特别简单：

最初它只是一个只有4个文件（index.html、config.json、package.json、renderJson.js）的小npm包，只能“寄人篱下”——安装到其他项目的node_modules里才能用，不仅体验糟糕，还可能和Vue等其他框架的服务器冲突，完全没一点“框架样”。

但经过一系列“渡劫式”改造（解决依赖缺失、路径拦截、全局变量暴露、打包配置、NPM发布报错等N个坑），它彻底逆袭：

• ✅ 有了专属脚手架create-xiangjsoncraft，一键创建独立项目

• ✅ 实现纯JSON驱动，样式、内容全靠config.json配置，零CSS/JS开发门槛

• ✅ 支持独立部署，自带启动脚本，一键启动服务器，浏览器无报错渲染

• ✅ 核心渲染逻辑稳定，自动注入样式、加载配置，新手也能快速上手

就像《狂飙》里的高启强，从底层一步步逆袭，现在的XiangJsonCraft，终于有了属于自己的“框架身份”✨

🔥 框架核心亮点（纯JSON驱动，主打一个简单高效）

XiangJsonCraft 2.0 最核心的理念就是「极简开发」，无需写一行CSS、JS（除非你想扩展），只需修改JSON配置，就能快速生成网页，适合前端新手、后端开发者、需要快速搭建静态页面的场景。

1. 零门槛上手，全程JSON操作

所有样式、内容都集中在config.json中，无需关注DOM结构、样式优先级，修改JSON就能实时刷新页面，示例配置如下（复制就能用）：

{"styles":{".title":{"fontSize":"2rem","color":"#2d3748","textAlign":"center","marginTop":"50px"},".content":{"fontSize":"1rem","lineHeight":"1.8","maxWidth":"800px","margin":"0 auto","padding":"20px"}},"content":{".title":{"value":"🎉 XiangJsonCraft 2.0 正式上线！","isHtml":false},".content":{"value":"纯JSON驱动的前端框架，Write JSON, Get a Website，告别繁琐配置，快速搭建静态页面～","isHtml":false}}}

2. 一键创建，开箱即用

自带专属脚手架，无需手动配置，3行命令就能完成项目创建、启动，全程无报错：

# 1. 一键创建项目（输入项目名即可）npmcreate xiangjsoncraft@latest my-xjc-app# 2. 进入项目目录cdmy-xjc-app# 3. 安装依赖+启动项目npminstall&&npmrun start

启动后访问http://localhost:3000，就能看到JSON渲染的页面，修改config.json刷新即可生效，开发效率直接拉满！

3. 独立部署，无依赖冲突

彻底解决最初“寄人篱下”的痛点，支持独立部署：

• 自带live-server启动脚本，无需额外配置服务器

• 核心渲染逻辑打包为UMD格式，兼容所有浏览器

• 不依赖其他前端框架，单独运行无冲突，可嵌入现有项目也可独立部署

4. 轻量高效，可扩展

框架核心体积极小（打包后仅2KB左右），加载速度快；同时支持扩展，可通过自定义JS扩展渲染逻辑，兼顾极简和灵活性，满足不同场景需求。

🚀 快速体验指南（3分钟上手）

1. 确保本地安装Node.js（v16+），无需额外配置；

2. 执行npm create xiangjsoncraft@latest my-xjc-app，输入项目名，等待脚手架创建完成；

3. 进入项目目录，执行npm install安装依赖；

4. 执行npm run start启动项目，访问http://localhost:3000；

5. 打开项目根目录的config.json，修改styles（样式）、content（内容），刷新浏览器即可看到效果。

💡 写在最后

从4个文件的小npm包，到独立的前端框架，XiangJsonCraft 2.0 走过了无数次踩坑、调试的过程——从依赖缺失、路径错误，到全局变量暴露问题、NPM发布报错，每一个bug的解决，都是一次成长。

它不追求“大而全”，而是专注于「极简开发」，希望能帮到那些不想写繁琐CSS/JS、需要快速搭建静态页面的开发者，也希望能给前端新手提供一个简单易懂的框架体验。

现在，XiangJsonCraft 2.0 正式版已上线NPM，全程无报错、开箱即用，诚挚邀请所有开发者体验、测试，提出宝贵的意见和建议！

如果体验过程中遇到问题，欢迎在评论区留言，我会第一时间回复、优化；也期待大家一起参与迭代，让这个“从底层逆袭”的框架变得更好～

📦 框架地址

NPM地址：https://www.npmjs.com/package/xiangjsoncraft（点击直接跳转，可查看框架详情、版本更新记录及完整文档）

核心体验命令：npm create xiangjsoncraft@latest，复制粘贴执行，快来试试用JSON写页面吧🎉！

PS：特别纪念一下那个“躲在node_modules里”的核心渲染文件——从寄人篱下，到成为框架的“核心引擎”，它也跟着XiangJsonCraft一起“狂飙”啦😂！