关于amis和amis-editor还有amis-widget-cli的疑问？

[mrluos]

作者你好，关于amis和amis-editor还有amis-widget-cli有几个疑问，麻烦解答一下： 1.amis是不是只是对（json）做解析渲染，没有可视化的能力（就是可视化的制作） 2.如果想要可视化的制作是不是要用amis-editor 3.如果我一个项目(vue技术栈)里面，想要可视化编辑+解析json是不是要同时引入amis+amis-editor （js-sdk方式引入amis, amis-editor是不是只能使用react的技术栈） 4.vue的技术栈，通过amis-widget-cli制作一个vue的自定义组件，如何在amis以及amis-editor中使用？ （使用amis-widget-cli生成vue的模板npm run build2lib构建的产物,如何在amis中使用（amis通过js-sdk的引入方式）)

[wibetter]

@mrluos

1. amis 是 json 解析器，内置ui组件库（主要在amis-ui中，支持当UI组件库使用），主要能力是 json 到 页面的能力；
2. 如果需要页面可视化能力，需要使用amis-editor，提供可视化界面操作页面json数据，其画布区使用amis json解析器渲染；
3. 如果是vue项目，这两部分需要特殊处理（页面设计器和json页面渲染）：1、页面设计器单独放出来，使用react实现这样一个功能页面（使用amis-editor）；2、页面设计器保存的页面使用amis sdk 渲染。
4. 目前amis-widget-cli 是用于开发爱速搭平台上的NPM扩展包。如果是在amis-editor中使用，完全没必要使用这个脚手架，因为amis和amis-editor提供注册自定义组件的方法，可以直接在项目中注册自己的自定义组件。当然如果是vue的自定义组件，可以使用amis-widget注册成自定义组件。使用amis-widget-cli生成vue的模板npm run build2lib构建的产物，直接将其导入项目中就可以生效，但需确保渲染器脚本加载完成再渲染页面（避免自定义组件渲染失败）。

[mrluos]

非常感谢耐心解答疑惑

[mrluos]

@mrluos

1. amis 是 json 解析器，内置ui组件库（主要在amis-ui中，支持当UI组件库使用），主要能力是 json 到 页面的能力；
2. 如果需要页面可视化能力，需要使用amis-editor，提供可视化界面操作页面json数据，其画布区使用amis json解析器渲染；
3. 如果是vue项目，这两部分需要特殊处理（页面设计器和json页面渲染）：1、页面设计器单独放出来，使用react实现这样一个功能页面（使用amis-editor）；2、页面设计器保存的页面使用amis sdk 渲染。
4. 目前amis-widget-cli 是用于开发爱速搭平台上的NPM扩展包。如果是在amis-editor中使用，完全没必要使用这个脚手架，因为amis和amis-editor提供注册自定义组件的方法，可以直接在项目中注册自己的自定义组件。当然如果是vue的自定义组件，可以使用amis-widget注册成自定义组件。使用amis-widget-cli生成vue的模板npm run build2lib构建的产物，直接将其导入项目中就可以生效，但需确保渲染器脚本加载完成再渲染页面（避免自定义组件渲染失败）。

使用 npm run build2lib 得到的产物，直接在项目中引入以后会报错

我的大概使用的代码：

使用sdk的方式引入amis index.html

`

<script src="cus/infoCard.umd.js"></script>`

test.vue中 let amis = amisRequire("amis/embed"); amis.embed("#render-dom", {type:"vue-info-card"})

[wibetter]

@mrluos 需要看下是不是没有将amis-widget打包进来

[mrluos]

@mrluos 需要看下是不是没有将amis-widget打包进来

我是按照那个脚手架下载了直接打包的

[mrluos]

``

@mrluos 需要看下是不是没有将amis-widget打包进来

@wibetter 直接从https://github.com/aisuda/amis-widget-cli 这个库clone下来，build的

[swieer]

``

@mrluos 需要看下是不是没有将amis-widget打包进来

@wibetter 直接从https://github.com/aisuda/amis-widget-cli 这个库clone下来，build的

一样的问题，请问解决了没有

[wibetter]

@swieer @mrluos build2lib构建后的产物，默认会剔除掉第三方依赖模块，如果要引入其他项目，还需要进行一次构建方可正常使用。 特别说明：构建后的产物虽然是umd模块，但剔除了爱速搭平台中已有的第三方依赖（比如amis、react等），因此不能直接在浏览器中使用。如果需要在浏览器端使用，可以调整构建配置，将第三方依赖模块也打包进来。