AUI为内部开源使用，外部无法访问，底层逻辑使用Vue组件暴露封装，因此在不使用AUI情况下，通过原生Vue CLI脚手架搭建组件库形式暴露卡片组件，也能够正常使用。 开发过程 准备工作中已经正常安装了Vue CLI脚手架，因此可以快速搭建Vue项目。 初始化Vue项目。 vue create my-app

查看更多 →

Vue应用部署 在主机上部署Vue框架的web服务，并启动该服务。 请确认目标主机已安装Nginx，若已安装请移除模板中“安装Nginx”步骤。 该模板涉及的部署步骤如下所示： 安装Nginx 下载软件包 解压软件包 启动Nginx 重载Nginx配置文件 服务启动测试 该模板需要填写的参数如下表所示。

查看更多 →

查看解压后的组件目录。 目录结构如图3所示，其中userLogin.js文件是写vue业务逻辑的代码，userLogin.ftl用于写html代码，userLogin.css用于写样式代码，userLogin.editor.js以及packageinfo.json是配置文件。 图3 目录结构

查看更多 →

如“global_VueI18n”是基于“global_Vue”的，需要写在“global_Vue”之后。 在Widget包（widget_demo_mintui.zip）的widget_demo_mintui.ftl中写一个简单的表单DOM。 <div id="widget_demo_mintui">

查看更多 →

如“global_VueI18n”是基于“global_Vue”的，需要写在“global_Vue”之后。 在Widget包（widget_demo_mintui.zip）的widget_demo_mintui.ftl中写一个简单的表单DOM。 <div id="widget_demo_mintui">

查看更多 →

如果安装成功，应该可以看到npm的版本号。 安装Vue CLI Vue CLI是Vue.js的脚手架工具，可以帮助我们快速创建Vue.js应用。要使用它，我们需要先安装它。 在命令行中输入以下命令来安装Vue CLI： npm install -g @vue/cli 这个命令会全局安装Vue CLI，所以安装

查看更多 →

使用JS面板 在常规代码开发中，我们需要为某个区块或者某个元素添加一些事件，比如单击事件，同一个页面的事件会统一保存到对应的页面JS中。 很多时候我们需要自定义一些方法去复用一些逻辑，也需要用到页面JS。 需要注意的是当前的页面JS只能使用声明函数，不能使用函数表达式声明函数，也不能在页面JS中定义其他的变量。

查看更多 →

库文件需要有先后顺序，例如“global_VueI18n”是基于“global_Vue”的，需要写在“global_Vue”之后。 在高级页面组件包的widget_demo_mintui.ftl中，写一个简单的表单DOM。 <div id="widget_demo_mintui">

查看更多 →

库文件需要有先后顺序，例如“global_VueI18n”是基于“global_Vue”的，需要写在“global_Vue”之后。 在高级页面组件包的widget_demo_mintui.ftl中，写一个简单的表单DOM。 <div id="widget_demo_mintui">

查看更多 →

classes：用于返回样式类名，也可以直接用字符串替换，这样写只是为了增加灵活性。 onclick：在图片按钮被单击时，去触发其单击事件编排的业务逻辑。 setButtonText：对外显露的方法，用于修改按钮中的文本。 修改视图文件“imgButton.vue”中的“style scoped”，定义图片按钮的样式类。

查看更多 →

global_VueI18n”是基于“global_Vue”的，需要写在“global_Vue”之后。具体的依赖关系可参考如何引入第三方库中“系统预置库列表”。 在Widget包的widget_demo_mintui.ftl中写一个简单的表单DOM。 <div id="widget_demo_mintui">

查看更多 →

{widget}.js 文件介绍 {widget}.js为组件逻辑文件，整个Widget的渲染核心JS，在组件编辑状态和页面最终的发布运行态都会被加载执行。一个推荐的组件架构，应包含表1中API。其中，init、render和beforeDestory为组件的通用生命周期函数，其余为推荐模板实现。

查看更多 →

页面JS 编写JS脚本 单击左侧插件栏中页面JS按钮即可打开页面JS面板。在代码编辑区中编写好代码后单击右上角保存按钮。 图1 代码编辑区 系统预先编写好了一些范例脚本，单击“展示使用帮助”可以查看提供的范例脚本。 可以将需要使用的相关范例复制，然后单击“关闭使用帮助”回到JS代码编辑页面，粘贴到代码编辑区进行使用。

查看更多 →

在不同页面不同子系统中，复用同样的逻辑和功能了。 通过Webpack进行组件打包构建成为独立JS。 独立JS能够被懒加载。 在管理页面进行卡片创建，上传管理。 创建卡片实例，关联独立JS包，进行版本控制。 父主题： 卡片配置指南

查看更多 →

obal_VueI18n”是基于“global_Vue”的，需要写在“global_Vue”之后。更多依赖关系的介绍，请参见如何引入第三方库中“系统预置库列表”。 在Widget包的widget_demo_mintui.ftl中，写一个简单的表单DOM。 <div id="widget_demo_mintui">

查看更多 →

{widget}.js 文件介绍 {widget}.js为组件逻辑文件，整个Widget的渲染核心JS，在组件编辑状态和页面最终的发布运行态都会被加载执行。一个推荐的组件架构，应包含表1中API。其中，init、render和beforeDestory为组件的通用生命周期函数，其余为推荐模板实现。

查看更多 →

调试工具 Vue Devtools是一个专为Vue.js开发者设计的浏览器扩展。它提供了一系列强大的功能，帮助开发者更容易地调试和优化他们的Vue应用程序。 Vue Devtools 以下是Vue Devtools的主要特点和功能： 组件树查看：允许用户查看完整的Vue组件层次结

查看更多 →

JS错误 JS错误展示站点的错误统计，包括：JS稳定性、JS错误列表以及JS错误率页面排行榜。 操作步骤 登录管理控制台。 单击左侧，选择“管理与监管 > 应用性能管理 APM”，进入APM服务页面。 在左侧导航栏选择“前端监控 >JS错误”，展示JS错误的性能数据。 图1 JS错误

查看更多 →

在“变量列表”选择“自定义处理函数”，并选择在页面JS中新增的方法。 若需要执行JS方法，需要在变量中给方法名后添加括号，否则为字符串格式。 图4 自定义处理函数 单击“确定”。 在生命周期中绑定JS方法 生命周期介绍 这里的生命周期特指Vue的生命周期，Vue的生命周期可以简单分为四个阶段：创建阶段，挂载阶段，运行阶段，销毁阶段。

查看更多 →

/node_modules/vite/bin/vite.js build" 或 "build": "node --max_old_space_size=4096 ./node_modules/@vue/cli-service/bin/vue-cli-service.js build" React 举例说明“package

查看更多 →

文件名 文件说明 TabsWidget.js 组件逻辑文件，整个Widget的渲染核心JS，在组件编辑状态和页面最终的发布运行态都会被加载执行。主要包含的预置API说明，请参见高级页面组件中预置的API。 TabsWidget.editor.js 组件属性定义文件，负责组件在编辑状态时，需要渲染的界面和逻辑。“*

查看更多 →