下载Node.js

无脑下一步就好（可以选择路径）

检查node.js是否成功

打开cmd 输入 node -v 正常输出版本号既成功

检测Nmp包，一般在下载的时候既默认安装，输出 npm -v 看看是否安装成功

Amis官方文档快速开始 (baidu.com)

这里选择创建单独文件夹amis进行操作输入npm i amis（自己选择一个地方进入cmd然后输入指令下载）

下载完成后是这样的

在 node_modules\amis\sdk 目录里找sdk

复制到前端文件夹中（这里选择软件为VScode）

如果文件路径跟我一样的话那么请复制下面的代码，因为有些路径需要改动，当然你也可以自己取官网复制并修改路径

<!DOCTYPE html>
<html lang="zh"><head><meta charset="UTF-8" /><title>amis demo</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" /><meta http-equiv="X-UA-Compatible" content="IE=Edge" /><link rel="stylesheet" href="./sdk/sdk.css" /><link rel="stylesheet" href="./sdk/helper.css" /><link rel="stylesheet" href="./sdk/iconfont.css" /><!-- 这是默认主题所需的，如果是其他主题则不需要 --><!-- 从 1.1.0 开始 sdk.css 将不支持 IE 11，如果要支持 IE11 请引用这个 css，并把前面那个删了 --><!-- <link rel="stylesheet" href="sdk-ie11.css" /> --><!-- 不过 amis 开发团队几乎没测试过 IE 11 下的效果，所以可能有细节功能用不了，如果发现请报 issue --><style>html,body,.app-wrapper {position: relative;width: 100%;height: 100%;margin: 0;padding: 0;}</style>
</head><body><div id="root" class="app-wrapper"></div><script src="./sdk/sdk.js"></script><script type="text/javascript">(function () {let amis = amisRequire('amis/embed');// 通过替换下面这个配置来生成不同页面let amisJSON = {type: 'page',title: '表单页面',body: {type: 'form',mode: 'horizontal',api: '/saveForm',body: [{label: 'Name',type: 'input-text',name: 'name'},{label: 'Email',type: 'input-email',name: 'email'}]}};let amisScoped = amis.embed('#root', amisJSON);})();</script>
</body></html>

之后就可以运行测试了，结果为

更多内容请看amis官网内容快速开始 (baidu.com)

Amis低代码前端使用相关推荐

实践，制作一个高扩展、可视化低代码前端，详实、完整
RxEditor是一款开源企业级可视化低代码前端,目标是可以编辑所有 HTML 基础的组件.比如支持 React.VUE.小程序等,目前仅实现了 React 版. RxEditor运行快照: 项目地址 ...
为什么要使用低代码 – 前端角度的思考
为什么要使用低代码 – 前端角度的思考文章目录为什么要使用低代码 – 前端角度的思考当前前端发展现状低代码的热潮已经掀起千层浪 UI工程师常常面临一些令人尴尬的场景低代码化解场景思路低代码 ...
低代码前端页面可视化搭建
目录 1.低代码/无代码/传统企业应用开发商介绍 2.低代码平台 2.3. 具备外部接口的调用能力前端页面可视化 3.低代码平台的自动化测试 3.1 关于自动化低代码测试 3.2 低代码测试的机会在 ...
amis 视频教程入门+实战百度出的前端低代码框架
Amis 前端低代码框架百度出品基础简介(1)_哔哩哔哩_bilibili这是第1个视频建立了一个Amis交流QQ群感兴趣的可以加下QQ群号:717791727Amis 官方文档https:// ...
前端低代码工具amis使用文档
amis使用文档本文档旨在帮助开发人员快速入门amis低代码开发平台. 简介 amis 是一个百度出品的低代码前端框架,它使用 JSON 配置来生成页面,可以减少页面开发工作量,极大提升效率. 安装 ...
低代码框架amis的使用
文章目录前言一.简介二.amis 的其它亮点三.amis 不适合做什么? 四.amis 使用方法五.amis 使用过程中的坑前言提示:为什么要用amis? 在经历了十几年的发展后,前端开 ...
从质疑到成为必选项，低代码技术发展及 2022 展望
2022年,CSDN 「低代码产品开发者使用与体验」线上调研,正式开启!现在完成调研,就可参与抽奖活动,还有机会获得线下活动门票一张,和更多行业人士一起交流的机会. 前言 2022年低代码已经不是一个 ...
从实现原理谈谈低代码
点击上方"芋道源码",选择"设为星标" 管她前浪,还是后浪? 能浪的浪,才是好浪! 每天 10:33 更新文章,每天掉亿点点头发... 源码精品专栏原创 | ...
现在大火的低代码是怎么回事？从实现原理谈谈低代码
我们在低代码领域探索了很多年,从2015 开始研发低代码前端渲染(amis),从 2018 年开研发后端低代码数据模型,发布了爱速搭低代码平台,这些年调研过了几乎所有市面上的相关技术和产品,发现虽然每 ...

Amis低代码前端使用

下载Node.js

Amis官方文档快速开始 (baidu.com)

Amis低代码前端使用相关推荐

最新文章

热门文章