Vue后台

NoahV — Vue 后台模板

作者 baidu

NoahV 是百度开源的基于 Vue 的前端应用框架，面向后台管理系统，提供组件、JSON 配置布局、数据模拟与仪表盘模板。

打开源站下载源码 ZIP

看看你的网站会是什么样

浏览真实页面截图，比较内容排版与手机效果。点击下方缩略图切换，放大查看整页细节。

1 个预览视图

桌面端首页

访问演示网站在新标签页打开

桌面端截图首屏预览

由服务器浏览器实际访问页面后截取。

目前有 1 张原始预览，可打开完整图片查看设计细节。

截图用于了解视觉与布局，交互效果请以实际项目为准。

采集于 2026-10-02查看来源

值得关注的模板亮点

从已有项目资料中，快速了解它的特点。

基于 Vue 的后台管理前端应用框架

导航栏与页面布局通过 JSON 配置，无需代码逻辑开发

内置 API 数据模拟与 API 数据代理，前后端解耦

提供数据仪表盘功能，支持常见数据可视化需求

内置 form、list、filterList、chart 四种页面模板

noahv-cli 脚手架支持项目初始化、模板复用与调试启动

模板详细介绍

NoahV 是一个基于 Vue 开发的前端应用框架，主要适用于常见的后台管理系统。它提供常用的各类组件，帮助快速开始前端开发；导航栏与页面布局通过 JSON 配置完成，无需编写代码逻辑。框架内置 API 数据模拟和 API 数据代理，让前后端不再耦合，便于联调。数据仪表盘功能用于满足常见的数据可视化需求。项目还提供内置模板，支持 form、list、filterList、chart 四种页面类型，通过简单配置即可生成页面。配套的 noahv-cli 脚手架覆盖项目初始化、模板复用、模拟数据创建、调试 server 启动和框架升级。

使用前需注意：框架依赖 Node.js v6.0 或以上版本；文档提供 GitHub Pages 与 Gitee 两个访问地址。项目采用 Apache-2.0 许可，代码可免费使用、修改、商用和分发，但演示图片、字体、图标等第三方素材需按各自许可核对，域名、托管、数据库等外部服务可能另外收费。

Vue后台

适合你的项目吗？

适用场景

搭建企业后台管理系统
开发数据仪表盘与可视化分析页面
通过 JSON 配置快速生成导航栏和页面布局
前后端分离开发时进行 API 数据模拟与代理联调
复用内置表单、列表、筛选列表、图表模板创建页面

适合人群

需要快速搭建后台管理界面的前端团队
希望减少布局代码、用配置驱动页面的开发者
前后端并行开发、需要接口模拟的前端项目
需要内置模板降低页面开发成本的非前端人员

上手与定制指南

结合仓库当前版本的说明，按下面的资料检查内容、配置与运行要求。

1
需先安装 Node.js v6.0 或以上版本
2
通过 npm install noahv-cli -g 全局安装脚手架
3
使用 noahv init 或 noahv init --dashboard 初始化项目
4
在项目根目录运行 noahv start 启动调试 server
5
使用 noahv create 按提示选择模板类型创建页面

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

本次收录的是公开仓库中采用 Apache-2.0 许可的免费版本；免费范围为该版本代码，不代表外部服务或第三方素材免费。

使用时需要遵守

允许免费使用、修改、商用和分发；分发时需随附 Apache-2.0 许可证。
修改过的文件需显著标明改动，并保留相关版权、专利、商标及归属声明。
若原项目附有 NOTICE 文件，分发衍生作品时需保留其中适用的归属声明。
许可包含适用的贡献者专利授权；发起许可所述专利诉讼会终止该专利授权，且不授予商标使用权。
代码按现状提供；担保与责任限制以原许可证及适用法律为准。

额外费用与待核对事项

使用该框架前必须自行安装 Node.js v6.0 或更高版本，否则无法运行脚手架与调试 server。
需通过 npm 全局安装 noahv-cli 脚手架工具，依赖 npm 包管理环境与网络下载。
项目初始化须在空目录中执行 noahv init 命令，需具备命令行操作环境。
本地开发需在项目根目录运行 noahv start 启动调试 server，占用本地端口。
内置模板仅支持 form、list、filterList、chart 四种页面类型，超出范围的页面需自行开发。
演示图片、字体、图标及其他第三方素材需按各自许可核对，不能仅凭代码的 Apache-2.0 许可判断。
域名、托管、数据库、支付或 AI 等外部服务可能另外收费。

查看原文依据

no-charge, royalty-free, irrevocable copyright license
许可证原文

NoahV框架依赖Nodejs 6.0，在执行如下步骤之前，请确保已经安装 <a href="https://nodejs.org/en/">Node.js</a> v6.0 或以上。
README 原文

$ npm install noahv-cli -g
README 原文

# 创建一个空目录，进入目录中，运行noahv init 命令创建一个通用项目
README 原文

# 在项目根目录启动调试server
README 原文

# 根据提示选择需要创建的页面类型，目前支持form、list、filterList、chart四种模板类型
README 原文

https://github.com/baidu/NoahV/blob/master/LICENSE https://github.com/baidu/NoahV/blob/master/README.md

DeepSeek 根据仓库许可证和 README 整理 ·2026-10-02。结果仅覆盖已读取资料，依赖、图片、字体及后续条款变更以各自原文为准。

项目核对记录与介绍依据

模板资料

来源平台: GitHub
资料与维护参考分: 资料较完整 · 76 / 100
技术栈: Vue
网站类型: 后台

这个分数如何计算

本站按许可资料（最高30分）、演示链接（12分）、预览图（10分）、Star数（15分）、记录的维护时间（15分）、描述完整度（8分）、功能记录（5分）和分类资料（5分）计算。它不是代码、安全或性能测试，也不是 Google 评分；有链接不代表已实测可用。

这个项目需要核对什么

记录的仓库更新时间: 2023-03-04
截图检查日期: 2026-10-02

已收录演示链接。请用你的内容与屏幕尺寸检查；有演示不代表表单、认证或支付已经可用。

目录记录的主要技术栈是 Vue。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料，不代表代码审计或部署实测。

查看具体选型方法 →

介绍的制作与核对状态

介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。

已完成服务器许可规则与 AI 来源核对；未经过人工编辑审核。

查看当时使用的来源资料

SHA-256: 8db926310594185edecc7996c5ffda62065638ff012e3d70fdbb55510581158a

2026-10-02T07:14:59.235Z

来源文件 / 仓库

# NoahV

简体中文 | [English](./README_EN.md)

<a href="https://travis-ci.com/baidu/NoahV">
	<img src="https://img.shields.io/travis/com/baidu/NoahV?style=flat-square"  alt="build">
</a>

<a href="https://github.com/baidu/NoahV/blob/master/LICENSE">
	<img src="https://img.shields.io/github/license/baidu/NoahV.svg?style=popout-square" alt="license">
</a>

<a href="https://github.com/baidu/NoahV/issues">
	<img src="https://img.shields.io/github/issues/baidu/NoahV.svg?style=flat-square" alt="open issues">
</a>

<a href="https://github.com/baidu/NoahV/commits/master">
	<img src="https://img.shields.io/github/commit-activity/w/baidu/NoahV.svg?style=flat-square" alt="commit">
</a>

NoahV是一个基于vue开发的前端应用框架，主要适用于常见的后台管理系统，文档地址：[https://baidu.github.io/NoahV](https://baidu.github.io/NoahV), 如访问速度较慢，可尝试访问如下地址：[https://noahv.gitee.io/](https://noahv.gitee.io/)

特性：

* 上手简单，提供常用的各类组件，快速开始前端开发
* 导航栏、页面布局JSON配置，无需代码逻辑开发
* API数据模拟和API数据代理，让前后端不再耦合，联调更简单，效率更高 
* 数据仪表盘功能，满足常见的数据可视化需求，助力数据分析场景
* 内置模版，只需简单配置就可以开发出想要的页面，非前端同学也能快速上手开发
* 实用的脚手架功能，项目初始化、模板复用、模拟数据创建、调试server启动、框架升级一行命令通通搞定

## 快速开始

NoahV框架依赖Nodejs 6.0，在执行如下步骤之前，请确保已经安装 <a href="https://nodejs.org/en/">Node.js</a> v6.0 或以上。

1.安装脚手架工具

```shell
# 安装noahv-cli
$ npm install noahv-cli -g

# 查看使用帮助
$ noahv --help
```

2.初始化一个项目

```shell
# 创建一个空目录，进入目录中，运行noahv init 命令创建一个通用项目
$ mkdir project && cd project && noahv init

# 运行noahv init --dashboard 命令创建一个包含仪表盘功能的项目
$ mkdir project && cd project && noahv init --dashboard
```

3.运行项目

```shell
# 在项目根目录启动调试server
$ noahv start 
```

4.复用模板

```shell
# 在项目根目录复用模板创建页面
$ noahv create 

# 根据提示选择需要创建的页面类型，目前支持form、list、filterList、chart四种模板类型
```

详细信息请查看 [模板使用](https://baidu.github.io/NoahV/#/guide/tpl)

更多关于框架的使用请查看 [NoahV开发指南](https://baidu.github.io/NoahV/#/guide/about)


## 讨论

| 微信群 |    GitHub issues                                               |
| ---------- | ------------------------------------------------------------ |
| <img src="https://noahv.cdn.bcebos.com/github%2Ff414efb2572218cd6756ca483.jpg" width="120px"> | [issues](https://github.com/baidu/NoahV/issues) |

## 参与共建

欢迎大家一起参与NoahV的共建，详情请参考[贡献指南](./CONTRIBUTING.md).

## License

Apache License 2.0

反馈内容错误