【亲测免费】 amis 项目安装和配置指南

1. 项目基础介绍和主要编程语言

项目介绍

amis 是一个前端低代码框架，由百度开发并开源。它通过 JSON 配置来生成各种页面，极大地减少了前端开发的工作量，提升了开发效率。amis 适用于需要快速生成后台管理页面的场景，开发者甚至不需要深入了解前端技术。

主要编程语言

amis 项目主要使用 TypeScript 和 JavaScript 进行开发。TypeScript 用于编写类型安全的代码，而 JavaScript 则用于实现页面的动态交互。

2. 项目使用的关键技术和框架

关键技术

• TypeScript: 用于编写类型安全的代码，提升代码的可维护性和可读性。
• React: 作为前端框架，amis 基于 React 构建，利用 React 的组件化特性来实现页面的动态渲染。
• JSON: 通过 JSON 配置来生成页面，简化了页面的开发流程。

框架

• amis: 核心框架，负责解析 JSON 配置并生成对应的页面。
• React: 用于构建用户界面，amis 基于 React 实现。

3. 项目安装和配置的准备工作和详细安装步骤

准备工作

在开始安装 amis 之前，请确保你的开发环境满足以下要求：

• Node.js: 推荐使用 Node.js 12/14/16 版本。
• npm: 推荐使用 npm 7+ 版本。

详细安装步骤

步骤 1: 克隆项目仓库

首先，你需要从 GitHub 上克隆 amis 项目到本地。打开终端并运行以下命令：

git clone https://github.com/baidu/amis.git

步骤 2: 进入项目目录

克隆完成后，进入项目目录：

cd amis

步骤 3: 安装项目依赖

使用 npm 安装项目所需的依赖包。由于项目使用了 workspaces 功能，建议使用 --legacy-peer-deps 选项来避免依赖冲突：

npm install --legacy-peer-deps

步骤 4: 启动项目

依赖安装完成后，你可以启动项目。启动后，项目将在本地服务器上运行，默认端口为 8888：

npm start

启动成功后，你可以通过浏览器访问 http://127.0.0.1:8888/examples/pages/simple 来查看示例页面。

步骤 5: 开发编辑器

如果你需要开发编辑器功能，可以访问 http://127.0.0.1:8888/packages/amis-editor/ 来测试编辑器功能。

注意事项

• 在本地修改代码后，执行测试用例之前需要先执行 npm run build 完成编译，因为 jest 并不支持 TypeScript。
• 如果你在 Node.js 12 版本下安装依赖时遇到报错，可以忽略这些报错，它们不影响项目的正常使用。

通过以上步骤，你已经成功安装并配置了 amis 项目。现在你可以开始使用 amis 来快速生成各种页面了。