+
+基于 Schema 和物料组件，如何渲染出我们的页面？这一节描述的就是这个。
+
+## npm 包与仓库信息
+
+- React 框架渲染 npm 包：@alilc/lowcode-react-renderer
+- 仓库：[https://github.com/alibaba/lowcode-engine](https://github.com/alibaba/lowcode-engine) 下的
+ - packages/renderer-core
+ - packages/react-renderer
+ - packages/react-simulator-renderer
+
+## 渲染框架原理
+### 整体架构
+
+
+
+- 协议层：基于[《低代码引擎搭建协议规范》](/site/docs/specs/lowcode-spec) 产出的 Schema 作为我们的规范协议。
+- 能力层：提供组件、区块、页面等渲染所需的核心能力，包括 Props 解析、样式注入、条件渲染等。
+- 适配层：由于我们使用的运行时框架不是统一的，所以统一使用适配层将不同运行框架的差异部分，通过接口对外，让渲染层注册/适配对应所需的方法。能保障渲染层和能力层直接通过适配层连接起来，能起到独立可扩展的作用。
+- 渲染层：提供核心的渲染方法，由于不同运行时框架提供的渲染方法是不同的，所以其通过适配层进行注入，只需要提供适配层所需的接口，即可实现渲染。
+- 应用层：根据渲染层所提供的方法，可以应用到项目中，根据使用的方法和规模即可实现应用、页面、区块的渲染。
+
+### 核心解析
+
+这里主要解析一下刚刚提到的架构中的适配层和渲染层。
+
+#### 适配层
+适配层提供的是各个框架之间的差异项。比如 `React.createElement` 和 `Rax.createElement` 方法是不同的。所以需要在适配层对 API 进行抹平。
+
+##### React
+```typescript
+import { createElement } from 'react';
+import {
+ adapter,
+} from '@ali/lowcode-renderer-core';
+
+adapter.setRuntime({
+ createElement,
+});
+```
+##### Rax
+```typescript
+import { createElement } from 'rax';
+import {
+ adapter,
+} from '@ali/lowcode-renderer-core';
+
+adapter.setRuntime({
+ createElement,
+});
+```
+这时，在核心层使用的 `createElement` 会基于使用不同的 renderer 而使用不同的方法，自动适配框架所需的运行时方法。
+
+所需的方法包括：
+
+- `setRuntime`：设置运行时相关方法
+ - `Component`：组件类，参考 React 的 `Component`。
+ - `PureComponent`：组件类，参考 React 的 `PureComponent`。
+ - `createContext`：创建一个 `Context` 对象的方法。例如，当 React 渲染一个订阅了这个 `Context` 对象的组件，这个组件会从组件树中离自身最近的那个匹配的 `Provider` 中读取到当前的 `context` 值。
+ - `createElement`：创建 `Component` 元素，例如在 React 中即为创建 React 元素。
+ - `forwardRef`：ref 转发的方法。Ref 转发是一个可选特性，其允许某些组件接收 ref，并将其向下传递（换句话说，“转发”它）给子组件。
+ - `findDOMNode`：是一个访问底层 DOM 节点的方法。如果组件已经被挂载到 DOM 上，此方法会返回浏览器中相应的原生 DOM 元素。
+- `setRenderers`
+ - `PageRenderer`：页面渲染的方法。可以定制页面渲染的生命周期，定制导航，定制路由等。
+ - `ComponentRenderer`：组件渲染的方法。
+ - `BlockRenderer`：区块渲染的方法。
+
+#### 渲染层
+##### React Renderer
+内部的技术栈统一都是 React，大多数适配层的 API 都是按照 React 来设计的，所以对于 React Renderer 来说，需要做的不多。
+
+React Renderer 的代码量很少，主要是将 React API 注册到适配层中。
+
+```typescript
+import React, { Component, PureComponent, createElement, createContext, forwardRef, ReactInstance, ContextType } from 'react';
+import ReactDOM from 'react-dom';
+import {
+ adapter,
+ pageRendererFactory,
+ componentRendererFactory,
+ blockRendererFactory,
+ addonRendererFactory,
+ tempRendererFactory,
+ rendererFactory,
+ types,
+} from '@ali/lowcode-renderer-core';
+import ConfigProvider from '@alifd/next/lib/config-provider';
+
+window.React = React;
+(window as any).ReactDom = ReactDOM;
+
+adapter.setRuntime({
+ Component,
+ PureComponent,
+ createContext,
+ createElement,
+ forwardRef,
+ findDOMNode: ReactDOM.findDOMNode,
+});
+
+adapter.setRenderers({
+ PageRenderer: pageRendererFactory(),
+ ComponentRenderer: componentRendererFactory(),
+ BlockRenderer: blockRendererFactory(),
+ AddonRenderer: addonRendererFactory(),
+ TempRenderer: tempRendererFactory(),
+ DivRenderer: blockRendererFactory(),
+});
+
+adapter.setConfigProvider(ConfigProvider);
+```
+
+##### Rax Renderer
+Rax 的大多数 API 和 React 基本也是一致的，差异点在于重写了一些方法。
+```typescript
+import { Component, PureComponent, createElement, createContext, forwardRef } from 'rax';
+import findDOMNode from 'rax-find-dom-node';
+import {
+ adapter,
+ addonRendererFactory,
+ tempRendererFactory,
+ rendererFactory,
+} from '@ali/lowcode-renderer-core';
+import pageRendererFactory from './renderer/page';
+import componentRendererFactory from './renderer/component';
+import blockRendererFactory from './renderer/block';
+import CompFactory from './hoc/compFactory';
+
+adapter.setRuntime({
+ Component,
+ PureComponent,
+ createContext,
+ createElement,
+ forwardRef,
+ findDOMNode,
+});
+
+adapter.setRenderers({
+ PageRenderer: pageRendererFactory(),
+ ComponentRenderer: componentRendererFactory(),
+ BlockRenderer: blockRendererFactory(),
+ AddonRenderer: addonRendererFactory(),
+ TempRenderer: tempRendererFactory(),
+});
+```
+
+### 多模式渲染
+#### 预览模式渲染
+预览模式的渲染，主要是通过 Schema、components 即可完成上述的页面渲染能力。
+```typescript
+import ReactRenderer from '@ali/lowcode-react-renderer';
+import ReactDOM from 'react-dom';
+import { Button } from '@alifd/next';
+
+const schema = {
+ componentName: 'Page',
+ props: {},
+ children: [
+ {
+ componentName: 'Button',
+ props: {
+ type: 'primary',
+ style: {
+ color: '#2077ff'
+ },
+ },
+ children: '确定',
+ },
+ ],
+};
+
+const components = {
+ Button,
+};
+
+ReactDOM.render((
+ 自定义 react 标签
, content)
+ }
+ })
+ }
+ }
+}
+
+pluginX6DesignerExtension.pluginName = 'plugin-x6-designer-extension';
+
+export default pluginX6DesignerExtension;
+```
+x6Designer为图实例暴露出来的一些接口，可基于此进行一些图的必要插件的封装，整个插件的封装完全follow低代码引擎的插件，详情可参考 https://lowcode-engine.cn/site/docs/guide/expand/editor/pluginWidget
+
+## 开发物料
+```bash
+npm init @alilc/element your-material-demo
+```
+
+
+仓库初始化完成
+
+
+接下来即可编写物料内容了
+图物料与低代码的dom场景存在画布的差异，因此暂不支持物料单独调试，须通过项目demo进行物料调试
+
+### 资产描述
+```bash
+npm run lowcode:build
+```
+如果物料是个React组件，则在执行上述命令时会自动生成对应的meta.ts，但图物料很多时候并非一个React组件，因此须手动生产meta.ts
+
+可参考： https://github.com/alibaba/lowcode-materials/blob/main/packages/graph-x6-materials/lowcode/send-email/meta.ts
+同时会自动生成物料描述文件
+
+### 物料调试
+#### 物料侧
+物料想要支持被项目动态inject调试，须在build.lowcode.js中加入
+```javascript
+[
+ '@alilc/build-plugin-alt',
+ {
+ type: 'component',
+ inject: true,
+ library
+ },
+]
+```
+
+
+本地启动
+```bash
+npm run lowcode:dev
+```
+#### 项目侧
+通过@alilc/lce-graph-core加载物料的天然支持了debug，因此无须特殊处理。
+若项目中自行加载，则参考 https://lowcode-engine.cn/site/docs/guide/expand/editor/cli
+项目访问地址后拼接query "?debug"即可进入物料调试
+
+
+
diff --git a/docs/docs/guide/expand/editor/material.md b/docs/docs/guide/expand/editor/material.md
new file mode 100644
index 0000000000..6e4979553b
--- /dev/null
+++ b/docs/docs/guide/expand/editor/material.md
@@ -0,0 +1,292 @@
+---
+title: 物料扩展
+sidebar_position: 1
+---
+## 物料简述
+物料是页面搭建的原料，按照粒度可分为组件、区块和模板：
+
+1. 组件：组件是页面搭建最小的可复用单元，其只对外暴露配置项，用户无需感知其内部实现；
+2. 区块：区块是一小段符合低代码协议的 schema，其内部会包含一个或多个组件，用户向设计器中拖入一个区块后可以随意修改其内部内容；
+3. 模板：模板和区块类似，也是一段符合低代码协议的 schema，不过其根节点的 componentName 需固定为 Page，它常常用于初始化一个页面；
+
+低代码编辑器中的物料需要进行一定的配置和处理，才能让用户在低代码平台使用起来。这个过程中，需要一份一份配置文件，也就是资产包。资产包文件中，针对每个物料定义了它们在低代码编辑器中的使用描述。
+## 资产包配置
+### 什么是低代码资产包
+
+在低代码 Demo 中，我们可以看到，组件面板不只提供一个组件，组件是以集合的形式提供给低代码平台的，而低代码资产包正是这些组件构成集合的形式。
+**_它背后的 Interface，_**[**_在引擎中的定义摘抄如下_**](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/assets.ts)**_：_**
+
+```typescript
+export interface Assets {
+ version: string; // 资产包协议版本号
+ packages?: Arraydumb
;
+ }
+}
+```
+
+引入 parse 工具自动解析
+
+```typescript
+import parse from '@alilc/lowcode-material-parser';
+(async () => {
+ const result = await parse({ entry: '/path/to/component' });
+ console.log(JSON.stringify(result, null, 2));
+})();
+```
+
+因为一个组件可能输出多个子组件，所以解析结果是个数组。
+
+```json
+[
+ {
+ "componentName": "FusionForm",
+ "title": "",
+ "docUrl": "",
+ "screenshot": "",
+ "devMode": "proCode",
+ "npm": {
+ "package": "",
+ "version": "",
+ "exportName": "default",
+ "main": "",
+ "destructuring": false,
+ "subName": ""
+ },
+ "props": [
+ {
+ "name": "name",
+ "propType": "string",
+ "description": "这是用于描述姓名",
+ "defaultValue": "张三"
+ },
+ {
+ "name": "age",
+ "propType": "number",
+ "description": "这是用于描述年龄",
+ "defaultValue": 18
+ },
+ {
+ "name": "friends",
+ "propType": "array",
+ "description": "这是用于描述好友列表",
+ "defaultValue": [
+ "李四",
+ "王五",
+ "赵六"
+ ]
+ }
+ ]
+ }
+]
+```
+
+## 手工配置物料描述
+
+如果自动生成的物料无法满足需求，我们就需要手动配置物料描述。本节将分场景描述物料配置的内容。
+
+### 常见配置
+
+#### 组件的属性只有有限的值
+
+增加一个 size 属性，只能从 'large'、'normal'、'small' 这个候选值中选择。
+
+以上面自动解析的物料为例，在此基础上手工加上 size 属性：
+
+```json
+[
+ {
+ "componentName": "FusionForm",
+ "title": "",
+ "docUrl": "",
+ "screenshot": "",
+ "devMode": "proCode",
+ "npm": {
+ "package": "",
+ "version": "",
+ "exportName": "default",
+ "main": "",
+ "destructuring": false,
+ "subName": ""
+ },
+ "props": [
+ {
+ "name": "name",
+ "propType": "string",
+ "description": "这是用于描述姓名",
+ "defaultValue": "张三"
+ },
+ {
+ "name": "age",
+ "propType": "number",
+ "description": "这是用于描述年龄",
+ "defaultValue": 18
+ },
+ {
+ "name": "friends",
+ "propType": "array",
+ "description": "这是用于描述好友列表",
+ "defaultValue": [
+ "李四",
+ "王五",
+ "赵六"
+ ]
+ }
+ ],
+ // 手工增加的 size 属性
+ "configure": {
+ "isExtend": true,
+ "props": [
+ {
+ "title": "尺寸",
+ "name": "size",
+ "setter": {
+ "componentName": 'RadioGroupSetter',
+ "isRequired": true,
+ "props": {
+ "options": [
+ { "title": "大", "value": "large" },
+ { "title": "中", "value": "normal" },
+ { "title": "小", "value": "small" }
+ ]
+ },
+ }
+ }
+ ]
+ }
+ }
+]
+```
+
+#### 组件的属性既可以设置固定值，也可以绑定到变量
+
+我们知道一种属性形式就需要一种 setter 来设置，如果想要将 value 属性允许输入字符串，那就需要设置为 `StringSetter`，如果允许绑定变量，就需要设置为 `VariableSetter`，具体设置器请参考[预置设置器列表](/site/docs/guide/appendix/setters)。
+
+那如果都想要呢？可以使用 `MixedSetter` 来实现。
+
+```javascript
+{
+ // ...
+ configure: {
+ isExtend: true,
+ props: [
+ {
+ title: '输入框的值',
+ name: 'activeValue',
+ setter: {
+ componentName: 'MixedSetter',
+ isRequired: true,
+ props: {
+ setters: [
+ 'StringSetter',
+ 'NumberSetter',
+ 'VariableSetter',
+ ],
+ },
+ }
+ }
+ ]
+ }
+}
+```
+
+设置后，就会出现“切换设置器”的操作项了
+
+
+
+
+
+#### 开启组件样式设置
+
+
+
+```javascript
+{
+ configure: {
+ // ...,
+ supports: {
+ style: true,
+ },
+ // ...
+ }
+}
+```
+
+#### 设置组件的默认事件
+
+
+
+```javascript
+{
+ configure: {
+ // ...
+ supports: {
+ events: ['onPressEnter', 'onClear', 'onChange', 'onKeyDown', 'onFocus', 'onBlur'],
+ },
+ // ...
+ }
+}
+```
+
+#### 设置 prop 标题的 tip
+
+
+
+```javascript
+{
+ name: 'label',
+ setter: 'StringSetter',
+ title: {
+ label: {
+ type: 'i18n',
+ zh_CN: '标签文本',
+ en_US: 'Label',
+ },
+ tip: {
+ type: 'i18n',
+ zh_CN: '属性：label | 说明：标签文本内容',
+ en_US: 'prop: label | description: label content',
+ },
+ },
+}
+```
+
+#### 配置 prop 对应 setter 在配置面板的展示方式
+
+##### inline
+
+
+
+```javascript
+{
+ configure: {
+ props: [{
+ description: '标签文本',
+ display: 'inline',
+ }]
+ }
+}
+```
+
+##### block
+
+
+
+```javascript
+{
+ configure: {
+ props: [{
+ description: '高级',
+ display: 'block',
+ }]
+ }
+}
+```
+
+##### accordion
+
+
+
+```javascript
+{
+ configure: {
+ props: [{
+ description: '表单项配置',
+ display: 'accordion',
+ }]
+ }
+}
+```
+
+##### entry
+
+
+
+
+
+
+```javascript
+{
+ configure: {
+ props: [{
+ description: '风格与样式',
+ display: 'entry',
+ }]
+ }
+}
+```
+
+##### plain
+
+
+
+```javascript
+{
+ configure: {
+ props: [{
+ description: '返回上级',
+ display: 'plain',
+ }]
+ }
+}
+```
+
+
+### 进阶配置
+
+#### 组件的 children 属性允许传入 ReactNode
+
+例如有一个如下的 Tab 选项卡组件，每个 TabPane 的 children 都是一个组件
+
+
+
+只需要增加 `isContainer` 配置即可
+
+```javascript
+{
+ // ...
+ configure: {
+ // ...
+ component: {
+ // 新增，设置组件为容器组件，可拖入组件
+ isContainer: true,
+ },
+ }
+}
+```
+
+假设我们希望只允许拖拽 Table、Button 等内容放在 TabPane 里。配置白名单 `childWhitelist` 即可
+
+```javascript
+{
+ // ...
+ configure: {
+ // ...
+ component: {
+ isContainer: true,
+ nestingRule: {
+ // 允许拖入的组件白名单
+ childWhitelist: ['Table', 'Button'],
+ // 同理也可以设置该组件允许被拖入哪些父组件里
+ parentWhitelist: ['Tab'],
+ },
+ },
+ },
+}
+```
+#### 组件的非 children 属性允许传入 ReactNode
+
+这就需要使用 `SlotSetter` 开启插槽了，如下面示例，给 Tab 的 title 开启插槽，允许拖拽组件
+
+
+
+```json
+{
+ // ...
+ configure: {
+ isExtend: true,
+ props: [
+ {
+ title: '选项卡标题',
+ name: 'title',
+ setter: {
+ componentName: 'MixedSetter',
+ props: {
+ setters: [
+ 'StringSetter',
+ 'SlotSetter',
+ 'VariableSetter',
+ ],
+ },
+ },
+ },
+ ],
+ },
+}
+```
+
+#### 屏蔽组件在设计器中的操作按钮
+
+正常情况下，组件允许复制：
+
+
+
+如果希望禁止组件的复制行为，我们可以这样做：
+
+
+
+```javascript
+{
+ configure: {
+ component: {
+ disableBehaviors: ['copy'],
+ },
+ },
+}
+```
+
+#### 实现一个 BackwardSetter
+
+
+
+```javascript
+{
+ name: 'back',
+ title: ' ',
+ display: 'plain',
+ setter: BackwardSetter,
+}
+
+// BackwardSetter
+import { SettingTarget, DynamicSetter } from '@alilc/lowcode-types';
+const BackwardSetter: DynamicSetter = (target: SettingTarget) => {
+ return {
+ componentName: (
+
+ ),
+ };
+};
+```
+
+### 高级配置
+
+#### 不展现一个 prop 配置
+
+- 始终隐藏当前 prop
+
+```javascript
+{
+ // 始终隐藏当前 prop 配置
+ condition: () => false,
+}
+```
+
+- 根据其它 prop 的值展示/隐藏当前 prop
+
+```javascript
+{
+ // direction 为 hoz 则展示当前 prop 配置
+ condition: (target) => {
+ return target.getProps().getPropValue('direction') === 'hoz';
+ }
+}
+```
+
+#### props 联动
+
+```javascript
+// 根据当前 prop 的值动态设置其它 prop 的值
+{
+ name: 'labelAlign',
+ // ...
+ extraProps: {
+ setValue: (target, value) => {
+ if (value === 'inset') {
+ target.getProps().setPropValue('labelCol', null);
+ target.getProps().setPropValue('wrapperCol', null);
+ } else if (value === 'left') {
+ target.getProps().setPropValue('labelCol', { fixedSpan: 4 });
+ target.getProps().setPropValue('wrapperCol', null);
+ }
+ return target.getProps().setPropValue('labelAlign', value);
+ },
+ },
+}
+// 根据其它 prop 的值来设置当前 prop 的值
+{
+ name: 'status',
+ // ...
+ extraProps: {
+ getValue: (target) => {
+ const isPreview = target.getProps().getPropValue('isPreview');
+ return isPreview ? 'readonly' : 'editable';
+ }
+ }
+}
+```
+
+#### 动态 setter 配置
+
+可以通过 DynamicSetter 传入的 target 获取一些引擎暴露的数据，例如当前有哪些组件被加载到引擎中，将这个数据作为 SelectSetter 的选项，让用户选择：
+
+```javascript
+{
+ setter: (target) => {
+ return {
+ componentName: 'SelectSetter',
+ props: {
+ options: target.designer.props.componentMetadatas.filter(
+ (item) => item.isFormItemComponent).map(
+ (item) => {
+ return {
+ title: item.title || item.componentName,
+ value: item.componentName,
+ };
+ }
+ ),
+ ),
+ },
+ };
+ }
+}
+```
diff --git a/docs/docs/guide/expand/editor/parts/_category_.json b/docs/docs/guide/expand/editor/parts/_category_.json
new file mode 100644
index 0000000000..005a3caf6c
--- /dev/null
+++ b/docs/docs/guide/expand/editor/parts/_category_.json
@@ -0,0 +1,4 @@
+{
+ "label": "Parts 造物",
+ "position": 1
+}
diff --git a/docs/docs/guide/expand/editor/parts/partsIntro.md b/docs/docs/guide/expand/editor/parts/partsIntro.md
new file mode 100644
index 0000000000..a6fc6e8817
--- /dev/null
+++ b/docs/docs/guide/expand/editor/parts/partsIntro.md
@@ -0,0 +1,18 @@
+---
+title: 介绍
+sidebar_position: 1
+---
+## 介绍
+
+
+
+「Parts·造物」是基于开源低代码引擎打造的次时代物料研发和集成工具，一方面作为低代码引擎搭建低代码平台的一个样板展示开源生态下的各个组件如何集合在一起形成生产力，另一方面也可以生产低代码平台所需的物料。
+
+目前「Parts·造物」主要提供两大产品功能：
+ 1. React 组件导入低代码引擎：通过在线可视化的「物料描述」配置，任意工具开发的 React 组件都可以快速完成对低代码引擎的适配，导入到低代码引擎项目中进行使用。不必额外开发新的组件。
+ 2. 低代码生产组件：通过低代码的形式生产组件，极低上手门槛，提供丰富的原子组件用于组合，完善的调试预览和组件生命周期控制。生产的组件既可以在低代码引擎项目中使用，也可以出码后在普通源码项目中使用。
+
+
+## 联系我们
+
+
diff --git a/docs/docs/guide/expand/editor/parts/partsassets.md b/docs/docs/guide/expand/editor/parts/partsassets.md
new file mode 100644
index 0000000000..00670ecadc
--- /dev/null
+++ b/docs/docs/guide/expand/editor/parts/partsassets.md
@@ -0,0 +1,267 @@
+---
+title: 资产包管理
+sidebar_position: 4
+---
+
+## 介绍
+
+通过前述介绍，相信大家已经了解如何使用「[Parts·造物](https://parts.lowcode-engine.cn/)」来将已有的 React 组件快速接入低代码引擎，以及生产低代码组件。
+
+大家在使用的过程中，可能会希望构建出来的资产包可以后续随时访问下载，或者希望构建资产包时各个组件的版本等信息可以持久化起来并且能够多人维护。
+
+通过「[Parts·造物](https://parts.lowcode-engine.cn/)」的 `资产包` 管理功能帮助大家解决这个问题
+
+
+
+## 新建资产包
+
+首先，我们在 我的资产包 tab 中点击 `新建资产包`
+
+
+- 填写资产包名称
+- 配置资产包管理员，管理员拥有该资产包的所有权限，初始默认为资产包的创建者，还可以添加其他人作为管理员，
+- 配置资产包描述 (可选)
+- 点击 `确定`, 即可完成资产包的创建
+
+接下来需要为资产包添加一个或者多个组件。
+
+## 添加组件
+
+第二步：新建完资产包以后，我们就可以为其添加组件了，如果是新建资产包流程，新建完成之后会自动弹出组件配置的弹窗，当然，你可可以通过点击资产包卡片的方式打开组件配置的弹窗。
+
+
+- 点击弹窗中 `添加组件` 按钮，在弹出的组件选择面板中，选中需要添加的组件并点击 `下一步`。
+ 
+- 进入组件版本以及描述协议版本选择界面，选择所需要的正确版本，点击 `安装` 即可完成一个组件的添加。
+ 
+
+## 构建资产包
+
+添加完组件以后就点击 `保存并构建资产包` 进入资产包构建配置弹窗
+
+
+- `开启缓存` : 可充分利用之前的构建结果缓存来加速资产包的生成，我们会将每个组件的构建结果以 包名和版本号为 key 进行缓存。
+- `任务描述` : 当前构建任务的一些描述信息。
+
+点击 `确认` 按钮 会自动跳转到当前资产包的构建历史界面：
+
+构建历史界面会显示当前资产包所有的构建历史记录，表格状态栏展示了构建的状态：`成功`,`失败`,`正在运行` 三种状态，操作列可以在构建成功时复制或者下载资产包结果
+
+## 使用资产包
+你可以在 [lowcode-demo](https://github.com/alibaba/lowcode-demo) 中直接引用，可直接替换 demo 中原来的资产包文件：
+例如，在 [demo-lowcode-component](https://github.com/alibaba/lowcode-demo/tree/main/demo-lowcode-component) 中，直接用你的资产包文件替换文件[assets.json](https://github.com/alibaba/lowcode-demo/blob/main/demo-lowcode-component/src/services/assets.json)，即可快速使用自己的物料了。
+
+### 在编辑器中使用资产包
+在使用含有低代码组件的资产包注意 注意引擎版本必须大于等于 `1.1.0-beta.9`。
+然后直接替换 [lowcode-demo](https://github.com/alibaba/lowcode-demo) demo 中的 `assets.json` 文件即可。
+
+### 在预览中使用资产包
+在预览中使用资产包的整体思路是从 `资产包` 中提取并转换出 `ReactRenderer` 渲染所需要的 react 组件列表 (`components` 参数)，然后将 `schema` 以及 `components` 传入到 `ReactRenderer` 中进行渲染，需要注意的是，在 `资产包` 的转换过程中，我们也需要将 `低代码组件` 转换成 react 组件，具体逻辑可以参考下 [demo-lowcode-component](https://github.com/alibaba/lowcode-demo/tree/main/demo-lowcode-component) 中 `src/parse-assets.ts` 文件的实现。
+基于资产包进行预览的整体逻辑如下： [详见](https://github.com/alibaba/lowcode-demo/blob/main/demo-lowcode-component/src/preview.tsx)：
+```ts
+import ReactDOM from 'react-dom';
+import React, { useState } from 'react';
+import { Loading } from '@alifd/next';
+import ReactRenderer from '@alilc/lowcode-react-renderer';
+import { createFetchHandler } from '@alilc/lowcode-datasource-fetch-handler';
+import {
+ getProjectSchemaFromLocalStorage,
+} from './services/mockService';
+import assets from './services/assets.json';
+import { parseAssets } from './parse-assets';
+
+const getScenarioName = function () {
+ if (location.search) {
+ return new URLSearchParams(location.search.slice(1)).get('scenarioName') || 'index';
+ }
+ return 'index';
+};
+
+const SamplePreview = () => {
+ const [data, setData] = useState({});
+ async function init() {
+ const scenarioName = getScenarioName();
+ const projectSchema = getProjectSchemaFromLocalStorage(scenarioName);
+ const { componentsMap: componentsMapArray, componentsTree } = projectSchema;
+ const schema = componentsTree[0];
+ const componentsMap: any = {};
+ componentsMapArray.forEach((component: any) => {
+ componentsMap[component.componentName] = component;
+ });
+
+ // 特别提醒重点注意！！！：从资产包中解析出所有的 react 组件列表
+ const { components } = await parseAssets(assets);
+
+ setData({
+ schema,
+ components,
+ });
+ }
+
+ const { schema, components } = data;
+
+ if (!schema || !components) {
+ init();
+ return
+
+ );
+};
+
+ReactDOM.render(
\ No newline at end of file
diff --git a/docs/docs/guide/expand/editor/parts/partslcc.md b/docs/docs/guide/expand/editor/parts/partslcc.md
new file mode 100644
index 0000000000..4d24b72f3a
--- /dev/null
+++ b/docs/docs/guide/expand/editor/parts/partslcc.md
@@ -0,0 +1,92 @@
+---
+title: 低代码组件
+sidebar_position: 2
+---
+## 什么是低代码组件
+我们先了解一下什么是低代码组件，为什么要用低代码组件。
+
+低代码组件是通过可视化的方式生产的组件，这些组件既可以用于低代码搭建体系，也可以用于 ProCode 开发体系（后续迭代）。
+
+那么为什么我们要使用低代码的形式来开发组件：
+* 首先：轻快，低代码组件只需通过浏览器秒级完成初始化工作，不需要 ProCode 繁重的环境准备；环境一致（低代码环境），同时能够保证物料的开发环境和真实的运行环境是一致的，不会存在开发和运行环境不一致的问题。
+* 其次：通用能力可视化方式抽象，提升研发效能，比如获取远程数据、视图开发、依赖管理、生命周期、事件绑定等功能。
+
+低代码组件不是用来替代 ProCode 的开发方式，而是让开发者可以从 ProCode 中重复的工作脱离出来，抽象更多业务垂直的能力，从而起到提效的作用。
+
+## 创建组件
+
+环境准备：我们可以通过 Parts 提供的通用[低代码组件开发环境](https://parts.lowcode-engine.cn/material#/)开发。
+
+点击开发新组件 --> 填写组件标题 --> 填写组件名称 --> 点击确定，完成组件创建工作。
+
+
+
+## 组件开发
+
+一张图速览低代码组件开发的功能模块，其中大部分功能可以参考[低代码引擎文档](https://lowcode-engine.cn/site/docs/guide/quickStart/intro)。
+
+
+
+### 依赖管理
+
+依赖管理用于管理低代码组件本身的依赖（类似于 dependencies）。步骤：点击添加组件 --> 选择安装的组件 --> 保存并构建 (需要等待几分钟构建)。
+
+
+
+### 属性定义
+
+用于定义组件接收外部传入的 propTypes，组件内部可以通过this.props.${属性名称}的方式获取属性值。
+
+属性定义前建议先阅读 [物料描述详解](https://lowcode-engine.cn/site/docs/guide/expand/editor/metaSpec)、[预置设置器](https://lowcode-engine.cn/site/docs/guide/appendix/setters)。
+
+
+
+
+
+### 生命周期
+
+低代码组件的开发支持 componentDidMount、componentDidUpdate、componentDidCatch、componentWillUnmount 几个生命周期
+
+
+
+### 组件调试
+
+我们提供了一套线上实时调试的方案，只需点击右上角的调试按钮，就能自动创建一个低代码应用，在这个应用中可以实时调试当前的低代码组件。
+
+
+
+在低代码应用中使用，组件面板 --> 低代码组件，找到对应的低代码组件拖入画布即可。
+
+
+
+### 组件发布
+
+同时我们提供了组件发布的功能，用于组件版本管理，点击右上角的发布按钮即可发布组件
+
+
+
+## 组件使用
+
+组件的消费是通过资产包来管理的，详情请参考 [资产包管理](./partsassets)。
+
+## 组件导出
+
+开发好的低代码组件可以导出成为 React 组件，脱离低代码引擎独立使用。同时导出功能也为您的组件留出一份备份，您可以放心使用本产品的服务，而不用担心万一出现的不能服务的场景。
+
+在物料列表页面，低代码组件会有一个导出的动作。
+
+
+
+点击导出后，就会开启导出低代码组件的过程。这个过程持续 10s+，导出完成后会为您自动下载对应的 zip 包。
+
+
+
+zip 包解压后可以看到一个完整的组件脚手架工程，您可以在这个工程里继续开发调试，或者发布到合适的 npm 源中。
+
+
+
+注意：目前导出功能暂不支持 低代码组件嵌套。
+
+## 联系我们
+
+
\ No newline at end of file
diff --git a/docs/docs/guide/expand/editor/parts/prototype.md b/docs/docs/guide/expand/editor/parts/prototype.md
new file mode 100644
index 0000000000..b90728f657
--- /dev/null
+++ b/docs/docs/guide/expand/editor/parts/prototype.md
@@ -0,0 +1,121 @@
+---
+title: React 组件导入
+sidebar_position: 3
+---
+## 介绍
+大家在使用[低代码引擎](https://lowcode-engine.cn/)构建低代码应用平台时，遇到的一个主要问题是如何让已有的 React 组件能够快速低成本地接入进来。这个问题拆解下来主要包括两个子问题：
+1. 如何给已有组件[配置物料描述](/site/docs/specs/material-spec)，
+2. 如何构建出一个低代码引擎能够识别的资产包 (Assets)。
+
+我们的产品「[Parts·造物](https://parts.lowcode-engine.cn/)」可以帮助大家解决这个问题。我们通过在线可视化的方式完成物料描述配置，并且提供一键打包的功能生成引擎可以识别的资产包。
+
+## 导入物料
+首先，我们需要在 [物料管理](/site/docs/specs/material-spec) 页面导入我们需要进行在线物料描述配置的物料。
+
+
+- 点击列表左上方的 导入已有物料 按钮
+- 在弹框中输入 npm 包名
+- 点击 获取包信息 按钮，获取 npm 包基本信息
+- 点击确定，导入成功
+
+
+## 配置管理
+第二步：物料导入以后，我们就可以为导入的物料新增[物料描述配置](/site/docs/specs/material-spec)，点击右侧的组件配置开始配置。
+
+
+### 新增配置
+
+- 点击配置管理右上角的 新增配置
+ - 选择组件的版本号
+ - 填写组件路径，一般和 npm 包的 package.json 里的 main 字段相同（如果填写错误，后面会渲染不出来）
+ - 描述字段用于给这份配置增加一些备注信息。
+
+
+
+为了降低配置成本，第一次新增配置的时候会自动解析组件代码，生成一份初始化组件物料描述。所以需要等待片刻，用于代码解析。解析完成后，点击配置按钮即可进入在线配置界面。
+
+
+
+### 组件描述配置
+操作界面如下，接下来讲具体的配置流程
+
+
+
+#### 新增组件
+
+如果新增配置的过程中，代码自动解析失败或者解析出来的组件列表不满足开发要求，我们可以点击左侧组件列表插件 新增 按钮，添加新的组件，具体的字段描述可以参考提示内容，以 [react-color](https://github.com/casesandberg/react-color) 为例：
+
+
+
+
+#### 给组件增加物料描述
+
+- 打开左侧 Setter 面板
+- 按照组件的属性拖入需要 Setter 类型（如图中组件的 width 属性，拖入数字 Setter）
+- 各种 Setter 的介绍可以参看这篇文档：[预置设置器列表](/site/docs/guide/appendix/setters)
+- 配置属性的基本信息（如图所示）
+- 配置完成后点击右上角的保存
+
+
+
+
+
+#### 高级配置（属性联动）
+
+举个栗子：如图所示，如果期望“设置器”这个配置项的值“被修改”的时候，下面的“默认值”跟着变化。
+
+
+
+如何使用
+
+组件的属性配置目前支持 3 个基本的联动函数：
+
+- 显示状态：返回 true | false，如果返回 true，表示组件配置显示，否则配置时不显示
+- 获取值：当调用该配置节点的 getValue 方法时触发的方法
+- 值变化：当调用该配置节点的 setValue 方法时触发的方法
+
+
+
+方法的第一个参数都是当前配置节点的对象，常用到的有以下几个：
+
+- getValue(): 获取当前节点的值，如果当前节点是子节点的话，否则为 undefined
+- setValue(): 设置当前节点的值，如果当前节点是子节点的话
+- parent: 当前节点的父节点
+- getPropValue(propName): 父节点获取子节点的属性值，propName 为子节点的属性名称
+- setPropValue(propName, value): 父节点设置子节点的属性值，propName 为子节点的属性名称，value 为设置的值
+- getConfig: 获取当前节点的配置，如 title、setter 等
+
+
+#### 调试物料描述
+
+点击右上角的预览按钮，开始调试我们刚刚配置的属性，如果是组件的首次预览，会有一段组件构建的过程（构建出 umd 包的过程），构建完成后就可以调试我们的配置了。
+
+
+
+#### 发布物料描述
+物料描述调试没问题后，就可以到项目中去使用了，使用前需要先发布物料描述
+
+- 点击右上角的发布按钮
+- 选择需要发布的组件
+- 点击确定发布完成
+
+
+## 资产包
+第三步：物料描述发布完成后，接下来我们就需要构建出可用的资产包用于低代码应用中。
+
+#### 资产包构建
+有两种方式可以构建资产包：
+- 一种是通过 [`我的资产包`] 资产包管理模块进行整个资产包生命周期的管理，当然也包括资产包的构建，可参考 [资产包管理](./partsassets)
+- 一种是通过 [`我的物料`] 组件物料管理模块的 `资产包构建` 进行构建, 具体操作如下：
+
+ - 选择需要构建的组件
+ - 点击构建资产包按钮
+ - 选择刚刚的物料描述配置
+ - 开始构建，构建完成后你将得到一份 json 文件（里面包含了物料描述和 umd 包），就可以到项目中使用了
+
+#### 资产包使用
+详情请参考 [资产包管理](./partsassets#使用资产包)
+
+## 联系我们
+
+
diff --git a/docs/docs/guide/expand/editor/pluginContextMenu.md b/docs/docs/guide/expand/editor/pluginContextMenu.md
new file mode 100644
index 0000000000..962c913e7e
--- /dev/null
+++ b/docs/docs/guide/expand/editor/pluginContextMenu.md
@@ -0,0 +1,82 @@
+---
+title: 插件扩展 - 编排扩展
+sidebar_position: 6
+---
+
+## 场景一：扩展选中节点操作项
+
+### 增加节点操作项
+
+
+选中节点后，在选中框的右上角有操作按钮，编排模块默认实现了查看组件直系父节点、复制节点和删除节点按钮外，还可以通过相关 API 来扩展更多操作，如下代码：
+
+```typescript
+import { plugins } from '@alilc/lowcode-engine';
+import { IPublicModelPluginContext, IPublicModelNode } from '@alilc/lowcode-types';
+import { Icon, Message } from '@alifd/next';
+
+const addHelloAction = (ctx: IPublicModelPluginContext) => {
+ return {
+ async init() {
+ ctx.material.addBuiltinComponentAction({
+ name: 'hello',
+ content: {
+ icon: demo
,
+ });
+ ctx.logger.log('打个日志');
+ },
+ destroy() {
+ console.log('我被销毁了~');
+ },
+ };
+};
+
+pluginA.pluginName = 'pluginA';
+
+plugins.register(pluginA, { key: 'test' });
+```
+
+> 如果您想了解抽取出来的插件如何封装成为一个 npm 包并提供给社区，可以参考[“低代码生态脚手架 & 调试机制”](./cli)章节。
+
+## 面板插件配置说明
+
+面板插件是作用于设计器的，主要是通过按钮、图标等展示在设计器的骨架中。设计器的骨架我们分为下面的几个区域，而我们的插件大多数都是作用于这几个区域的。
+
+
+
+
+
+### 展示区域 area
+
+#### topArea
+
+展示在设计器的顶部区域，常见的相关区域的插件主要是：、
+
+1. 注册设计器 Logo；
+2. 设计器操作回退和撤销按钮；
+3. 全局操作按钮，例如：保存、预览等；
+
+#### leftArea
+
+左侧区域的展示形式大多数是 Icon 和对应的面板，通过点击 Icon 可以展示对应的面板并隐藏其他的面板。
+
+该区域相关插件的主要有：
+
+1. 大纲树展示，展示该设计器设计页面的大纲。
+2. 组件库，展示注册到设计器中的组件，点击之后，可以从组件库面板中拖拽到设计器的画布中。
+3. 数据源面板
+4. JS 等代码面板。
+
+可以发现，这个区域的面板大多数操作时是不需要同时并存的，且交互比较复杂的，需要一个更整块的区域来进行操作。
+
+#### centerArea
+
+画布区域，由于画布大多数是展示作用，所以一般扩展的种类比较少。常见的扩展有：
+
+1. 画布大小修改
+2. 物料选中扩展区域修改
+
+#### rightArea
+
+右侧区域，常用于组件的配置。常见的扩展有：统一处理组件的配置项，例如统一删除某一个配置项，统一添加某一个配置项的。
+
+#### toolbar
+
+跟 topArea 类似，按需放置面板插件~
+
+### 展示形式 type
+
+#### PanelDock
+
+PanelDock 是以面板的形式展示在设计器的左侧区域的。其中主要有两个部分组成，一个是图标，一个是面板。当点击图标时可以控制面板的显示和隐藏。
+
+下图是组件库插件的展示效果。
+
+
+
+其中右上角可以进行固定，可以对弹出的宽度做设定
+
+接入可以参考代码
+
+```javascript
+import { skeleton } from '@alilc/lowcode-engine';
+
+skeleton.add({
+ area: 'leftArea', // 插件区域
+ type: 'PanelDock', // 插件类型，弹出面板
+ name: 'sourceEditor',
+ content: SourceEditor, // 插件组件实例
+ props: {
+ align: "left",
+ icon: "wenjian",
+ description: "JS 面板",
+ },
+ panelProps: {
+ floatable: true, // 是否可浮动
+ height: 300,
+ hideTitleBar: false,
+ maxHeight: 800,
+ maxWidth: 1200,
+ title: "JS 面板",
+ width: 600,
+ },
+});
+```
+
+#### Widget
+
+Widget 形式是直接渲染在当前编辑器的对应位置上。如 demo 中在设计器顶部的所有组件都是这种展现形式。
+
+
+
+接入可以参考代码：
+
+```javascript
+import { skeleton } from '@alilc/lowcode-engine';
+// 注册 logo 面板
+skeleton.add({
+ area: 'topArea',
+ type: 'Widget',
+ name: 'logo',
+ content: Logo, // Widget 组件实例
+ contentProps: { // Widget 插件 props
+ logo:
+ "https://img.alicdn.com/tfs/TB1_SocGkT2gK0jSZFkXXcIQFXa-66-66.png",
+ href: "/",
+ },
+ props: {
+ align: 'left',
+ width: 100,
+ },
+});
+```
+
+#### Dock
+
+一个图标的表现形式，可以用于语言切换、跳转到外部链接、打开一个 widget 等场景。
+
+```javascript
+import { skeleton } from '@alilc/lowcode-engine';
+
+skeleton.add({
+ area: 'leftArea',
+ type: 'Dock',
+ name: 'opener',
+ props: {
+ icon: Icon, // Icon 组件实例
+ align: 'bottom',
+ onClick: function () {
+ // 打开外部链接
+ window.open('https://lowcode-engine.cn');
+ // 显示 widget
+ skeleton.showWidget('xxx');
+ }
+ }
+});
+```
+
+#### Panel
+
+一般不建议单独使用，通过 PanelDock 使用~
+
+## 实际案例
+
+### 页面管理面板
+
+- 仓库地址：[https://github.com/mark-ck/lowcode-portal](https://github.com/mark-ck/lowcode-portal)
+- 具体代码：[https://github.com/mark-ck/lowcode-portal/blob/master/src/plugins/pages-plugin/index.tsx](https://github.com/mark-ck/lowcode-portal/blob/master/src/plugins/pages-plugin/index.tsx)
+- 直播回放：
+ - [低代码引擎项目实战 (4)-自定义插件 - 页面管理](https://www.bilibili.com/video/BV17a411i73f/)
+ - [低代码引擎项目实战 (4)-自定义插件 - 页面管理 - 后端](https://www.bilibili.com/video/BV1uZ4y1U7Ly/)
+ - [低代码引擎项目实战 (4)-自定义插件 - 页面管理 - 前端](https://www.bilibili.com/video/BV1Yq4y1a74P/)
+ - [低代码引擎项目实战 (4)-自定义插件 - 页面管理 - 完结](https://www.bilibili.com/video/BV13Y4y1e7EV/)
+
+### 区块面板
+
+- 仓库地址：[https://github.com/alibaba/lowcode-plugins](https://github.com/alibaba/lowcode-plugins)
+- 具体代码：[https://github.com/alibaba/lowcode-plugins/tree/main/packages/plugin-block](https://github.com/alibaba/lowcode-plugins/tree/main/packages/plugin-block)
+- 直播回放：
+ - [低代码引擎项目实战 (9)-区块管理 (1)-保存为区块](https://www.bilibili.com/video/BV1YF411M7RK/)
+ - [低代码引擎项目实战 (10)-区块管理 - 区块面板](https://www.bilibili.com/video/BV1FB4y1S7tu/)
+ - [阿里巴巴低代码引擎项目实战 (11)-区块管理 - ICON 优化](https://www.bilibili.com/video/BV1zr4y1H7Km/)
+ - [阿里巴巴低代码引擎项目实战 (11)-区块管理 - 自动截图](https://www.bilibili.com/video/BV1GZ4y117VH/)
+ - [阿里巴巴低代码引擎项目实战 (11)-区块管理 - 样式优化](https://www.bilibili.com/video/BV1Pi4y1S7ZT/)
+ - [阿里低代码引擎项目实战 (12)-区块管理 (完结)-给引擎插件提个 PR](https://www.bilibili.com/video/BV1hB4y1277o/)
diff --git a/docs/docs/guide/expand/editor/setter.md b/docs/docs/guide/expand/editor/setter.md
new file mode 100644
index 0000000000..4f0e0219fc
--- /dev/null
+++ b/docs/docs/guide/expand/editor/setter.md
@@ -0,0 +1,241 @@
+---
+title: 设置器扩展
+sidebar_position: 7
+---
+## 设置器简述
+
+设置器主要用于低代码组件属性值的设置，顾名思义叫"设置器"，又称为 Setter。由于组件的属性有各种类型，需要有与之对应的设置器支持，每一个设置器对应一个值的类型。
+
+### 设计器展示位置
+
+设置器展示在编辑器的右边区域，如下图：
+
+
+
+其中包含四类设置器：
+
+- 属性：展示该物料常规的属性
+- 样式：展示该物料样式的属性
+- 事件：如果该物料有声明事件，则会出现事件面板，用于绑定事件。
+- 高级：两个逻辑相关的属性，**条件渲染**和**循环**
+
+### 设置器类型
+
+上述区域中是有多项设置器的，对于一个组件来说，每一项配置都对应一个设置器，比如我们的配置是一个文本，我们需要的是文本设置器，我们需要配置的是数字，我们需要的就是数字设置器。
+下图中的标题和按钮类型配置就分别是文本设置器和下拉框设置器。
+
+
+
+我们提供了常用的设置器作为内置设置器，也提供了定制能力帮助大家开发特定需求的设置器。
+
+## 为物料配置设置器
+
+我们提供了[常用的设置器](/site/docs/guide/appendix/setters)作为内置设置器。
+
+我们可以将目标组件的属性值类型值配置到物料资源配置文件中：
+
+```json
+{
+ "componentName": "Message",
+ "title": "Message",
+ "configure": {
+ "props": [
+ {
+ "name": "type",
+ "setter": "InputSetter"
+ }
+ ]
+ }
+}
+```
+
+props 字段是入料模块扫描自动填入的类型，用户可以通过 configure 节点进行配置通过 override 节点对属性的声明重新定义，setter 就是注册在引擎中的 setter。
+
+为物料配置引擎内置的 setter 时，均可以使用对应 setter 的高级功能，对应功能参考“全部内置设置器”章节下的对应 setter 文章。
+
+### 对高级功能的配置如下：
+
+例如我们需要在 NumberSetter 中配置 units 属性，可以在 asset.json 中声明。
+
+```json
+"configure": {
+ "component": {
+ "isContainer": true,
+ "nestingRule": {
+ "parentWhitelist": [
+ "NextP"
+ ]
+ }
+ },
+ "props": [
+ {
+ "name": "width",
+ "title": "宽度",
+ "initialValue": "auto",
+ "defaultValue": "auto",
+ "condition": {
+ "type": "JSFunction",
+ "value": "() => false"
+ },
+ "setter": {
+ "componentName": "NumberSetter",
+ "props": {
+ "units": [
+ {
+ "type": "px",
+ "list": true
+ },
+ {
+ "type": "%",
+ "list": true
+ }
+ ]
+ }
+ }
+ },
+ ],
+ "supports": {
+ "style": true
+ }
+},
+```
+
+## 自定义设置器
+### 编写 AltStringSetter
+
+我们编写一个简单的 Setter，它的功能如下：
+
+
+
+**代码如下：**
+```tsx
+import * as React from "react";
+import { Input } from "@alifd/next";
+import "./index.scss";
+
+interface AltStringSetterProps {
+ // 当前值
+ value: string;
+ // 默认值
+ defaultValue: string;
+ // setter 唯一输出
+ onChange: (val: string) => void;
+ // AltStringSetter 特殊配置
+ placeholder: string;
+}
+
+export default class AltStringSetter extends React.PureComponent
+
+ );
+};
+
+ReactDOM.render(
+
+ );
+ }
+}
+```
+
+## API
+
+| 参数 | 说明 | 类型 | 必选 |
+| --- | --- | --- | --- |
+| schema | 符合[搭建协议](https://lowcode-engine.cn/lowcode)的数据 | Object | 是 |
+| components | 组件依赖的实例 | Object | 是 |
+| componentsMap | 组件的配置信息 | Object | 否 |
+| appHelper | 渲染模块全局上下文 | Object | 否 |
+| designMode | 设计模式，可选值：extend、border、preview | String | 否 |
+| suspended | 是否挂起 | Boolean | 否 |
+| onCompGetRef | 组件 ref 回调（schema, ref）=> {} | Function | 否 |
+| onCompGetCtx | 组件 ctx 更新回调 (schema, ctx) => {} | Function | 否 |
+| rendererName | 渲染类型，标识当前模块是以什么类型进行渲染的 | string | 否 |
+| customCreateElement | 自定义创建 element 的钩子
+(Component, props, children) => {} | Function | 否 |
+| notFoundComponent | 当组件找不到时，可以通过这个参数自定义展示文案。 | Component | 否 |
+| thisRequiredInJSE | 为 true 的情况下 JSExpression 仅支持通过 this 来访问。假如需要兼容原来的 'state.xxx'，则设置为 false，推荐使用 true。 | Boolean | 否 |
+| locale | 国际化语言类型 | string | 否 |
+| messages | 国际化语言对象 | Object | 否 |
+
+
+### schema
+
+搭建基础协议数据，渲染模块将基于 schema 中的内容进行实时渲染。
+
+### messages
+国际化内容，需要配合 locale 使用
+messages 格式示例：
+```typescript
+{
+ 'zh-CN': {
+ 'hello-world': '你好，世界！',
+ },
+ 'en-US': {
+ 'hello-world': 'Hello world!',
+ },
+}
+```
+
+### locale
+当前语言类型
+示例：'zh-CN' | 'en-US'
+
+### components
+
+渲染模块渲染页面需要用到的组件依赖的实例，`components` 对象中的 Key 需要和搭建 schema 中的`componentName` 字段对应。
+
+### componentsMap
+
+> 在生产环境下不需要设置。
+
+
+配置规范参见[《低代码引擎搭建协议规范》](https://lowcode-engine.cn/lowcode)，主要在搭建场景中使用，用于提升用户搭建体验。
+
+- 属性配置校验：用户可以配置组件特定属性的 `propTypes`，在搭建场景中用户输入的属性值不满足 `propType` 配置时，渲染模块会将当前属性设置为 `undefined`，避免组件抛错导致编辑器崩溃；
+- `isContainer` 标记：当组件被设置为容器组件且当前容器组件内没有其他组件时，用户可以通过拖拽方式将组件直接添加到容器组件内部；
+- `parentRule` 校验：当用户使用的组件未出现在组件配置的 `parentRule` 组件内部时，渲染模块会使用 `visualDom` 组件进行占位，避免组件抛错的同时在下钻编辑场景也能够不阻塞用户配置，典型的场景如`Step.Item`、`Table.Column`、`Tab.Item` 等等。
+
+### appHelper
+
+appHelper 主要用于设置渲染模块的全局上下文，目前 appHelper 支持设置以下上下文：
+
+- `utils`：全局公共函数
+- `constants`：全局常量
+- `location`：react-router 的 `location` 实例
+- `history`：react-router 的 `history` 实例
+
+设置了 appHelper 以后，上下文会直接挂载到容器组件的 this 上，用户可以在搭建协议中的 function 及变量表达式场景使用上下文，具体使用方式如下所示：
+**schema：**
+
+```javascript
+export default {
+ "componentName": "Page",
+ "fileName": "test",
+ "props": {},
+ "children": [{
+ "componentName": "Div",
+ "props": {},
+ "children": [{
+ "componentName": "Text",
+ "props": {
+ "text": {
+ "type": "JSExpression",
+ "value": "this.location.pathname"
+ }
+ }
+ }, {
+ "componentName": "Button",
+ "props": {
+ "type": "primary",
+ "style": {
+ "marginLeft": 10
+ },
+ "onClick": {
+ "type": "JSExpression",
+ "value": "function onClick(e) { this.utils.xxx(this.constants.yyy);}"
+ }
+ },
+ "children": "click me"
+ }]
+ }]
+}
+```
+
+```typescript
+import ReactRenderer from '@alilc/lowcode-react-renderer';
+import ReactDOM from 'react-dom';
+import { Button } from '@alifd/next';
+import schema from './schema'
+
+const components = {
+ Button,
+};
+
+ReactDOM.render((
+ **对于 Window 环境来说，之后所有需要执行命令的操作都是在 WSL 终端执行的。** + +### Node + +node 版本推荐 16.18.0。 + +#### 查看 Node 版本 + + + +#### 通过 n 来管理 node 版本 + +可以安装 [n](https://www.npmjs.com/package/n) 来管理和变更 node 版本。 + +##### 安装 n + +```bash +npm install -g n +``` + +##### 变更 node 版本 + +```bash +n 14.17.0 +``` + +### React + +低代码引擎的扩展能力都是基于 React 来研发的，在继续阅读之前最好有一定的 React 基础，React 学习教程 ➡️ [React 快速开始教程](https://zh-hans.reactjs.org/docs/getting-started.html)。 + +### 下载 Demo + +可以前往 github（
这是一个 Demo 面板
,
+ });
+
+ ctx.logger.log('打个日志');
+ },
+ };
+};
+
+// 插件名，注册环境下唯一
+LowcodePluginPluginDemo.pluginName = 'LowcodePluginPluginDemo';
+LowcodePluginPluginDemo.meta = {
+ // 依赖的插件（插件名数组）
+ dependencies: [],
+ engines: {
+ lowcodeEngine: '^1.0.0', // 插件需要配合 ^1.0.0 的引擎才可运行
+ },
+};
+
+export default LowcodePluginPluginDemo;
+```
+
+在 src/index.ts 中新增下面代码
+
+
+
+这样在我们的设计器中就新增了一个 Demo 面板。
+
+
+
+### 方式 2：在新的仓库下开发插件
+
+初始化
+
+```bash
+npm init @alilc/element your-plugin-name
+```
+
+选择设计器插件（plugin）
+
+
+
+根据操作完善信息
+
+
+
+插件项目就初始化完成了
+
+
+
+在插件项目下安装依赖
+
+```bash
+npm install
+```
+
+启动项目
+
+```bash
+npm run start
+```
+
+调试项目
+
+
+
+在 Demo 中调试项目
+
+在 build.json 下面新增 "inject": true，就可以在 [https://lowcode-engine.cn/demo/demo-general/index.html?debug](https://lowcode-engine.cn/demo/demo-general/index.html?debug) 页面下进行调试了。
+
+
+
+## 开发一个自定义物料
+
+### 初始化物料
+
+```bash
+npm init @alilc/element your-material-demo
+```
+
+选择组件/物料栏
+
+
+
+配置其他信息
+
+
+
+这样我们就初始化好了一个 React 物料。
+
+
+
+### 启动并调试物料
+
+#### 安装依赖
+
+```bash
+npm i
+```
+
+#### 启动
+
+```bash
+npm run lowcode:dev
+```
+
+我们就可以通过 [http://localhost:3333/](http://localhost:3333/) 看到我们的研发的物料了。
+
+
+
+#### 在 Demo 中调试
+
+```bash
+npm i @alilc/build-plugin-alt
+```
+
+修改 build.lowcode.js
+
+
+
+如图，新增如下代码
+
+```javascript
+[
+ '@alilc/build-plugin-alt',
+ {
+ type: 'component',
+ inject: true,
+ library,
+ // 配置要打开的页面，在注入调试模式下，不配置此项的话不会打开浏览器
+ // 支持直接使用官方 demo 项目：https://lowcode-engine.cn/demo/index.html
+ openUrl: 'https://lowcode-engine.cn/demo/index.html?debug',
+ },
+],
+```
+
+我们重新启动项目，就可以在 Demo 中找到我们的自定义组件。
+
+
+
+### 发布
+
+首先进行构建
+
+```bash
+npm run lowcode:build
+```
+
+发布组件
+
+```bash
+npm publish
+```
+
+这里我发布的组件是 [my-material-demo](https://www.npmjs.com/package/my-material-demo)。在发布之后我们就会有两个重要的文件：
+
+- 低代码描述：[https://unpkg.com/my-material-demo@0.1.0/build/lowcode/meta.js](https://unpkg.com/my-material-demo@0.1.0/build/lowcode/meta.js)
+- 组件代码：[https://unpkg.com/my-material-demo@0.1.0/build/lowcode/render/default/view.js](https://unpkg.com/my-material-demo@0.1.0/build/lowcode/render/default/view.js)
+
+我们也可以从 [https://unpkg.com/my-material-demo@0.1.0/build/lowcode/assets-prod.json](https://unpkg.com/my-material-demo@0.1.0/build/lowcode/assets-prod.json) 找到我们的资产包描述。
+
+```bash
+{
+ "packages": [
+ {
+ "package": "my-material-demo",
+ "version": "0.1.0",
+ "library": "BizComp",
+ "urls": [
+ "https://unpkg.com/my-material-demo@0.1.0/build/lowcode/render/default/view.js",
+ "https://unpkg.com/my-material-demo@0.1.0/build/lowcode/render/default/view.css"
+ ],
+ "editUrls": [
+ "https://unpkg.com/my-material-demo@0.1.0/build/lowcode/view.js",
+ "https://unpkg.com/my-material-demo@0.1.0/build/lowcode/view.css"
+ ],
+ "advancedUrls": {
+ "default": [
+ "https://unpkg.com/my-material-demo@0.1.0/build/lowcode/render/default/view.js",
+ "https://unpkg.com/my-material-demo@0.1.0/build/lowcode/render/default/view.css"
+ ]
+ },
+ "advancedEditUrls": {}
+ }
+ ],
+ "components": [
+ {
+ "exportName": "MyMaterialDemoMeta",
+ "npm": {
+ "package": "my-material-demo",
+ "version": "0.1.0"
+ },
+ "url": "https://unpkg.com/my-material-demo@0.1.0/build/lowcode/meta.js",
+ "urls": {
+ "default": "https://unpkg.com/my-material-demo@0.1.0/build/lowcode/meta.js"
+ },
+ "advancedUrls": {
+ "default": [
+ "https://unpkg.com/my-material-demo@0.1.0/build/lowcode/meta.js"
+ ]
+ }
+ }
+ ],
+}
+```
+
+### 使用
+
+我们将刚刚发布的组件的 assets-prod.json 的内容放到 demo 的 src/universal/assets.json 中。
+
+> 最好放到最后，防止因为资源加载顺序问题导致出现报错。
+
+如图，新增 packages 配置
+
+
+如图，新增 components 配置
+
+
+
+这时候再启动 DEMO 项目，就会有新的低代码物料了。接下来就按照你们的需求，继续扩展物料吧。
+
+## 总结
+
+这里只是简单的介绍了一些低代码引擎的基础能力，带大家简单的对低代码 DEMO 进行扩展，定制一些新的功能。低代码引擎的能力还有很多很多，可以继续去探索更多的功能。
diff --git a/docs/code-specification.md b/docs/docs/participate/code-specification.md
similarity index 90%
rename from docs/code-specification.md
rename to docs/docs/participate/code-specification.md
index 0a7c9f5556..d6b387e305 100644
--- a/docs/code-specification.md
+++ b/docs/docs/participate/code-specification.md
@@ -1,3 +1,8 @@
+---
+title: 编码规约
+sidebar_position: 5
+---
+
编码规约
---
@@ -22,7 +27,7 @@
- 不要在全局命名空间内定义类型/值
- 共享的类型应该在 `types.ts` 里定义
- 在一个文件里，类型定义应该出现在顶部
- - interface 和 type 很类似，原则上能用 interface 实现，就用 interface , 如果不能才用 type
+ - interface 和 type 很类似，原则上能用 interface 实现，就用 interface , 如果不能才用 type
### 注释
diff --git a/docs/docs/participate/flow.md b/docs/docs/participate/flow.md
new file mode 100644
index 0000000000..b8b804e123
--- /dev/null
+++ b/docs/docs/participate/flow.md
@@ -0,0 +1,187 @@
+---
+title: 研发协作流程
+sidebar_position: 2
+---
+## 代码风格
+引擎项目配置了 eslint 和 stylelint，在每次 git commit 前都会检查代码风格，假如有报错，请修改后再提交。（**严禁 -n 提交，-n 也逃脱不了 github workflow 的 lint 检查，放弃吧，骚年~**）
+
+## 测试机制
+每次提交代码前，务必本地跑一次单元测试，通过后再提交 MR。
+
+假如涉及新的功能，需要**补充相应的单元测试**，目前引擎核心模块的单测覆盖率都在 80%+，假如降低了覆盖率，将会不予以通过。
+
+跑单测流程：
+
+1. 项目根目录下执行 npm run build
+2. 只改了一个包，比如 designer，则在 designer 目录下，执行 npm test
+3. （or）改了多个包，则在根目录下执行 npm test
+## commit 风格
+几点要求：
+
+1. commit message 格式遵循 [ConvensionalCommits](https://www.conventionalcommits.org/en/v1.0.0/#summary)
+
+ 
+2. 请按照一个 bugfix / feature 对应一个 commit，假如不是，请 rebase 后再提交 MR，不要一堆无用的、试验性的 commit。
+
+好处：从引擎的整体 commit 历史来看，会很清晰，**每个 commit 完成一件确定的事，changelog 也能自动生成**。另外，假如因为某个 commit 导致了 bug，也很容易通过 rebase drop 等方式快速修复。
+
+## 分支用途
+
+- main 分支，最稳定的分支，跟 npm latest 包的内容保持一致
+- develop 分支，开发分支，拥有最新的、已经验证过的 feature / bugfix，Pull Request 的**目标合入分支**
+- release 分支
+ - 正式发布分支，命名规则为 release/x.y.z，一般从 develop 拉出来进行发布，x.y.z 为待发布的版本号
+ - beta 发布分支，命名规则为 release/x.y.z-beta(\.\d+)?，可以快速验证修改，发布 npm beta 版本。
+
+验证通过后，因为 beta 发布分支上会存在无用的 commit（比如 lerna 修改 package.json 这种），所以不直接 PR 到 develop，而是从 develop 拉分支，从 beta 发布分支 cherry pick 有用的 commit 到新分支，然后 PR 到 develop。
+
+## 引擎发布机制
+
+日常迭代先从 develop 拉分支，然后自测、单测通过后，提交 PR 到 develop 分支，由发布负责人基于 develop 拉 release/1.0.z 分支~
+
+### 版本规划
+
+> 此处是理想节奏，实际情况可能会有调整
+
+- 日常迭代 2 周，一般月中或月底，发版日两天前发最后一个 beta 版本，原则上不接受新 pr，灰度 2 天后，发正式版。
+- 特殊情况紧急迭代随时发
+- 大 Feature 迭代，每年 2 - 4 次
+
+
+### 发布步骤
+> **发布需要权限，如果提 PR 之后着急发布可以**[**加入贡献者交流群**](../participate/#核心贡献者交流)**。**
+
+#### 发正式版
+步骤如下（以发布 1.0.0 版本为例）：
+
+1. git checkout develop
+ ```bash
+ git checkout develop
+ ```
+2. 创建 release 分支
+ ```bash
+ git checkout -b release/1.0.0
+ ```
+3. build
+ ```bash
+ npm run build
+ ```
+4. 发布到 npm
+ ```bash
+ npm run pub
+ ```
+5. 同步到 tnpm 源 & alifd CDN & uipaas CDN（此步骤将发布在 npm 源的包同步到阿里内网源，因为 alifd cdn 将依赖内网 npm 源）
+ ```bash
+ tnpm run sync
+ tnpm run syncOss
+ ```
+6. 更新[发布日志](https://github.com/alibaba/lowcode-engine/releases)
+7. 合并 release/x.x.x 到 main 分支
+8. 合并 main 分支到 develop 分支
+
+如果是发布 beta 版本，步骤如下（以发布 1.0.1 版本为例）：
+
+#### 发某 y 位版本首个 beta，如 1.1.0-beta.0
+1. 拉 develop 分支
+ ```bash
+ git checkout develop
+ ```
+ 更新到最新（如需）
+ ```bash
+ git pull
+ ```
+2. 拉 release 分支，此处以 1.1.0 版本做示例
+ ```bash
+ git checkout -b release/1.1.0-beta
+ git push --set-upstream origin release/1.1.0-beta
+ ```
+3. build
+ ```bash
+ npm run build
+ ```
+4. 发布，此处需有 @alilc scope 发包权限
+ ```bash
+ npm run pub:preminor
+ ```
+5. 同步到 tnpm 源 & alifd CDN & uipaas CDN
+ ```bash
+ tnpm run sync
+ tnpm run syncOss
+ ```
+
+#### 发某 z 位版本首个 beta，如 1.0.1-beta.0
+1. 拉 develop 分支
+ ```bash
+ git checkout develop
+ ```
+ 更新到最新（如需）
+ ```bash
+ git pull
+ ```
+2. 拉 release 分支，此处以 1.0.1 版本做示例
+ ```bash
+ git checkout -b release/1.0.1-beta
+ git push --set-upstream origin release/1.0.1-beta
+ ```
+3. build
+ ```bash
+ npm run build
+ ```
+4. 发布，此处需有 @alilc scope 发包权限
+ ```bash
+ npm run pub:prepatch
+ ```
+5. 同步到 tnpm 源 & alifd CDN & uipaas CDN
+ ```bash
+ tnpm run sync
+ tnpm run syncOss
+ ```
+
+#### 发某版本非首个 beta，如 1.0.1-beta.0 -> 1.0.1-beta.1
+1. 切换到 release 分支
+ ```bash
+ git checkout release/1.0.1-beta
+ ```
+2. 更新到 develop 分支最新代码
+ ```bash
+ git rebase origin/develop
+ ```
+3. build
+ ```bash
+ npm run build
+ ```
+4. 发布，此处需有 @alilc scope 发包权限 ***此处命令与发首个 beta 时有变化***
+ ```bash
+ npm run pub:prerelease
+ ```
+5. 同步到 tnpm 源 & alifd CDN & uipaas CDN
+ ```bash
+ tnpm run sync
+ tnpm run syncOss
+ ```
+
+
+
+## DEMO 发布机制
+1. **修改版本号**
+ 手动修改 package.json 的版本号
+2. **build**
+ ```bash
+ npm run build
+ ```
+3. publish（此步骤需要 npm 发包权限）
+ ```bash
+ npm run pub
+ ```
+ 如发 beta 版
+ ```bash
+ npm publish --tag beta
+ ```
+4. 同步到 tnpm 源 & alifd CDN & uipaas CDN
+ ```bash
+ tnpm run sync
+ tnpm run syncOss
+ ```
+
+**官网生效**
+需要在通过阿里内部系统更新 demo 版本
diff --git a/docs/docs/participate/index.md b/docs/docs/participate/index.md
new file mode 100644
index 0000000000..e09f2ddad2
--- /dev/null
+++ b/docs/docs/participate/index.md
@@ -0,0 +1,118 @@
+---
+title: 参与贡献
+sidebar_position: 0
+---
+
+### 环境准备
+
+开发 LowcodeEngine 需要 Node.js 16+。
+
+推荐使用 nvm 管理 Node.js，避免权限问题的同时，还能够随时切换当前使用的 Node.js 的版本。
+
+### 贡献低代码引擎
+
+#### clone 项目
+
+```
+git clone git@github.com:alibaba/lowcode-engine.git
+cd lowcode-engine
+```
+
+#### 安装依赖并构建
+
+```
+npm install && npm run setup
+```
+
+#### 调试环境配置
+
+本质上是将 demo 页面引入的几个 js/css 代理到 engine 项目，可以使用趁手的代理工具，这里推荐 [XSwitch](https://chrome.google.com/webstore/detail/xswitch/idkjhjggpffolpidfkikidcokdkdaogg?hl=en-US)。
+
+本地开发代理规则如下：
+```json
+{
+ "proxy": [
+ [
+ "https://uipaas-assets.com/prod/npm/@alilc/lowcode-engine/(.*)/dist/js/engine-core.js",
+ "http://localhost:5555/js/AliLowCodeEngine.js"
+ ],
+ [
+ "https://uipaas-assets.com/prod/npm/@alilc/lowcode-engine/(.*)/dist/css/engine-core.css",
+ "http://localhost:5555/css/AliLowCodeEngine.css"
+ ],
+ [
+ "https?://uipaas-assets.com/prod/npm/@alilc/lowcode-engine/(.*)/dist/js/react-simulator-renderer.js",
+ "http://localhost:5555/js/ReactSimulatorRenderer.js"
+ ],
+ [
+ "https?://uipaas-assets.com/prod/npm/@alilc/lowcode-engine/(.*)/dist/css/react-simulator-renderer.css",
+ "http://localhost:5555/css/ReactSimulatorRenderer.css"
+ ]
+ ]
+}
+```
+
+#### 开发
+
+```
+npm start
+```
+
+选择一个环境进行调试，例如[低代码引擎在线 DEMO](https://lowcode-engine.cn/demo/demo-general/index.html)
+
+开启代理之后，就可以进行开发调试了。
+
+
+### 贡献低代码引擎文档
+
+#### 开发文档
+
+在 lowcode-engine 目录下执行下面命令
+```
+cd docs
+
+npm start
+```
+
+#### 维护方式
+- 官方文档通过 github 管理文档源，官网文档与[主仓库 develop 分支](https://github.com/alibaba/lowcode-engine/tree/develop/docs)保持同步。
+- 点击每篇文档下发的 `编辑此页` 可直接定位到 github 中位置。
+- 欢迎 PR，文档 PR 也会作为贡献者贡献，会用于贡献度统计。
+- **文档同步到官方网站由官方人员进行操作**，如有需要可以通过 issue 或 贡献者群与相关人员沟通。
+- 为了提供更好的阅读和使用体验，文档中的图片文件会定期转换成可信的 CDN 地址。
+
+#### 文档格式
+
+本项目文档参考[文档编写指南](https://github.com/sparanoid/chinese-copywriting-guidelines)。
+
+使用 vscode 进行编辑的朋友可以安装 vscode 插件 [huacnlee.autocorrect](https://github.com/huacnlee/autocorrect) 辅助文档 lint。
+
+
+### 贡献低代码引擎生态
+
+相关源码详见[NPM 包对应源码位置汇总](/site/docs/guide/appendix/npms)
+
+开发调试方式详见[低代码生态脚手架 & 调试机制](/site/docs/guide/expand/editor/cli)
+
+### 发布
+
+PR 被合并之后，我们会尽快发布相关的正式版本或者 beta 版本。
+
+### 加入 Contributor 群
+提交过 Bugfix 或 Feature 类 PR 的同学，如果有兴趣一起参与维护 LowcodeEngine，我们提供了一个核心贡献者交流群。
+
+1. 可以通过[填写问卷](https://survey.taobao.com/apps/zhiliao/4YEtu9gHF)的方式，参与到其中。
+2. 填写问卷后加微信号 `wxidvlalalalal` （注明 github id）我们会拉你到群里。
+
+如果你不知道可以贡献什么，可以到源码里搜 TODO 或 FIXME 找找。
+
+为了使你能够快速上手和熟悉贡献流程，我们这里有个列表 [good first issues](https://github.com/alibaba/lowcode-engine/issues?q=is:open+is:issue+label:%22good+first+issue%22)，里面有相对没那么笼统的漏洞，从这开始是个不错的选择。
+
+### PR 提交注意事项
+
+- lowcode-engine 仓库建议从 develop 创建分支，PR 指向 develop 分支。
+- 其他仓库从 main 分支创建分支，PR 指向 main 分支
+- 如果你修复了 bug 或者添加了代码，而这些内容需要测试，请添加测试！
+- 确保通过测试套件（yarn test）。
+- 请签订贡献者许可证协议（Contributor License Agreement）。
+ > 如已签署 CLA 仍被提示需要签署，[解决办法](/site/docs/faq/faq021)
\ No newline at end of file
diff --git a/docs/docs/participate/meet.md b/docs/docs/participate/meet.md
new file mode 100644
index 0000000000..23226bf1cd
--- /dev/null
+++ b/docs/docs/participate/meet.md
@@ -0,0 +1,55 @@
+---
+title: 开源社区例会
+sidebar_position: 0
+---
+
+## **简介**
+
+低代码引擎开源社区致力于共同推动低代码技术的发展和创新。本社区汇集了低代码技术领域的开发者、技术专家和行业观察者，通过定期的例会来交流思想、分享经验、讨论新技术，并探索低代码技术的未来发展方向。
+
+## 参与要求
+
+为了确保例会的质量和效果，我们建议以下人员参加：
+
+- **已参与低代码引擎贡献的成员**：那些对低代码引擎有实际贡献的社区成员。
+- **参考贡献指南**：可查阅[贡献指南](https://lowcode-engine.cn/site/docs/participate/)获取更多信息。
+- **提供过优秀建议的成员**：那些在过去为低代码引擎提供过有价值建议的成员。
+
+## **时间周期**
+
+- **周期性**：月例会
+
+### **特别说明**
+
+- 例会周期可根据成员反馈进行调整。如果讨论的议题较多，可增加例会频率；若议题较少，单次例会可能取消。若多次取消，可能会暂停例会。
+
+## **例会流程**
+
+### **准备阶段**
+
+- **定期确定议题**：会前一周确定下一次会议的议题。
+- **分发会议通知**：提前发送会议时间、议程和参与方式。
+
+### **会议阶段**
+
+- **开场和介绍**：简短开场和自我介绍，特别是新成员加入时。
+- **议题讨论**：按照议程进行议题讨论，每个议题分配一定时间，并留足够时间供讨论和提问。
+- **记录要点和决定**：记录讨论要点、决策和任何行动事项。
+
+### **后续阶段**
+
+- **分享会议纪要**：会后将会议纪要和行动计划分发给所有成员。
+- **执行和跟进**：根据会议中的讨论和决策执行相关任务，并在下次会议中进行跟进汇报。
+
+## **开源例会议题**
+
+开源例会议题包括但不限于：
+
+- **共建低代码行业发展**：探讨通过开源社区合作加速低代码行业发展。
+- **改进建议和反馈收集**：讨论社区成员对低代码引擎的使用体验和改进建议。
+- **前端技术与低代码的结合**：针对前端开发者，讨论将前端技术与低代码引擎结合的方式。
+- **低代码业务场景和经验分享**：邀请社区成员分享低代码引擎的实际应用经验。
+- **低代码技术原理介绍**：深入理解低代码引擎的技术原理和实现方式。
+- **低代码引擎的最新进展**：分享低代码引擎的最新进展，包括新版本发布和新功能实现等。
+- **低代码技术的未来展望**：讨论低代码技术的未来发展方向。
+- **最新低代码平台功能和趋势分析**：分享和讨论当前低代码平台的新功能、趋势和发展方向。
\ No newline at end of file
diff --git a/specs/assets-spec.md b/docs/docs/specs/assets-spec.md
similarity index 93%
rename from specs/assets-spec.md
rename to docs/docs/specs/assets-spec.md
index ab0e1abc02..5a91b8dde3 100644
--- a/specs/assets-spec.md
+++ b/docs/docs/specs/assets-spec.md
@@ -1,8 +1,10 @@
-# 《低代码引擎资产包协议规范》
+---
+title: 《低代码引擎资产包协议规范》
+sidebar_position: 2
+---
+## 1 介绍
-# 1 介绍
-
-## 1.1 本协议规范涉及的问题域
+### 1.1 本协议规范涉及的问题域
- 定义本协议版本号规范
- 定义本协议中每个子规范需要被支持的 Level
@@ -12,16 +14,16 @@
- 定义低代码资产包协议组件描述资源加载规范（A）
- 定义低代码资产包协议组件在面板展示规范（AA）
-## 1.2 协议草案起草人
+### 1.2 协议草案起草人
- 撰写：金禅、璿玑、彼洋
- 审阅：力皓、絮黎、光弘、戊子、潕量、游鹿
-## 1.3 版本号
+### 1.3 版本号
1.1.0
-## 1.4 协议版本号规范（A）
+### 1.4 协议版本号规范（A）
本协议采用语义版本号，版本号格式为 `major.minor.patch` 的形式。
@@ -29,7 +31,7 @@
- minor 是小版本号：用于发布向下兼容的协议功能新增
- patch 是补丁号：用于发布向下兼容的协议问题修正
-## 1.5 协议中子规范 Level 定义
+### 1.5 协议中子规范 Level 定义
| 规范等级 | 实现要求 |
| -------- | ------------------------------------------------------------ |
@@ -37,19 +39,19 @@
| AA | 推荐规范，由低代码引擎官方插件、setter 支持。 |
| AAA | 参考规范，需由基于引擎的上层搭建平台支持，实现可参考该规范。 |
-## 1.6 名词术语
+### 1.6 名词术语
- **资产包**: 低代码引擎加载资源的动态数据集合，主要包含组件及其依赖的资源、组件低代码描述、动态插件/设置器资源等。
-## 1.7 背景
+### 1.7 背景
根据低代码引擎的实现，一个组件要在引擎上渲染和配置，需要提供组件的 umd 资源以及组件的`低代码描述`，并且组件通常都是以集合的形式被引擎消费的；除了组件之外，还有组件的依赖资源、引擎的动态插件/设置器等资源也需要注册到引擎中；因此我们定义了“低代码资产包”这个数据结构，来描述引擎所需加载的动态资源的集合。
-## 1.8 受众
+### 1.8 受众
本协议适用于使用“低代码引擎”构建搭建平台的开发者，通过本协议的定义来进行资源的分类和加载。阅读及使用本协议，需要对低代码搭建平台的交互和实现有一定的了解，对前端开发相关技术栈的熟悉也会有帮助，协议中对通用的前端相关术语不会做进一步的解释说明。
-# 2 协议结构
+## 2 协议结构
协议最顶层结构如下，包含 7 方面的描述内容：
@@ -61,7 +63,7 @@
- setters { Array } 设计器中设置器描述协议列表
- extConfig { Object } 平台自定义扩展字段
-## 2.1 version（A）
+### 2.1 version (A)
定义当前协议 schema 的版本号；
@@ -69,9 +71,9 @@
| ---------- | ------ | ---------- | -------- | ------ |
| version | String | 协议版本号 | - | 1.1.0 |
-## 2.2 packages（A）
+### 2.2 packages (A)
-定义低代码编辑器中加载的资源列表，包含公共库和组件(库) cdn 资源等；
+定义低代码编辑器中加载的资源列表，包含公共库和组件 (库) cdn 资源等；
| 字段 | 字段描述 | 字段类型 | 规范等级 | 备注 |
| -------------------- | --------------------------------------------------------------- | ------------- | -------- | -------------------------------------------------------------------------------------------------------- |
@@ -81,20 +83,20 @@
| packages[].version | npm 包版本号 | String | A | 组件资源版本号 |
| packages[].type | 资源包类型 | String | AA | 取值为: proCode（源码）、lowCode（低代码，默认为 proCode |
| packages[].schema | 低代码组件 schema 内容 | object | AA | 取值为: proCode（源码）、lowCode（低代码） |
-| packages[].deps | 当前资源包的依赖资源的唯一标识列表 | Array
```
~~~
-### 2.1.2 API 规范（A)
+#### 2.1.2 API 规范（A)
API 是组件的属性解释，给开发者作为组件属性配置的参考。为了保持 API 的一致性，我们制定这个 API 命名规范。对于业界通用的，约定俗成的命名，我们遵循社区的约定。对于业界有多种规则难以确定的，我们确定其中一种，大家共同遵守。
-#### 通用规则
+##### 通用规则
- 所有的 API 采用小驼峰的书写规则，如 `onChange`、`direction`、`defaultVisible`。
- 标签名采用大驼峰书写规则，如 `Menu`、`Slider`、`DatePicker`。
-#### 通用命名
+##### 通用命名
| API 名称 | 类型 | 描述 | 常见变量 |
| :------------- | :------------- | :----------------------------------------------------------- | :---------------------------------------------------- |
@@ -245,7 +249,7 @@ API 是组件的属性解释，给开发者作为组件属性配置的参考。
| direction | enum | 方向，取值采用缩写的方式。 | hoz（水平）, ver（垂直） |
| align | enum | 对齐方式 | tl, tc, tr, cl, cc, cr, bl, bc, br |
| status | enum | 状态 | normal, success, error, warning |
-| size | enum | 大小 | small, medium, large 更大或更小可用(xxs, xs, xl, xxl) |
+| size | enum | 大小 | small, medium, large 更大或更小可用 (xxs, xs, xl, xxl) |
| type | enum or string | 分类:1. dom 结构不变、只有皮肤的变化 2.组件类型只有并列的几类 | normal, primary, secondary |
| visible | boolean | 是否显示 | |
| defaultVisible | boolean | 是否显示（非受控） | |
@@ -257,11 +261,11 @@ API 是组件的属性解释，给开发者作为组件属性配置的参考。
| has+'属性' | boolean | 拥有某个属性 | 例如 `hasArrow`， `hasHeader`， `hasClose` 等等 |
-#### 多选枚举
+##### 多选枚举
当某个 API 的接口，允许用户指定多个枚举值的时候，我们把这个接口定义为多选枚举。一个很典型的例子是某个弹层组件的 `closable` 属性，我们会允许：键盘 esc 按键、点击 mask、点击 close 按钮、点击组件以外的任何区域进行关闭。
-不要有一个 API 值，支持多种类型。例如某个弹层的组件，我们会允许 esc、点击 mask、点击 close 按钮等进行关闭。此时 API 设计可以通过多个 API 承载，例如:
+不要有一个 API 值，支持多种类型。例如某个弹层的组件，我们会允许 esc、点击 mask、点击 close 按钮等进行关闭。此时 API 设计可以通过多个 API 承载，例如：
```js
closable?: boolean; // 默认为 true
@@ -276,19 +280,19 @@ true 表示触发规则都会关闭，false 表示触发规则不会关闭。
- ``，任何情况下都不关闭，只能通过受控设置 visible
- ``，用户按 esc 或者点击关闭按钮会关闭
-#### 事件
+##### 事件
-- 标准事件或者自定义的符合 w3c 标准的事件，命名必须 on 开头, 即 `on` + 事件名，如 onExpand。
+- 标准事件或者自定义的符合 w3c 标准的事件，命名必须 on 开头， 即 `on` + 事件名，如 onExpand。
-#### 表单规范
+##### 表单规范
- 支持[受控模式](https://reactjs.org/docs/forms.html#controlled-components)(value + onChange) （A)
- value 控制组件数据展现
- onChange 组件发生变化时候的回调函数（第一个参数可以给到 value)
-- `value={undefined}` 的时候清空数据, field 的 reset 函数会给所有组件下发 undefined 数据 (AA)
+- `value={undefined}`的时候清空数据，field 的 reset 函数会给所有组件下发 undefined 数据 (AA))
- 一次完整操作抛一次 onChange 事件 `建议` 比如有 Process 表示进展中的状态，建议增加 API `onProcess`；如果有 Start 表示启动状态，建议增加 API `onStart` (AA)
-#### 属性的传递
+##### 属性的传递
**1. 原子组件（Atomic Component）**
> 最小粒子，不能再拆分的组件
@@ -326,7 +330,7 @@ true 表示触发规则都会关闭，false 表示触发规则不会关闭。
**xxxProps 例子**：
比如 `Search` 组件由 `Input` 和 `Button` 构成，`Button` 的属性通过 `buttonProps` 传递给内部的 `Button`。``
-### 2.1.3 入库方式 (A)
+#### 2.1.3 入库方式 (A)
入库是指：发布组件，并且存储到集团物料中心，方便统一管理和流通。
@@ -346,13 +350,13 @@ $ iceworks sync
```
-### 2.1.4 国际化多语言支持规范（AA）
+#### 2.1.4 国际化多语言支持规范（AA）
文件命名采取 [bcp47](https://tools.ietf.org/html/bcp47) 规范
-#### 目录规范
+##### 目录规范
-在 `src` 目录新增 `locale` 目录用于管理不同语言的文案.
+在 `src` 目录新增 `locale` 目录用于管理不同语言的文案。
```
|- BizHello
@@ -363,7 +367,7 @@ $ iceworks sync
|------ ja-JP.js
```
-#### 定义不同的语言
+##### 定义不同的语言
```javascript
// zh-CN.js
@@ -386,13 +390,13 @@ export default {
};
```
-#### 组件支持多语言建议方案
+##### 组件支持多语言建议方案
```jsx
// index.jsx
import React, { Component } from 'react';
import PropTypes from 'prop-types';
-import zh_CN from './locale/zh-CN.js'; // 引入默认语言
+import zhCN from './locale/zh-CN.js'; // 引入默认语言
export default class BizHello extends Component {
static componentName = 'BizHello';
@@ -401,7 +405,7 @@ export default class BizHello extends Component {
};
static defaultProps = {
- locale: zh_CN,
+ locale: zhCN,
};
render() {
@@ -413,7 +417,7 @@ export default class BizHello extends Component {
}
```
-#### 组件支持全局替换国际化文案
+##### 组件支持全局替换国际化文案
配合 ConfigProvider 支持全局替换国际化文案。
@@ -421,14 +425,14 @@ export default class BizHello extends Component {
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { ConfigProvider } from '@alifd/next';
-import zh_CN from './locale/zh-CN.js'; // 引入默认语言
+import zhCN from './locale/zh-CN.js'; // 引入默认语言
class BizHello extends Component {
static propTypes = {
locale: PropTypes.object, // 增加 locale，用于配置文案
};
static defaultProps = {
- locale: zh_CN,
+ locale: zhCN,
};
render() {
@@ -443,11 +447,11 @@ export default ConfigProvider.config(BizHello, {
});
```
-### 2.1.5 主题切换规范（AA）
+#### 2.1.5 主题切换规范（AA）
业务组件中如果有自定义的需要跟随主题色的 UI，一定要引入变量的形式，增加组件的流通性。
-#### src/index.scss
+##### src/index.scss
```css
/* 如果需要引入主题变量引入此段 */
@@ -460,7 +464,7 @@ export default ConfigProvider.config(BizHello, {
```
-### 2.1.6 [Deprecated]支持转设计稿（AAA）
+#### 2.1.6 [Deprecated]支持转设计稿（AAA）
对接 sketch 插件（FusionCool）的目的是为了让开发产出的业务组件能够直接给设计师使用，用法类似现在 Fusion Next 基础组件。
@@ -494,12 +498,12 @@ export default {
api 属性标准参考 [https://fusion.design/help.html#/dev-biz](https://fusion.design/help.html#/dev-biz)
-### 2.1.7 无障碍访问规范(AAA)
+#### 2.1.7 无障碍访问规范 (AAA)
-无障碍需要符合 [WCAG 2.1 A级标准](https://www.w3.org/TR/WCAG21/)，可参考 [W3C 无障碍最佳实践](https://www.w3.org/TR/wai-aria-practices-1.1/)、[Fusion 无障碍指引 2.3.1](https://alibaba-fusion.github.io/next/part1/basics.html) 章节等。
+无障碍需要符合 [WCAG 2.1 A 级标准](https://www.w3.org/TR/WCAG21/)，可参考 [W3C 无障碍最佳实践](https://www.w3.org/TR/wai-aria-practices-1.1/)、[Fusion 无障碍指引 2.3.1](https://alibaba-fusion.github.io/next/part1/basics.html) 章节等。
-#### 增加 a11y.md 无障碍 demo
+##### 增加 a11y.md 无障碍 demo
必须借助 API 才能完成无障碍工作的组件必须为开发者提供无障碍的使用文档，请[参考](https://fusion.design/pc/component/select?themeid=2#accessibility-container)组件 API 中 `ARIA and Keyboard` ，建议在 `demo` 目录新增 `a11y.md` 文件用于演示组件的无障碍使用。
@@ -513,7 +517,7 @@ component
详细指引查看无障碍开发指南 [https://alibaba-fusion.github.io/next/part1/basics.html](https://alibaba-fusion.github.io/next/part1/basics.html)。
-#### 通过键盘快速访问
+##### 通过键盘快速访问
一般键盘事件有 Up Arrow/Down Arrow/Enter/Esc/Tab
@@ -527,7 +531,7 @@ component
| Esc | 关闭列表 |
-#### 对读屏软件友好
+##### 对读屏软件友好
- 对于组件，我们为开发者内置 `role` 和特定 `aria-_属性`，开发者也可以对非组件 API 属性都可以透传至 DOM 元素，进行修改 `role` 和 `aria-_参数`，但是要注意对应关系，请[参考](https://alibaba-fusion.github.io/next/part1/WAI-ARIA.html)。
- 对一些特殊的组件传递参数才能支持无障碍，设置 `id`，`autoFocus` 和传参数，如下：
@@ -536,9 +540,9 @@ component
- 传参数 - 有些组件需要根据具体的业务，实现不同的可访问性，这里为开发者内置一些参数，想使用无障碍的时候，用户只需要根据现有的需求，选择对应的内置参数，例如设置 aria-label，以下组件需要用户传参数才支持无障碍组件如下：`NumberPicker`、`Transfer`
-## 2.2 低代码规范
+### 2.2 低代码规范
-### 2.2.1 组件规范
+#### 2.2.1 组件规范
通过低代码编辑器搭建而来，有别于源码开发的业务组件，属于业务组件中的一种类型，遵循业务组件的定义；同时低代码业务组件还可以通过低代码编辑器继续多次编辑。
@@ -547,7 +551,7 @@ component
| -------------- | ------------------------------------------------------------------------------------------------- | ------ |
| version | 协议版本号 | String |
| componentsMap | 描述组件映射关系的集合 | Array |
-| componentsTree | 低代码业务组件树描述，是长度固定为1的数组, 即数组内仅包含根容器的描述（低代码业务组件容器类型） | Array |
+| componentsTree | 低代码业务组件树描述，是长度固定为 1 的数组，即数组内仅包含根容器的描述（低代码业务组件容器类型） | Array |
| utils | 工具类扩展映射关系 | Array |
| i18n | 国际化语料 | Object |
@@ -567,7 +571,7 @@ component
"name": "lucy",
},
"static": {}, // 用于定义自定组件的 static 属性
- "defaultProps": { // 默认 props： 选填仅用于定义低代码业务组件的默认属性固定对象
+ "defaultProps": { // 默认 props：选填仅用于定义低代码业务组件的默认属性固定对象
"name": "xxx"
},
"children": [{
@@ -593,10 +597,10 @@ component
}
```
-### 2.2.2 组件描述协议
+#### 2.2.2 组件描述协议
对源码组件在低代码搭建平台中使用时所具备的配置能力和交互行为进行规范化描述，让不同平台对组件接入的实现保持一致，让组件针对不同的搭建平台接入时可以使用一份统一的描述内容，让组件在不同的业务中流通成为可能。
-#### 2.2.2.1 协议结构
+##### 2.2.2.1 协议结构
单个组件描述内容为 json 结构，主要包含以下三部分内容，分别为：
@@ -604,9 +608,7 @@ component
- **组件属性信息 (A)：** 描述组件属性信息，通常包含参数、说明、类型、默认值 4 项内容。
- **能力配置/体验增强：** 推荐用于优化搭建产品编辑体验，定制编辑能力的配置信息。
-整体结构概览: [http://lowcode-engine.cn/doc?url=sde3wf](http://lowcode-engine.cn/doc?url=sde3wf)
-
-#### 2.2.2.2 基础信息（A）
+##### 2.2.2.2 基础信息（A）
| 字段 | 字段描述 | 字段类型 | 允许空 |
| ----------------- | --------------------- | ------------------------- | ------ |
@@ -632,7 +634,7 @@ component
| priority | 用于描述组件在同一 category 中的排序 | String | 否 |
-#### 2.2.2.3 组件属性信息 props (A)
+##### 2.2.2.3 组件属性信息 props (A)
描述组件属性信息，通常包含名称、类型、描述、默认值 4 项内容。
@@ -803,7 +805,7 @@ export default class FusionForm extends PureComponent {
```
-#### 2.2.2.4 编辑体验增强 configure
+##### 2.2.2.4 编辑体验增强 configure
推荐用于优化搭建产品的编辑体验，定制编辑能力的配置信息，通过能力抽象分类，主要包含如下几个维度的配置项：
@@ -817,7 +819,7 @@ export default class FusionForm extends PureComponent {
| 【已废弃】experimental (AAA) | 将引擎的一些实验性特性放在这个配置里 | Object | 用户可以提前体验这些特性 |
-##### 2.2.2.4.1 属性面板配置 props (A)
+###### 2.2.2.4.1 属性面板配置 props (A)
props 数组下对象字段描述：
@@ -825,23 +827,24 @@ props 数组下对象字段描述：
| 字段 | 字段描述 | 字段类型 | 备注 |
| ---------- | -------------------------------------------------------------------------------------- | ----------------- | ------------------- |
| type | 指定类型 | Enum | 可选值为 `'field' | 'group'` ,默认为 'field'|
-| display | 指定类型 | Enum | 可选值为 `'accordion' | 'inline' | 'block' | 'plain' | 'popup' | 'entry'` ,默认为 'inline'|
+| display | 指定类型 | Enum | 可选值为 `'accordion' \| 'inline' \| 'block' \| 'plain' \| 'popup' \| 'entry'` ，默认为 'inline'|
| title | 分类标题 | 属性标题 | String | |
| items | 分类下的属性列表 | Array\ | type = 'group' 生效 |
| name | 属性名 | String | type = 'field' 生效 |
| defaultValue | 默认值 | Any(视字段类型而定) | type = 'field' 生效 |
| supportVariable | 是否支持配置变量 | Boolean | type = 'field' 生效 |
-| condition | 配置当前 prop 是否展示 | (target: SettingTarget) => boolean; | - |
-| setter | 单个控件(setter)描述，搭建基础协议组件的描述对象，支持 JSExpression / JSFunction / JSSlot | `String|Object|Function` | type = 'field' 生效 |
+| condition | 配置当前 prop 是否展示 | (target: IPublicModelSettingField) => boolean; | - |
+| ignoreDefaultValue | 配置当前 prop 是否忽略默认值处理逻辑，如果返回值是 true 引擎不会处理默认值 | (target: IPublicModelSettingField) => boolean; | - |
+| setter | 单个控件 (setter) 描述，搭建基础协议组件的描述对象，支持 JSExpression / JSFunction / JSSlot | `String\|Object\|Function` | type = 'field' 生效 |
| extraProps | 其他配置属性（不做流通要求） | Object | 其他配置 |
-| extraProps.getValue | setter 渲染时被调用，setter 会根据该函数的返回值设置 setter 当前值 | Function | (target: SettingTarget, value: any) => any; |
-| extraProps.setValue | setter 内容修改时调用，开发者可在该函数内部修改节点 schema 或者进行其他操作 | Function | (target: SettingTarget, value: any) => void; |
+| extraProps.getValue | setter 渲染时被调用，setter 会根据该函数的返回值设置 setter 当前值 | Function | (target: IPublicModelSettingField, value: any) => any; |
+| extraProps.setValue | setter 内容修改时调用，开发者可在该函数内部修改节点 schema 或者进行其他操作 | Function | (target: IPublicModelSettingField, value: any) => void; |
-根据属性值类型 propType，确定对应控件类型 (setter) ，详见 [https://lowcode-engine.cn/docV2/grfylu](https://lowcode-engine.cn/docV2/grfylu)
+根据属性值类型 propType，确定对应控件类型 (setter) 。
-##### 2.2.2.4.2 通用扩展面板支持性配置 supports (AA)
+###### 2.2.2.4.2 通用扩展面板支持性配置 supports (AA)
样式配置面板能力描述，描述是否支持行业样式编辑、是否支持类名设置等。
@@ -864,7 +867,7 @@ props 数组下对象字段描述：
```
-##### 2.2.2.4.3 组件能力配置 component
+###### 2.2.2.4.3 组件能力配置 component
与组件相关的能力、约束、行为等描述，有些信息可从组件视图实例上直接获取，包含如下字段：
@@ -875,12 +878,12 @@ props 数组下对象字段描述：
| isModal(A) | 组件是否带浮层，浮层组件拖入设计器时会遮挡画布区域，此时应当辅助一些交互以防止阻挡 | Boolean |
| descriptor(A) | 组件树描述信息 | String |
| nestingRule(A) | 嵌套控制：防止错误的节点嵌套，比如 a 嵌套 a, FormField 只能在 Form 容器下，Column 只能在 Table 下等 | Object |
-| nestingRule.childWhitelist | 子节点类型白名单 | `String|Function` |
-| nestingRule.parentWhitelist | 父节点类型白名单 | `String|Function` |
-| nestingRule.descendantBlacklist | 后裔节点类型黑名单 | `String|Function` |
-| nestingRule.ancestorWhitelist | 祖父节点类型白名单 | `String|Function` |
+| nestingRule.childWhitelist | 子节点类型白名单 | `String\|Function` |
+| nestingRule.parentWhitelist | 父节点类型白名单 | `String\|Function` |
+| nestingRule.descendantBlacklist | 后裔节点类型黑名单 | `String\|Function` |
+| nestingRule.ancestorWhitelist | 祖父节点类型白名单 | `String\|Function` |
| isNullNode(AAA) | 是否存在渲染的根节点 | Boolean |
-| isLayout(AAA) | 是否是layout布局组件 | Boolean |
+| isLayout(AAA) | 是否是 layout 布局组件 | Boolean |
| rootSelector(AAA) | 组件选中框的 cssSelector | String |
| disableBehaviors(AAA) | 用于屏蔽在设计器中选中组件时提供的操作项，默认操作项有 copy、hide、remove | String[] |
| actions(AAA) | 用于详细配置上述操作项的内容 | Object |
@@ -913,28 +916,28 @@ props 数组下对象字段描述：
}
```
-##### 2.2.2.4.4 高级功能配置 advanced (AAA)
+###### 2.2.2.4.4 高级功能配置 advanced (AAA)
组件在低代码引擎设计器中的事件回调和 hooks 等高级功能配置，包含如下字段：
| 字段 | 用途 | 类型 | 备注 |
| ------------------------------- | --------------------------------------------------------------------------------------------------- | ------- | --- |
-|initialChildren |组件拖入“设计器”时根据此配置自动生成 children 节点 schema |NodeData[]/Function NodeData[] | ((target: SettingTarget) => NodeData[]);|
-|getResizingHandlers| 用于配置设计器中组件 resize 操作工具的样式和内容| Function| (currentNode: any) => Array<{ type: 'N' | 'W' | 'S' | 'E' | 'NW' | 'NE' | 'SE' | 'SW'; content?: ReactElement; propTarget?: string; appearOn?: 'mouse-enter' | 'mouse-hover' | 'selected' | 'always'; }> / ReactElement[];
-|callbacks| 配置 callbacks 可捕获引擎抛出的一些事件，例如 onNodeAdd、onResize 等| Callback| -
-|callbacks.onNodeAdd| 在容器中拖入组件时触发的事件回调| Function| (e: MouseEvent, currentNode: any) => any
-|callbacks.onNodeRemove| 在容器中删除组件时触发的事件回调| Function| (e: MouseEvent, currentNode: any) => any
-|callbacks.onResize| 调整容器尺寸时触发的事件回调，常常与 getResizingHandlers搭配使用| Function| 详见 Types 定义
-|callbacks.onResizeStart| 调整容器尺寸开始时触发的事件回调，常常与 getResizingHandlers搭配使用| Function| 详见 Types 定义
-|callbacks.onResizeEnd| 调整容器尺寸结束时触发的事件回调，常常与 getResizingHandlers搭配使用| Function| 详见 Types 定义
-|callbacks.onSubtreeModified| 容器节点结构树发生变化时触发的回调| Function| (currentNode: any, options: any) => void;
-|callbacks.onMouseDownHook| 鼠标按下操作回调| Function| (e: MouseEvent, currentNode: any) => any;
-|callbacks.onClickHook| 鼠标单击操作回调| Function| (e: MouseEvent, currentNode: any) => any;
-|callbacks.onDblClickHook| 鼠标双击操作回调| Function| (e: MouseEvent, currentNode: any) => any;
-|callbacks.onMoveHook| 节点被拖动回调| Function| (currentNode: any) => boolean;
-|callbacks.onHoverHook| 节点被 hover 回调| Function| (currentNode: any) => boolean;
-|callbacks.onChildMoveHook| 容器节点的子节点被拖动回调| Function| (childNode: any, currentNode: any) => boolean;
+|initialChildren | 组件拖入“设计器”时根据此配置自动生成 children 节点 schema |NodeData[]/Function NodeData[] | ((target: IPublicModelSettingField) => NodeData[]);|
+|getResizingHandlers| 用于配置设计器中组件 resize 操作工具的样式和内容 | Function| (currentNode: any) => Array<{ type: 'N' | 'W' | 'S' | 'E' | 'NW' | 'NE' | 'SE' | 'SW'; content?: ReactElement; propTarget?: string; appearOn?: 'mouse-enter' | 'mouse-hover' | 'selected' | 'always'; }> / ReactElement[];
+|callbacks| 配置 callbacks 可捕获引擎抛出的一些事件，例如 onNodeAdd、onResize 等 | Callback| -
+|callbacks.onNodeAdd| 在容器中拖入组件时触发的事件回调 | Function| (e: MouseEvent, currentNode: any) => any
+|callbacks.onNodeRemove| 在容器中删除组件时触发的事件回调 | Function| (e: MouseEvent, currentNode: any) => any
+|callbacks.onResize| 调整容器尺寸时触发的事件回调，常常与 getResizingHandlers 搭配使用 | Function| 详见 Types 定义
+|callbacks.onResizeStart| 调整容器尺寸开始时触发的事件回调，常常与 getResizingHandlers 搭配使用 | Function| 详见 Types 定义
+|callbacks.onResizeEnd| 调整容器尺寸结束时触发的事件回调，常常与 getResizingHandlers 搭配使用 | Function| 详见 Types 定义
+|callbacks.onSubtreeModified| 容器节点结构树发生变化时触发的回调 | Function| (currentNode: any, options: any) => void;
+|callbacks.onMouseDownHook| 鼠标按下操作回调 | Function| (e: MouseEvent, currentNode: any) => any;
+|callbacks.onClickHook| 鼠标单击操作回调 | Function| (e: MouseEvent, currentNode: any) => any;
+|callbacks.onDblClickHook| 鼠标双击操作回调 | Function| (e: MouseEvent, currentNode: any) => any;
+|callbacks.onMoveHook| 节点被拖动回调 | Function| (currentNode: any) => boolean;
+|callbacks.onHoverHook| 节点被 hover 回调 | Function| (currentNode: any) => boolean;
+|callbacks.onChildMoveHook| 容器节点的子节点被拖动回调 | Function| (childNode: any, currentNode: any) => boolean;
描述举例：
@@ -962,7 +965,7 @@ props 数组下对象字段描述：
}
```
-#### 2.2.2.5 TypeScript 定义
+##### 2.2.2.5 TypeScript 定义
```TypeScript
@@ -1096,7 +1099,7 @@ export interface Advanced {
/**
* 拖入容器时，自动带入 children 列表
*/
- initialChildren?: NodeData[] | ((target: SettingTarget) => NodeData[]);
+ initialChildren?: NodeData[] | ((target: IPublicModelSettingField) => NodeData[]);
/**
* @todo 待补充文档
*/
@@ -1195,9 +1198,9 @@ export interface ComponentDescription { // 组件描述协议，通过 npm 中
}
```
-### 2.2.3 资产包协议
+#### 2.2.3 资产包协议
-#### 2.2.3.1 协议结构
+##### 2.2.3.1 协议结构
协议最顶层结构如下，包含 5 方面的描述内容：
@@ -1206,7 +1209,7 @@ export interface ComponentDescription { // 组件描述协议，通过 npm 中
- components { Array } 所有组件的描述协议列表
- sort { Object } 用于描述组件面板中的 tab 和 category
-#### 2.2.3.2 version（A）
+##### 2.2.3.2 version (A)
定义当前协议 schema 的版本号；
@@ -1214,9 +1217,9 @@ export interface ComponentDescription { // 组件描述协议，通过 npm 中
| ---------- | ------ | ---------- | -------- | ------ |
| version | String | 协议版本号 | - | 1.0.0 |
-#### 2.2.3.3 packages（A）
+##### 2.2.3.3 packages (A)
-定义低代码编辑器中加载的资源列表，包含公共库和组件(库) cdn 资源等；
+定义低代码编辑器中加载的资源列表，包含公共库和组件 (库) cdn 资源等；
| 字段 | 字段描述 | 字段类型 | 备注 |
| --------------- | ---------------------- | -------- | ------------------------------------------------------------ |
@@ -1224,10 +1227,10 @@ export interface ComponentDescription { // 组件描述协议，通过 npm 中
| packages[].package (A) | npm 包名 | String | 组件资源唯一标识 |
| packages[].version(A) | npm 包版本号 | String | 组件资源版本号 |
| packages[].library(A) | 作为全局变量引用时的名称，用来定义全局变量名 | String | 低代码引擎通过该字段获取组件实例 |
-| packages[].editUrls (A) | 组件编辑态视图打包后的 CDN url 列表，包含 js 和 css | Array | 低代码引擎编辑器会加载这些 url |
-| packages[].urls (AA) | 组件渲染态视图打包后的 CDN url 列表，包含 js 和 css | Array | 低代码引擎渲染模块会加载这些 url |
+| packages[].editUrls (A) | 组件编辑态视图打包后的 CDN url 列表，包含 js 和 css | Array\ | 低代码引擎编辑器会加载这些 url |
+| packages[].urls (AA) | 组件渲染态视图打包后的 CDN url 列表，包含 js 和 css | Array\ | 低代码引擎渲染模块会加载这些 url |
-描述举例:
+描述举例：
```json
{
@@ -1248,7 +1251,7 @@ export interface ComponentDescription { // 组件描述协议，通过 npm 中
]
},
{
- "title": "fusion组件库",
+ "title": "fusion 组件库",
"package": "@alifd/next",
"version": "1.24.18",
"urls": [
@@ -1287,11 +1290,11 @@ export interface ComponentDescription { // 组件描述协议，通过 npm 中
}
```
-#### 2.2.3.4 components （A）
+##### 2.2.3.4 components (A)
定义所有组件的描述协议列表，组件描述协议遵循本规范章节 2.2.2 的定义；
-#### 2.2.3.5 sort （A）
+##### 2.2.3.5 sort (A)
定义组件列表分组
@@ -1300,7 +1303,7 @@ export interface ComponentDescription { // 组件描述协议，通过 npm 中
| sort.groupList | String[] | 组件分组，用于组件面板 tab 展示 | - | ['精选组件', '原子组件'] |
| sort.categoryList | String[] | 组件面板中同一个 tab 下的不同区间用 category 区分，category 的排序依照 categoryList 顺序排列 | - | ['通用', '数据展示', '表格类', '表单类'] |
-#### 2.2.3.6 TypeScript 定义
+##### 2.2.3.6 TypeScript 定义
```TypeScript
export interface ComponentSort {
@@ -1325,13 +1328,13 @@ export interface RemoteComponentDescription {
}
```
-# 3 物料规范-区块规范
+## 3 物料规范 - 区块规范
-## 3.1 源码规范
+### 3.1 源码规范
英文 block, 可复用的代码片段，每个区块对应一个 npm。
-### 3.1.1 目录 (A)
+#### 3.1.1 目录 (A)
```html
@@ -1351,7 +1354,7 @@ block/
```
-### 3.1.2 package.json (A)
+#### 3.1.2 package.json (A)
```json
@@ -1369,9 +1372,9 @@ block/
}
```
-### 3.1.3 html2sketch (3A)
+#### 3.1.3 html2sketch (3A)
-#### 3.1.3.1 package.json 内 blockConfig 结构
+##### 3.1.3.1 package.json 内 blockConfig 结构
```json
{
@@ -1381,14 +1384,14 @@ block/
"category": "form",
"screenshot": "https://unpkg.com/@icedesign/user-landing-block/screenshot.png",
"views": [{ // 区块视图，配置此项后会进入 fusion cool
- "title": "视图1标题", // 区块视图标题
+ "title": "视图 1 标题", // 区块视图标题
"props": { // 区块支持的 props
"type": "primary"
},
"screenshot": "build/views/block_view1.png", // 【编译自动填充】视图截图，会在 build 时自动生成
"html": "build/views/block_view1.html", // 【编译自动填充】视图渲染后 html 结构，会在 build 时自动生成
},{
- "title": "视图2标题", // 区块视图标题
+ "title": "视图 2 标题", // 区块视图标题
"props": { // 区块支持的 props
"type": "sencondary"
},
@@ -1399,7 +1402,7 @@ block/
}
```
-## 3.2 低代码规范
+### 3.2 低代码规范
由业务组件、布局组件进行嵌套组合而成。不对外提供可配置的属性。可通过**区块容器组件**的包裹，实现容器内部具备有完整的样式、事件、生命周期管理、状态管理、数据流转机制。能独立存在和运行，可实现跨页面、跨应用的快速复用，保障功能和数据的正常。
@@ -1412,7 +1415,7 @@ block/
| i18n | 国际化语料 | Object |
-描述举例1：
+描述举例 1：
```json
{
@@ -1420,7 +1423,7 @@ block/
"componentsMap": [{ }],
"componentsTree": [{ // 区块组件树，顶层由区块容器组件包裹；
"componentName": "Block", // 区块容器组件名
- "fileName": "block1", // 区块容器1
+ "fileName": "block1", // 区块容器 1
"props": {},
"css": "body {font-size: 12px;}",
"state": {
@@ -1449,7 +1452,7 @@ block/
}
```
-描述举例2：
+描述举例 2：
```json
{
@@ -1478,11 +1481,11 @@ block/
}
```
-# 4 物料规范 - 模板规范
+## 4 物料规范 - 模板规范
-## 4.1 源码规范
+### 4.1 源码规范
-### 4.1.1 目录规范（A）
+#### 4.1.1 目录规范（A）
与标准源码 build-scripts 对齐
@@ -1522,13 +1525,13 @@ block/
│ │ └── app.js # 应用配置文件
│ ├── utils/ # 工具库
│ │ └── index.js # 应用第三方扩展函数
-│ ├── stores/ # [可选]全局状态管理
+│ ├── stores/ # [可选] 全局状态管理
│ │ └── user.js
-│ ├── locales/ # [可选]国际化资源
+│ ├── locales/ # [可选] 国际化资源
│ │ ├── en-US
│ │ └── zh-CN
│ ├── global.scss # 全局样式
-│ └── index.jsx # 应用入口脚本, 依赖 config/routes.js 的路由配置动态生成路由；
+│ └── index.jsx # 应用入口脚本，依赖 config/routes.js 的路由配置动态生成路由；
├── webpack.config.js # 项目工程配置，包含插件配置及自定义 `webpack` 配置等
├── README.md
├── package.json
@@ -1541,7 +1544,7 @@ block/
```
-#### 入口文件
+##### 入口文件
(/src/index.jsx)
@@ -1557,16 +1560,16 @@ const App = hot(router);
ReactDOM.render(
+
+ );
+}
+
+export default function Home(): JSX.Element {
+ const { siteConfig } = useDocusaurusContext();
+ return (
+
+
+ );
+}
diff --git a/docs/src/pages/index.module.css b/docs/src/pages/index.module.css
new file mode 100644
index 0000000000..ac3d449967
--- /dev/null
+++ b/docs/src/pages/index.module.css
@@ -0,0 +1,29 @@
+/**
+ * CSS files with the .module.css suffix will be treated as CSS modules
+ * and scoped locally.
+ */
+
+.heroBanner {
+ padding: 4rem 0;
+ text-align: center;
+ position: relative;
+ overflow: hidden;
+ height: 60rem;
+}
+
+.heroTitle {
+ color: #30e724;
+ font-size: 3rem;
+}
+
+@media screen and (max-width: 996px) {
+ .heroBanner {
+ padding: 2rem;
+ }
+}
+
+.buttons {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
\ No newline at end of file
diff --git a/docs/src/pages/index.tsx b/docs/src/pages/index.tsx
new file mode 100644
index 0000000000..cdf826a64a
--- /dev/null
+++ b/docs/src/pages/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react';
+import BrowserOnly from '@docusaurus/BrowserOnly';
+
+export default function ToIndex(): JSX.Element {
+ return (
+
+ {() => {
+ /**
+ * 跳转到首页
+ */
+ window.location.href = '/index';
+ return <>;
+ }}
+
+ );
+}
diff --git a/docs/src/pages/markdown-page.md b/docs/src/pages/markdown-page.md
new file mode 100644
index 0000000000..7d2421c8a6
--- /dev/null
+++ b/docs/src/pages/markdown-page.md
@@ -0,0 +1,15 @@
+
+
+# 文档能力介绍
+
+这是一个使用 Markdown 编写的任意页面，访问地址为 /markdown-page
+
+Product Docs Capability Introduction.
+
+## 功能
+
+- ✅ 支持本地离线搜搜
+- ✅ 版本化文档管理
+- ✅ 离线静态部署
diff --git a/docs/static/img/docusaurus.png b/docs/static/img/docusaurus.png
new file mode 100644
index 0000000000..f458149e3c
Binary files /dev/null and b/docs/static/img/docusaurus.png differ
diff --git a/docs/static/img/logo.svg b/docs/static/img/logo.svg
new file mode 100644
index 0000000000..9db6d0d066
--- /dev/null
+++ b/docs/static/img/logo.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/docs/static/img/undraw_docusaurus_mountain.svg b/docs/static/img/undraw_docusaurus_mountain.svg
new file mode 100644
index 0000000000..af961c49a8
--- /dev/null
+++ b/docs/static/img/undraw_docusaurus_mountain.svg
@@ -0,0 +1,171 @@
+
diff --git a/docs/static/img/undraw_docusaurus_react.svg b/docs/static/img/undraw_docusaurus_react.svg
new file mode 100644
index 0000000000..94b5cf08f8
--- /dev/null
+++ b/docs/static/img/undraw_docusaurus_react.svg
@@ -0,0 +1,170 @@
+
diff --git a/docs/static/img/undraw_docusaurus_tree.svg b/docs/static/img/undraw_docusaurus_tree.svg
new file mode 100644
index 0000000000..d9161d3392
--- /dev/null
+++ b/docs/static/img/undraw_docusaurus_tree.svg
@@ -0,0 +1,40 @@
+
diff --git a/docs/tsconfig.json b/docs/tsconfig.json
new file mode 100644
index 0000000000..6f4756980d
--- /dev/null
+++ b/docs/tsconfig.json
@@ -0,0 +1,7 @@
+{
+ // This file is not used in compilation. It is here just for a nice editor experience.
+ "extends": "@tsconfig/docusaurus/tsconfig.json",
+ "compilerOptions": {
+ "baseUrl": "."
+ }
+}
diff --git a/lerna.json b/lerna.json
index dc04c65d56..7fad993f66 100644
--- a/lerna.json
+++ b/lerna.json
@@ -1,6 +1,6 @@
{
"lerna": "4.0.0",
- "version": "1.0.15",
+ "version": "1.3.2",
"npmClient": "yarn",
"useWorkspaces": true,
"packages": [
diff --git a/modules/code-generator/.gitignore b/modules/code-generator/.gitignore
index ec49a49555..bf10c9f823 100644
--- a/modules/code-generator/.gitignore
+++ b/modules/code-generator/.gitignore
@@ -115,3 +115,8 @@ codealike.json
# backup files
*.bak
+# tests
+tests/fixtures/**/actual
+
+
+
diff --git a/modules/code-generator/.versionrc b/modules/code-generator/.versionrc
new file mode 100644
index 0000000000..a41c11e264
--- /dev/null
+++ b/modules/code-generator/.versionrc
@@ -0,0 +1,3 @@
+{
+ "releaseCommitMessageFormat": "chore(release): code-generator - {{currentTag}}"
+}
\ No newline at end of file
diff --git a/modules/code-generator/CHANGELOG.md b/modules/code-generator/CHANGELOG.md
index ce239aba64..62527d0229 100644
--- a/modules/code-generator/CHANGELOG.md
+++ b/modules/code-generator/CHANGELOG.md
@@ -2,6 +2,161 @@
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
+### [1.0.7-beta.2](https://github.com/alibaba/lowcode-engine/compare/@alilc/lowcode-code-generator@1.0.3...@alilc/lowcode-code-generator@1.0.7-beta.2) (2022-11-24)
+
+### Bug Fixes
+
+* 🐛 解决 react 中 jsx 出码的时候对于循环数据漏包 __$evalArray 的问题 ([3b9b177](https://github.com/alibaba/lowcode-engine/commit/3b9b177b052169cd0c1078cf8b488f04cb374dac))
+* 🐛 解决出码缺乏对于 i18n 数据的 params 的处理的问题 ([2cf788c](https://github.com/alibaba/lowcode-engine/commit/2cf788c1716ae63fef20004348c59a5a65c6b3d2)), closes [#288](https://github.com/alibaba/lowcode-engine/issues/288)
+* 🐛 解决小程序环境没有 window, 而 rax 出码中却默认在 __$eval 中用到 window 的问题 ([ce531ae](https://github.com/alibaba/lowcode-engine/commit/ce531aeb457711fac92d828b431cfc3d643b3682))
+* add support for jsx expression ([453e069](https://github.com/alibaba/lowcode-engine/commit/453e0699ece06d98e59227e23248baf1de4082aa))
+* 修复生成的 icejs 项目不支持 constants 的问题, fixes [#1259](https://github.com/alibaba/lowcode-engine/issues/1259) ([a079fbc](https://github.com/alibaba/lowcode-engine/commit/a079fbc256f8275e8a69eb6d8abb6f6b08179578))
+* 修正 react 框架出码中在严格模式对 methods 和 context 的处理 ([b1a6100](https://github.com/alibaba/lowcode-engine/commit/b1a61006bba4292790899c7c49c9c611a9384472))
+### [1.0.7-beta.1](https://github.com/alibaba/lowcode-engine/compare/@alilc/lowcode-code-generator@1.0.7-beta.0...@alilc/lowcode-code-generator@1.0.7-beta.1) (2022-10-26)
+
+
+### Bug Fixes
+
+* fix empty string lost when generate variable ([2cf74cd](https://github.com/alibaba/lowcode-engine/commit/2cf74cd04b4f48a3501d37329d39784f6964366a))
+
+### [1.0.7-beta.0](https://github.com/alibaba/lowcode-engine/compare/@alilc/lowcode-code-generator@1.0.6-beta.0...@alilc/lowcode-code-generator@1.0.7-beta.0) (2022-10-25)
+
+### [1.0.6-beta.0](https://github.com/alibaba/lowcode-engine/compare/@alilc/lowcode-code-generator@1.0.3...@alilc/lowcode-code-generator@1.0.6-beta.0) (2022-10-25)
+
+
+### Features
+
+* 🎸 设计态支持数据源引擎配置 ([04631f8](https://github.com/alibaba/lowcode-engine/commit/04631f813782dbf6d175f51c40ccc75ca4c099d2))
+* 大纲树支持节点过滤 ([f30db20](https://github.com/alibaba/lowcode-engine/commit/f30db20606f5f2fdac0017305b1dda7ab2258c4b))
+* 为 renderer 追加 displayName，以支持后续的反射功能 ([6399cce](https://github.com/alibaba/lowcode-engine/commit/6399cce05ae494dac6facf4366949b0b97576079))
+* 资产包支持一个package从另一个package异步导出 ([#1150](https://github.com/alibaba/lowcode-engine/issues/1150)) ([6b78157](https://github.com/alibaba/lowcode-engine/commit/6b78157b211d6eabf60297b9ce980a3e10cc8272))
+* add availableActions for ComponentMeta ([de1f60b](https://github.com/alibaba/lowcode-engine/commit/de1f60bbee157267e2c2212df1077cc49ce506f4))
+* add code coverage action ([ed3ddcf](https://github.com/alibaba/lowcode-engine/commit/ed3ddcf5c942a8e78e1f247e41d4159da97e75a8))
+* add componentMeta getter for setingPropEntry ([2f8b954](https://github.com/alibaba/lowcode-engine/commit/2f8b9545de0210260001a832b52f608238ac4191))
+* add expanded to shell SettingPropEntry ([534e294](https://github.com/alibaba/lowcode-engine/commit/534e29429d445d97c71d95d4c4e492868527bb6b))
+* add flag createIfNode for ShellNode#getProp ([152a24d](https://github.com/alibaba/lowcode-engine/commit/152a24d65528d0a3b7990c9aa87e6d8d09aa9b2a))
+* add getComponentsMap() for DocumentModel ([f956645](https://github.com/alibaba/lowcode-engine/commit/f9566454ef83eb4c48b68d63a766c3d0ff927c73))
+* add getExtraPropValue setExtraPropValue to shell SettingPropEntry ([70e7c1c](https://github.com/alibaba/lowcode-engine/commit/70e7c1c2e8998e80d58447759efdf651105724a9))
+* add id setter for DocumentModel ([941ae05](https://github.com/alibaba/lowcode-engine/commit/941ae0592586334694c48197aaa6692d49cefbce))
+* add importSchema event for documentModel ([4b8ec09](https://github.com/alibaba/lowcode-engine/commit/4b8ec09e86e3950a9d4066c28e681a59273b4c93))
+* add isGroup & items to shell SettingPropEntry ([7b76ff3](https://github.com/alibaba/lowcode-engine/commit/7b76ff357e4e638454c31a9b1324fb68966ec522))
+* add mergeChldren API for shell node ([a47d4ee](https://github.com/alibaba/lowcode-engine/commit/a47d4eea28cf4479e3b3a2bd1d194a6433666825))
+* add onMountNode event for DocumentModel ([dcc247c](https://github.com/alibaba/lowcode-engine/commit/dcc247c7d54f6af2ed36d46bfd79c7eacf7bd604))
+* add renderer for simulatorHost ([1cfc8d6](https://github.com/alibaba/lowcode-engine/commit/1cfc8d668b8897ef3a53c11520312cc6d18338f9))
+* add script for synchronizing packages to intranet registry ([b4f463e](https://github.com/alibaba/lowcode-engine/commit/b4f463e7d45f7b476de04bd4d98ad9f74d53cf13))
+* add scrollToNode for simulator host ([#1075](https://github.com/alibaba/lowcode-engine/issues/1075)) ([0bcd9ff](https://github.com/alibaba/lowcode-engine/commit/0bcd9ff78227aeddaf2fdc22d10fbd662fed91d3))
+* add setVisible for Node ([ba90327](https://github.com/alibaba/lowcode-engine/commit/ba90327eac0f5f82f6349bb9a7684bf51259e9c9))
+* add showArea & hideArea method for skeleton ([8f6b53e](https://github.com/alibaba/lowcode-engine/commit/8f6b53e67d89ee7af754132f0994a759522b3821))
+* add slotNode for shell prop ([d9a44c5](https://github.com/alibaba/lowcode-engine/commit/d9a44c5de7861e9180567b4afb787e381cefac61))
+* add some features ([18d1a4f](https://github.com/alibaba/lowcode-engine/commit/18d1a4fe1d952bcd4715e693def09fee94da49a5))
+* add some necessary methods and attributes ([4fd7f27](https://github.com/alibaba/lowcode-engine/commit/4fd7f27f8eb33b66324ede279b412940fc1f7032))
+* add some params for onDragstart & onDrag & onDragend ([d1c9838](https://github.com/alibaba/lowcode-engine/commit/d1c9838343ba1bdd4c02c1cfbf1f920dd8c87e7d))
+* add top attrbute for Shell SettingPropEntry ([51aca3d](https://github.com/alibaba/lowcode-engine/commit/51aca3d330b6483c05b71867f1b362a9f5db6cfe))
+* added lowcode engine standard specs ([f25feba](https://github.com/alibaba/lowcode-engine/commit/f25feba63f181efa83f1a8dff530e1c39ab1b34c))
+* added lowcode engine standard specs ([57df803](https://github.com/alibaba/lowcode-engine/commit/57df803179ca9cec4e8ab1dac1be577175732e65))
+* added thisRequiredInJSE API to control whether JSExpression expression access context must use this ([#702](https://github.com/alibaba/lowcode-engine/issues/702)) ([da7f77e](https://github.com/alibaba/lowcode-engine/commit/da7f77ee91b3bf441a4a57614872df32d6a1d041))
+* assetLoader loda scripts with async=false ([f6ad4a1](https://github.com/alibaba/lowcode-engine/commit/f6ad4a157df8c0ff7db327f4770f454998693d9a))
+* change loop sertter config, set defaultValue prop to JsonSetter ([aa6b9c8](https://github.com/alibaba/lowcode-engine/commit/aa6b9c8f7a5353771af9f46216310f044e57c533))
+* cp dist files of simulator-renderer to that of engine ([03c5397](https://github.com/alibaba/lowcode-engine/commit/03c53971df6de8c35620fd77743ac4f57a82d323))
+* export nodeChildrenSymbol && remove some unnecessary editor.set ([e83adce](https://github.com/alibaba/lowcode-engine/commit/e83adcee815eea73b6b1ed4f43f4d684c11818ca))
+* fix render-core leaf hoc component condition config should get from leaf exportSchema fn ([85704c3](https://github.com/alibaba/lowcode-engine/commit/85704c36946191a1b88db789cfac59e9d027a371))
+* low-code components support lifecycle and function execution ([176583f](https://github.com/alibaba/lowcode-engine/commit/176583f48af573d30c0d2c36faa3d901b0541c06))
+* **material-parser:** check module before install it; fix default value issue in ts parser ([fc452f7](https://github.com/alibaba/lowcode-engine/commit/fc452f7166f02acfba6076c1a9425e6f5880b5f6))
+* modify the output method of rendering module parsing errors ([8255b79](https://github.com/alibaba/lowcode-engine/commit/8255b7945836ee5d25fae73913faa6d0af7b3ff3))
+* pass e to customizeIgnoreSelectors ([900b239](https://github.com/alibaba/lowcode-engine/commit/900b2394323e85f0dce5df83dfc773f96da23e24))
+* refine nesting drawer ([4c032d0](https://github.com/alibaba/lowcode-engine/commit/4c032d0d0ead9731c038bd62dccc4a7d96435183))
+* refine nesting drawer ([94a211e](https://github.com/alibaba/lowcode-engine/commit/94a211e2795f74721cfd2ae3ff38a1d3607e9cd0))
+* refine pop drawer ([abf8fae](https://github.com/alibaba/lowcode-engine/commit/abf8fae3ef4d62b5688362e1b98f1b508a207029))
+* requestHandlersMap should be optional ([ee7160e](https://github.com/alibaba/lowcode-engine/commit/ee7160ea3c625d421c07730ef51711b8f14392a0))
+* return unbind function for onChangeDetecting & onChangeSelection ([30267cb](https://github.com/alibaba/lowcode-engine/commit/30267cb173fca2cd80a61450b9f2fe2bceac0f06))
+* support for hiding settings tabs when there is only one item ([#669](https://github.com/alibaba/lowcode-engine/issues/669)) ([cbd95a1](https://github.com/alibaba/lowcode-engine/commit/cbd95a1778415406670f37507ce957af6b3ecd4a))
+* support for NotFoundComponent design state is optional ([#1013](https://github.com/alibaba/lowcode-engine/issues/1013)) ([d3c891e](https://github.com/alibaba/lowcode-engine/commit/d3c891e2a46d138e31c81a7f9b804a8240154df5))
+* support opening document with id ([3f7c0cd](https://github.com/alibaba/lowcode-engine/commit/3f7c0cd5191b7924f2630c58e6439f4d4a936ac9))
+* support SPA mode ([1f9150e](https://github.com/alibaba/lowcode-engine/commit/1f9150e4b260d522bd7cb31497069b700a1e8576))
+* sync utils/constants ([#506](https://github.com/alibaba/lowcode-engine/issues/506)) ([2871b5b](https://github.com/alibaba/lowcode-engine/commit/2871b5ba4c3dbf1ed76bf4d6359fb457190a9b22))
+* the tips when dragging a component from the component panel same with the moving component ([dbe0764](https://github.com/alibaba/lowcode-engine/commit/dbe0764ff4901450f03ca56b62167fbc87d2524a))
+
+
+### Bug Fixes
+
+* 🐛 解决 react 中 jsx 出码的时候对于循环数据漏包 __$evalArray 的问题 ([3b9b177](https://github.com/alibaba/lowcode-engine/commit/3b9b177b052169cd0c1078cf8b488f04cb374dac))
+* 🐛 解决出码缺乏对于 i18n 数据的 params 的处理的问题 ([2cf788c](https://github.com/alibaba/lowcode-engine/commit/2cf788c1716ae63fef20004348c59a5a65c6b3d2)), closes [#288](https://github.com/alibaba/lowcode-engine/issues/288)
+* 🐛 解决小程序环境没有 window, 而 rax 出码中却默认在 __$eval 中用到 window 的问题 ([ce531ae](https://github.com/alibaba/lowcode-engine/commit/ce531aeb457711fac92d828b431cfc3d643b3682))
+* 🐛 修复数据源引擎请求处理器映射严格模式下被过滤的问题 ([75626d8](https://github.com/alibaba/lowcode-engine/commit/75626d877db017b8862b1d5e64d75f3af7ff667a))
+* 🐛 修正 i18n 里面的一个参数命名问题 ([20c6fca](https://github.com/alibaba/lowcode-engine/commit/20c6fca03e99b11fa5c257cbbda0d4d23f410090))
+* 新元素无法在大纲树拖拽 ([3d41fd5](https://github.com/alibaba/lowcode-engine/commit/3d41fd5d0783048a7cfb54c6f80d058856153d25))
+* 修复React17选中组件bug ([750d282](https://github.com/alibaba/lowcode-engine/commit/750d282c03a880204fefdef01e180510465b82f8))
+* 修正 react 框架出码中在严格模式对 methods 和 context 的处理 ([b1a6100](https://github.com/alibaba/lowcode-engine/commit/b1a61006bba4292790899c7c49c9c611a9384472))
+* 左侧抽屉固定模式层级不足 ([c657cee](https://github.com/alibaba/lowcode-engine/commit/c657cee0694e3126dee89588a2aa17c4e118f786))
+* add lowcode-designer, lowcode-utils dependencies ([d250242](https://github.com/alibaba/lowcode-engine/commit/d2502427ca988881747a35bd8da49f024939b833))
+* add support for jsx expression ([1043ef8](https://github.com/alibaba/lowcode-engine/commit/1043ef82b1e9ceefc3b74fd21eb28e9a740bd1db))
+* addon-combine affect metadata unexpectedly ([fc5fbc6](https://github.com/alibaba/lowcode-engine/commit/fc5fbc63a04a32bc887754f32e74c76149d74b05))
+* adjust synchronize-order of packages ([81a7304](https://github.com/alibaba/lowcode-engine/commit/81a73049bd848524e1156761ded08ddf325863ba))
+* change typescript type export to export type ([50e4a03](https://github.com/alibaba/lowcode-engine/commit/50e4a03b7d810131ce413cc057b43d4a726f1ebe))
+* change typescript type export to export type ([573504b](https://github.com/alibaba/lowcode-engine/commit/573504b0e3537ca60d234ce2b2f3feedb323405e))
+* declare parameter appHelper for valid engine options ([058a842](https://github.com/alibaba/lowcode-engine/commit/058a84226af8ca19d8c7d63599d80d0cdf70281c))
+* defaultValue should be evaluated inspite of condition result is falsy, fixes [#1045](https://github.com/alibaba/lowcode-engine/issues/1045) ([fcfce3c](https://github.com/alibaba/lowcode-engine/commit/fcfce3cbeb5a53600c40aea07ffef19c9c9591c4))
+* delete the defaultValue configuration outside the loop ([acf7449](https://github.com/alibaba/lowcode-engine/commit/acf7449ca231d45e8ed7e1d9416817ea11b1266f))
+* delete unused typescript types ([63f5d2c](https://github.com/alibaba/lowcode-engine/commit/63f5d2ca3e0bda92898fd0df28c9500707812082))
+* delete unused typescript types ([2432aed](https://github.com/alibaba/lowcode-engine/commit/2432aed83d55407d2f8b5f94910ada7ea78bb59e))
+* designer/loadIncrementalAssets await Sequential ([#841](https://github.com/alibaba/lowcode-engine/issues/841)) ([8232424](https://github.com/alibaba/lowcode-engine/commit/823242469743d235923b3b946ec7d2db70887ead))
+* error thrown when triggering undo after save schema on SchemaPane ([9be46e7](https://github.com/alibaba/lowcode-engine/commit/9be46e7b34e3a40cbc489dbae4bfd0915c2090e3))
+* fallback focusNode to root if empty ([a9a118f](https://github.com/alibaba/lowcode-engine/commit/a9a118fe6e79080245c6eea42ed26772b7c784ca))
+* **filter:** unique key prop warning ([3fe6e41](https://github.com/alibaba/lowcode-engine/commit/3fe6e41536cd3a9b9c7eaca5b353de4bd1f91b11))
+* **filter:** unique key prop warning ([06e6920](https://github.com/alibaba/lowcode-engine/commit/06e6920602bdf21b6e1ffe5cfa3dfe4856e7c57e))
+* fix css resources with parameters not loading correctly ([f859752](https://github.com/alibaba/lowcode-engine/commit/f85975211814147d40ae5330a76cb21cb6c66916))
+* fix css resources with parameters not loading correctly ([9a5a04a](https://github.com/alibaba/lowcode-engine/commit/9a5a04ac9560fb6a51bf4e0ed8ea446381d39c35))
+* fix dataSource needs to be compatible due to empty schema ([98bc477](https://github.com/alibaba/lowcode-engine/commit/98bc477d80dbf7993f89befdb42762d78a55fb1b))
+* fix displayName spell mistake ([2b2bcbd](https://github.com/alibaba/lowcode-engine/commit/2b2bcbdaebde6a3ce974072f586386ef7ef3497c))
+* fix internal project.getSchema default stage is error ([0d40db2](https://github.com/alibaba/lowcode-engine/commit/0d40db2581f4fe5a9e22f763f21aec641e366c34))
+* fix lint issues for renderer-core/renderer/base ([d85437d](https://github.com/alibaba/lowcode-engine/commit/d85437d4af1043371e27dfde98cecf914b93a126))
+* fix lint issues for renderer-core/renderer/base ([4b59190](https://github.com/alibaba/lowcode-engine/commit/4b59190c7f9d518bc7efac44b7eeee73f1b5d177))
+* fix low-code component rendering problems: 1. thisRequiredInJSE does not take effect 2. jsx components cannot obtain source components ([5dd4625](https://github.com/alibaba/lowcode-engine/commit/5dd462544fbbbccfa97165f2bcfeed8629fab2a3))
+* fix material-spec demo ([438cccd](https://github.com/alibaba/lowcode-engine/commit/438cccd58e4341638070c1d8b2d4e78e4e20e3fb))
+* fix misused doc urls ([16a8857](https://github.com/alibaba/lowcode-engine/commit/16a88578634b9da2f04698df5ca5a5e69151bb97))
+* fix monitor utils incorrect assignment method ([bf280c6](https://github.com/alibaba/lowcode-engine/commit/bf280c6fa1e46d084fc8f20323164816fad4076f))
+* fix outline-pane invisible occasionally when dragging tree node ([031c7f2](https://github.com/alibaba/lowcode-engine/commit/031c7f25f10a6cfebfc7929c9226f4e4167a359f))
+* fix outline-tree initialization failed ([a2d5c6f](https://github.com/alibaba/lowcode-engine/commit/a2d5c6fd90ca0226bbbfea01a4b28c8b8d307a78))
+* fix render module state expression initialization exception ([5bd68ee](https://github.com/alibaba/lowcode-engine/commit/5bd68ee6b448fa58b022870b3f8175d8b77febde))
+* fix render module state expression initialization exception ([9c545cc](https://github.com/alibaba/lowcode-engine/commit/9c545cca6004f65e2f206ea001cefa3fa3cfa807))
+* fix setter hooks error ([8a3a0b8](https://github.com/alibaba/lowcode-engine/commit/8a3a0b824162e25a930711c6fef511b4b369e897))
+* fix test case failures of designer ([4b0521a](https://github.com/alibaba/lowcode-engine/commit/4b0521a47494f78e120f75021e0a076fb00ce53e))
+* Fix the conversion failure of some props expressions under Slot props of low-code components ([7db5461](https://github.com/alibaba/lowcode-engine/commit/7db5461706c739fac673b2466bc2fda7661242e4))
+* fix the leaf hoc component fails to monitor Node changes, and modify the logic for get node ([6ee6b07](https://github.com/alibaba/lowcode-engine/commit/6ee6b07a10ba4aac583def52d8ff1fa78d111d0b))
+* fix the leaf hoc component fails to monitor Node changes, and modify the logic for get node ([f400172](https://github.com/alibaba/lowcode-engine/commit/f4001728259047b09db75d76a8c3ef1e1bcb4e0a))
+* fix the problem that material.getComponentMetasMap returns the wrong result ([e02933c](https://github.com/alibaba/lowcode-engine/commit/e02933c18bc15519b2eba8ad946282502a509611))
+* Fix the rendering error caused by incorrect key value when configuring the loop ([1026763](https://github.com/alibaba/lowcode-engine/commit/1026763dc5a77d4395a1e86e5a0084ab4fb4230c))
+* fix the unit test failure problem caused by thisRequiredInJSE modification ([c2c59b7](https://github.com/alibaba/lowcode-engine/commit/c2c59b7ff72ba06156bbcdb952262739d6188209))
+* fix unnecessary props calculation ([f1fed75](https://github.com/alibaba/lowcode-engine/commit/f1fed75f39be8289ede1ec558b04428a69e25b5f))
+* fixed an issue where materials would be rendered multiple times ([9d187cc](https://github.com/alibaba/lowcode-engine/commit/9d187ccb7de55857e861d3fc881c610506872d03))
+* fixed an issue where materials would be rendered multiple times ([64cc328](https://github.com/alibaba/lowcode-engine/commit/64cc3283c15342151a8f93c46a276681f3575153))
+* fixed focusNodeSelector configuration not taking effect ([9beae9c](https://github.com/alibaba/lowcode-engine/commit/9beae9c3269901bf03a29033121c7d480571bce5))
+* fixed the issue that thisRequiredInJSE did not take effect in some scenarios ([7e5a919](https://github.com/alibaba/lowcode-engine/commit/7e5a919f9352397f11741fd911495996469c0256))
+* in ES require changed to import ([b4d7d6d](https://github.com/alibaba/lowcode-engine/commit/b4d7d6d8c290a335a2c1f60731d4417b23444941))
+* in ES require changed to import ([7c8cd36](https://github.com/alibaba/lowcode-engine/commit/7c8cd36a10a7caa61de31a15abd93ab8a97fbe08))
+* leaf should be type of ShellNode other than InnerNode ([5bb8cf5](https://github.com/alibaba/lowcode-engine/commit/5bb8cf5d12d38d70b69fa28deb2f8aa0afa9b9b9))
+* lowcode component exec lifecycle has error ([f99a47e](https://github.com/alibaba/lowcode-engine/commit/f99a47e502080134454795f5e361cfa4fba3f03b))
+* lowcode component leaf dont have export prop, exec leaf.export make error ([9d51dcd](https://github.com/alibaba/lowcode-engine/commit/9d51dcdae38850be0206861f2cae74ca68805c25))
+* missing engine options config info ([a79875c](https://github.com/alibaba/lowcode-engine/commit/a79875cf8698d3912b50526d97f6ac72e9a21fc9))
+* missing engine options config info ([9ccded0](https://github.com/alibaba/lowcode-engine/commit/9ccded006ef44cd538abaa140250e519243bf090))
+* npm run clean error in windows ([a176e9d](https://github.com/alibaba/lowcode-engine/commit/a176e9d245981fb5718c8d144f477202b3796be6))
+* project event listeners will not be invoked sometimes ([a0c772f](https://github.com/alibaba/lowcode-engine/commit/a0c772fb903cf5eb9e0b811b64bbe3846d4ba8ac))
+* project.exportSchema api lack stage param & setAssets should be a async fn ([0ea76a7](https://github.com/alibaba/lowcode-engine/commit/0ea76a746fac8ea8e7b999d42434c468c85d6372))
+* project.exportSchema should export componentsMap of all documents ([969a130](https://github.com/alibaba/lowcode-engine/commit/969a130b373fb028f8051e96cb9d79f1de0a2a1c))
+* removed incorrectly calling childWhitelist hook logic during drag and drop ([#1141](https://github.com/alibaba/lowcode-engine/issues/1141)) ([6576346](https://github.com/alibaba/lowcode-engine/commit/6576346b9185bedb090be9c84129e077cf5389b3))
+* renderer not rendering correct components when loading components with loadAsyncLibrary api ([9b3b4f9](https://github.com/alibaba/lowcode-engine/commit/9b3b4f9b0e35ef3ea2f0117f0cdb2254e15d5389))
+* should pass index param when creating a Prop instance under a list type Prop instance, fix [#780](https://github.com/alibaba/lowcode-engine/issues/780) ([a8de3f2](https://github.com/alibaba/lowcode-engine/commit/a8de3f299c7b26fa939d2b2ea1428143e2b5fb01))
+* simulator eclipses setting area [#773](https://github.com/alibaba/lowcode-engine/issues/773) ([b4b30a3](https://github.com/alibaba/lowcode-engine/commit/b4b30a359932f5c0e8fde1b28f54a883c87901d8))
+* spec typo ([#1064](https://github.com/alibaba/lowcode-engine/issues/1064)) ([ecb9dca](https://github.com/alibaba/lowcode-engine/commit/ecb9dca2b9386ef6fadfd009d161a9203b9b9558))
+* try catch calculation of dynamic setter ([f61e2a2](https://github.com/alibaba/lowcode-engine/commit/f61e2a2b8a3d8d6754474cd392bc259917c7eb10))
+* type=legao dont make request ([98ececa](https://github.com/alibaba/lowcode-engine/commit/98ececa9c11f93e5f849b201b5b5e7ff453733d7))
+* **types:** rrror declaration of the children prop ([951d1cb](https://github.com/alibaba/lowcode-engine/commit/951d1cb103fa46c0e7926d6138657c7d10cc4f88))
+* use the original object if it is not a shell object ([5ea53f7](https://github.com/alibaba/lowcode-engine/commit/5ea53f706b6571946bcfa56b8655b55717381771))
+* use the outer documentation url of unique key, fixes [#868](https://github.com/alibaba/lowcode-engine/issues/868) ([d770007](https://github.com/alibaba/lowcode-engine/commit/d770007ff8c39e6cf527e07a7d6468dbb88c776d))
+* use the outer documentation url of unique key, fixes [#868](https://github.com/alibaba/lowcode-engine/issues/868) ([912ee22](https://github.com/alibaba/lowcode-engine/commit/912ee22180a424f63298c319c62fb481513af904))
+* use uppercase resize trigger names based on material spec ([7fda0ef](https://github.com/alibaba/lowcode-engine/commit/7fda0efe131e0e2e3141849cf3f87307e7ce1b36))
+* when designMode is not design, the hidden attribute does not take effect ([3dd0b6d](https://github.com/alibaba/lowcode-engine/commit/3dd0b6d0a86267e3029c176ff49aff793ce3e186))
+
### [1.0.4](https://github.com/alibaba/lowcode-engine/compare/@alilc/lowcode-code-generator@1.0.4-beta.0...@alilc/lowcode-code-generator@1.0.4) (2022-04-12)
diff --git a/modules/code-generator/CONTRIBUTING.md b/modules/code-generator/CONTRIBUTING.md
index c6af74bf71..5f4d373b80 100644
--- a/modules/code-generator/CONTRIBUTING.md
+++ b/modules/code-generator/CONTRIBUTING.md
@@ -1,10 +1,11 @@
# 如何共建
1. 拉取最新代码，切换到 develop 分支，基于 develop 分支切出一个 feature 或 hotfix 分支
-2. 安装依赖(`npm`)，然后先跑一遍 `npm test` 看看是否所有用例都能通过 (如果网络条件不太好，建议使用 [cnpm - 淘宝提供的中国 NPM 镜像](https://npmmirror.com/))
-3. 在 tests 目录下编写您的需求/问题的测试用例
-4. 修改 src 下的一些代码，然后运行 `npm test` 或 `npm start` 启动 jest 进行调测
-5. 确保所有的测试用例都能通过时，提 MR 给 @牧毅 -- MR 将在 1 个工作日内给您回复意见。
+2. 到 `lowcode-engine` 项目根目录下，执行 `lerna bootstrap && lerna run build --scope "@alilc/lowcode-types"` 来安装依赖并构建
+3. 到 `lowcode-engine/modules/code-generator`下，安装依赖(`npm i`)，然后先跑一遍 `npm test` 看看是否所有用例都能通过 (如果网络条件不太好，建议使用 [cnpm - 淘宝提供的中国 NPM 镜像](https://npmmirror.com/))
+4. 在 tests 目录下编写您的需求/问题的测试用例
+5. 修改 src 下的一些代码，然后运行 `npm test` 或 `npm start` 启动 jest 进行调测
+6. 确保所有的测试用例都能通过时，提 MR 给 @牧毅 -- MR 将在 1 个工作日内给您回复意见。
当然，欢迎提前私聊沟通 @牧毅，或加入 低代码渲染/出码服务金牌用户群 讨论沟通。
diff --git a/modules/code-generator/README.md b/modules/code-generator/README.md
index 03ce94b54e..1d67b3aa16 100644
--- a/modules/code-generator/README.md
+++ b/modules/code-generator/README.md
@@ -94,16 +94,26 @@ await CodeGenerator.init();
4. 出码
```js
-const result = await CodeGenerator.generateCode({
+const project = await CodeGenerator.generateCode({
solution: 'icejs', // 出码方案 (目前内置有 icejs 和 rax )
schema, // 编排搭建出来的 schema
});
-console.log(result); // 出码结果(默认是递归结构描述的，可以传 flattenResult: true 以生成扁平结构的结果)
+console.log(project); // 出码结果(默认是递归结构描述的，可以传 flattenResult: true 以生成扁平结构的结果)
```
注：一般来说在浏览器中出码适合做即时预览功能。
+5. 下载 zip 包
+
+```js
+// 写入到 zip 包
+await CodeGenerator.publishers.zip().publish({
+ project, // 上一步生成的 project
+ projectSlug: 'your-project-slug', // 项目标识 -- 对应下载 your-project-slug.zip 文件
+});
+```
+
### 5）自定义出码
前端框架灵活多变，默认内置的出码方案很难满足所有人的需求，好在此代码生成器支持非常灵活的插件机制 -- 欢迎参考 ./src/plugins/xxx 来编写您自己的出码插件，然后参考 ./src/solutions/xxx 将各种插件组合成一套适合您的业务场景的出码方案。
diff --git a/modules/code-generator/babel.config.js b/modules/code-generator/babel.config.js
new file mode 100644
index 0000000000..c5986f2bc0
--- /dev/null
+++ b/modules/code-generator/babel.config.js
@@ -0,0 +1 @@
+module.exports = require('../../babel.config');
\ No newline at end of file
diff --git a/modules/code-generator/bin/lowcode-code-generator.js b/modules/code-generator/bin/lowcode-code-generator.js
index 6259a5a6fc..79c36c49a0 100755
--- a/modules/code-generator/bin/lowcode-code-generator.js
+++ b/modules/code-generator/bin/lowcode-code-generator.js
@@ -14,6 +14,7 @@ program
.option('-c, --cwd ', 'specify the working directory', '.')
.option('-q, --quiet', 'be quiet, do not output anything unless get error', false)
.option('-v, --verbose', 'be verbose, output more information', false)
+ .option('--solution-options ', 'specify the solution options', '{}')
.arguments('[input-schema] ali lowcode schema JSON file')
.action(function doGenerate(inputSchema, command) {
var options = command.opts();
diff --git a/modules/code-generator/example-schema.json b/modules/code-generator/example-schema.json
index aaf3a3e0d8..5e31b1bea9 100644
--- a/modules/code-generator/example-schema.json
+++ b/modules/code-generator/example-schema.json
@@ -62,17 +62,17 @@
"router": "/"
},
"props": {
- "ref": "outterView",
+ "ref": "outerView",
"autoLoading": true
},
"fileName": "test",
"state": {
- "text": "outter"
+ "text": "outer"
},
"lifeCycles": {
"componentDidMount": {
- "type": "JSExpression",
- "value": "function() { console.log('componentDidMount'); }"
+ "type": "JSFunction",
+ "value": "function componentDidMount() { console.log('componentDidMount'); }"
}
},
"dataSource": {
@@ -91,7 +91,7 @@
"isSync": true
},
"dataHandler": {
- "type": "JSExpression",
+ "type": "JSFunction",
"value": "function (response) {\nif (!response.data.success){\n throw new Error(response.data.message);\n }\n return response.data.data;\n}"
}
},
@@ -105,13 +105,13 @@
"isSync": true
},
"dataHandler": {
- "type": "JSExpression",
+ "type": "JSFunction",
"value": "function (response) {\nif (!response.data.success){\n throw new Error(response.data.message);\n }\n return response.data.data.result;\n}"
}
}
],
"dataHandler": {
- "type": "JSExpression",
+ "type": "JSFunction",
"value": "function (dataMap) {\n console.info(\"All datasources loaded:\", dataMap);\n}"
}
},
diff --git a/modules/code-generator/example-schema.json5 b/modules/code-generator/example-schema.json5
index f71096fc41..4ab02999ec 100644
--- a/modules/code-generator/example-schema.json5
+++ b/modules/code-generator/example-schema.json5
@@ -62,17 +62,17 @@
router: '/',
},
props: {
- ref: 'outterView',
+ ref: 'outerView',
autoLoading: true,
},
fileName: 'test',
state: {
- text: 'outter',
+ text: 'outer',
},
lifeCycles: {
componentDidMount: {
- type: 'JSExpression',
- value: "function() { console.log('componentDidMount'); }",
+ type: 'JSFunction',
+ value: "function componentDidMount() { console.log('componentDidMount'); }",
},
},
dataSource: {
@@ -91,7 +91,7 @@
isSync: true,
},
dataHandler: {
- type: 'JSExpression',
+ type: 'JSFunction',
value: 'function (response) {\nif (!response.data.success){\n throw new Error(response.data.message);\n }\n return response.data.data;\n}',
},
},
@@ -105,13 +105,13 @@
isSync: true,
},
dataHandler: {
- type: 'JSExpression',
+ type: 'JSFunction',
value: 'function (response) {\nif (!response.data.success){\n throw new Error(response.data.message);\n }\n return response.data.data.result;\n}',
},
},
],
dataHandler: {
- type: 'JSExpression',
+ type: 'JSFunction',
value: 'function (dataMap) {\n console.info("All datasources loaded:", dataMap);\n}',
},
},
diff --git a/modules/code-generator/package.json b/modules/code-generator/package.json
index 18eb9af638..cd114fa067 100644
--- a/modules/code-generator/package.json
+++ b/modules/code-generator/package.json
@@ -1,6 +1,6 @@
{
"name": "@alilc/lowcode-code-generator",
- "version": "1.0.5",
+ "version": "1.1.7",
"description": "出码引擎 for LowCode Engine",
"license": "MIT",
"main": "lib/index.js",
@@ -47,6 +47,11 @@
"prepublishOnly": "npm run build",
"demo": "node bin/lowcode-code-generator.js -i example-schema.json -o demo -s icejs"
},
+ "standard-version": {
+ "skip": {
+ "changelog": true
+ }
+ },
"husky": {
"hooks": {
"pre-commit": "lint-staged",
@@ -75,6 +80,7 @@
"change-case": "^3.1.0",
"commander": "^6.1.0",
"debug": "^4.3.2",
+ "file-saver": "^2.0.5",
"fp-ts": "^2.11.9",
"fs-extra": "9.x",
"glob": "^7.2.0",
@@ -93,6 +99,7 @@
"qs": "^6.10.1",
"semver": "^7.3.4",
"short-uuid": "^3.1.1",
+ "babel-jest": "^26.5.2",
"tslib": "^2.3.1"
},
"browser": {
@@ -103,6 +110,7 @@
"devDependencies": {
"@iceworks/spec": "^1.4.2",
"@types/babel__traverse": "^7.11.0",
+ "@types/file-saver": "^2.0.7",
"@types/jest": "^27.0.2",
"@types/lodash": "^4.14.162",
"@types/node": "^14.14.20",
@@ -120,11 +128,11 @@
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-react": "^7.22.0",
"eslint-plugin-react-hooks": "^4.2.0",
- "jest": "^27.4.7",
+ "jest": "^26.5.2",
"jest-util": "^27.4.2",
"rimraf": "^3.0.2",
"standard-version": "^9.1.1",
- "ts-jest": "^27.1.3",
+ "ts-jest": "^26.5.2",
"ts-loader": "^6.2.2",
"ts-node": "^8.10.2",
"tsconfig-paths": "^3.9.0",
@@ -137,5 +145,11 @@
"publishConfig": {
"access": "public",
"registry": "https://registry.npmjs.org/"
- }
+ },
+ "repository": {
+ "type": "http",
+ "url": "https://github.com/alibaba/lowcode-engine/tree/main/modules/code-generator"
+ },
+ "bugs": "https://github.com/alibaba/lowcode-engine/issues",
+ "homepage": "https://github.com/alibaba/lowcode-engine/#readme"
}
diff --git a/modules/code-generator/src/analyzer/componentAnalyzer.ts b/modules/code-generator/src/analyzer/componentAnalyzer.ts
index 952295a15f..69e8ad482d 100644
--- a/modules/code-generator/src/analyzer/componentAnalyzer.ts
+++ b/modules/code-generator/src/analyzer/componentAnalyzer.ts
@@ -1,13 +1,13 @@
-import type { NodeSchema, CompositeObject } from '@alilc/lowcode-types';
+import type { IPublicTypeNodeSchema, IPublicTypeCompositeObject } from '@alilc/lowcode-types';
import type { TComponentAnalyzer } from '../types';
import { handleSubNodes } from '../utils/schema';
export const componentAnalyzer: TComponentAnalyzer = (container) => {
let hasRefAttr = false;
- const nodeValidator = (n: NodeSchema) => {
+ const nodeValidator = (n: IPublicTypeNodeSchema) => {
if (n.props) {
- const props = n.props as CompositeObject;
+ const props = n.props as IPublicTypeCompositeObject;
if (props.ref) {
hasRefAttr = true;
}
diff --git a/modules/code-generator/src/cli/run.ts b/modules/code-generator/src/cli/run.ts
index db66b46013..ec6814f767 100644
--- a/modules/code-generator/src/cli/run.ts
+++ b/modules/code-generator/src/cli/run.ts
@@ -9,7 +9,7 @@ import * as path from 'path';
import { getErrorMessage } from '../utils/errors';
import CodeGenerator from '..';
import type { IProjectBuilder } from '..';
-import type { ProjectSchema } from '@alilc/lowcode-types';
+import type { IPublicTypeProjectSchema } from '@alilc/lowcode-types';
/**
* 执行出码 CLI 命令
@@ -25,6 +25,7 @@ export async function run(
output?: string;
quiet?: boolean;
verbose?: boolean;
+ solutionOptions?: string;
},
): Promise {
try {
@@ -41,6 +42,19 @@ export async function run(
);
}
+ let solutionOptions = {};
+
+ if (options.solutionOptions) {
+ try {
+ solutionOptions = JSON.parse(options.solutionOptions);
+ } catch (err: any) {
+ throw new Error(
+ `solution options parse error, error message is "${err.message}"`,
+ );
+ }
+ }
+
+
// 读取 Schema
const schema = await loadSchemaFile(schemaFile);
@@ -48,7 +62,7 @@ export async function run(
const createProjectBuilder = await getProjectBuilderFactory(options.solution, {
quiet: options.quiet,
});
- const builder = createProjectBuilder();
+ const builder = createProjectBuilder(solutionOptions);
// 生成代码
const generatedSourceCodes = await builder.generateProject(schema);
@@ -75,7 +89,7 @@ export async function run(
async function getProjectBuilderFactory(
solution: string,
{ quiet }: { quiet?: boolean },
-): Promise<() => IProjectBuilder> {
+): Promise<(options: {[prop: string]: any}) => IProjectBuilder> {
if (solution in CodeGenerator.solutions) {
return CodeGenerator.solutions[solution as 'icejs' | 'rax'];
}
@@ -117,7 +131,7 @@ function isLocalSolution(solution: string) {
return solution.startsWith('.') || solution.startsWith('/') || solution.startsWith('~');
}
-async function loadSchemaFile(schemaFile: string): Promise {
+async function loadSchemaFile(schemaFile: string): Promise {
if (!schemaFile) {
throw new Error('invalid schema file name');
}
diff --git a/modules/code-generator/src/cli/solutions/example-solution.ts b/modules/code-generator/src/cli/solutions/example-solution.ts
index 2efff780cd..bfb9d079b1 100644
--- a/modules/code-generator/src/cli/solutions/example-solution.ts
+++ b/modules/code-generator/src/cli/solutions/example-solution.ts
@@ -289,8 +289,8 @@ codealike.json
},
"lifeCycles": {
"componentDidMount": {
- "type": "JSExpression",
- "value": "function() { console.log('componentDidMount'); }"
+ "type": "JSFunction",
+ "value": "function componentDidMount() {\\n console.log('componentDidMount');\\n}"
}
},
"methodsModule": {
@@ -559,8 +559,8 @@ codealike.json
"registry": "https://registry.npm.xxx.com"
},
"dependencies": {
- "@alilc/lowcode-code-generator": "^1.0.0-beta.16",
- "@alilc/lowcode-types": "^1.0.0-beta.21",
+ "@alilc/lowcode-code-generator": "^1.0.0",
+ "@alilc/lowcode-types": "^1.0.0",
"tslib": "^2.3.0"
},
"devDependencies": {
@@ -635,18 +635,20 @@ export default function createHelloWorldProjectBuilder() {
template: CodeGen.solutionParts.icejs.template,
plugins: {
components: [
- CodeGen.plugins.react.reactCommonDeps(),
- CodeGen.plugins.common.esmodule({ fileType: 'jsx' }),
- CodeGen.plugins.react.containerClass(),
- CodeGen.plugins.react.containerInjectContext(),
- CodeGen.plugins.react.containerInjectUtils(),
- CodeGen.plugins.react.containerInjectDataSourceEngine(),
- CodeGen.plugins.react.containerInjectI18n(),
- CodeGen.plugins.react.containerInitState(),
- CodeGen.plugins.react.containerLifeCycle(),
- CodeGen.plugins.react.containerMethod(),
+ CodeGen.plugins.icejs.reactCommonDeps(),
+ CodeGen.plugins.common.esModule({ fileType: 'jsx' }),
+ CodeGen.plugins.common.styleImport(),
+ CodeGen.plugins.icejs.containerClass(),
+ CodeGen.plugins.icejs.containerInjectContext(),
+ CodeGen.plugins.icejs.containerInjectUtils(),
+ CodeGen.plugins.icejs.containerInjectDataSourceEngine(),
+ CodeGen.plugins.icejs.containerInjectI18n(),
+ CodeGen.plugins.icejs.containerInjectConstants(),
+ CodeGen.plugins.icejs.containerInitState(),
+ CodeGen.plugins.icejs.containerLifeCycle(),
+ CodeGen.plugins.icejs.containerMethod(),
examplePlugin(),
- CodeGen.plugins.react.jsx({
+ CodeGen.plugins.icejs.jsx({
nodeTypeMapping: {
Div: 'div',
Component: 'div',
@@ -657,18 +659,20 @@ export default function createHelloWorldProjectBuilder() {
CodeGen.plugins.style.css(),
],
pages: [
- CodeGen.plugins.react.reactCommonDeps(),
- CodeGen.plugins.common.esmodule({ fileType: 'jsx' }),
- CodeGen.plugins.react.containerClass(),
- CodeGen.plugins.react.containerInjectContext(),
- CodeGen.plugins.react.containerInjectUtils(),
- CodeGen.plugins.react.containerInjectDataSourceEngine(),
- CodeGen.plugins.react.containerInjectI18n(),
- CodeGen.plugins.react.containerInitState(),
- CodeGen.plugins.react.containerLifeCycle(),
- CodeGen.plugins.react.containerMethod(),
+ CodeGen.plugins.icejs.reactCommonDeps(),
+ CodeGen.plugins.common.esModule({ fileType: 'jsx' }),
+ CodeGen.plugins.common.styleImport(),
+ CodeGen.plugins.icejs.containerClass(),
+ CodeGen.plugins.icejs.containerInjectContext(),
+ CodeGen.plugins.icejs.containerInjectUtils(),
+ CodeGen.plugins.icejs.containerInjectDataSourceEngine(),
+ CodeGen.plugins.icejs.containerInjectI18n(),
+ CodeGen.plugins.icejs.containerInjectConstants(),
+ CodeGen.plugins.icejs.containerInitState(),
+ CodeGen.plugins.icejs.containerLifeCycle(),
+ CodeGen.plugins.icejs.containerMethod(),
examplePlugin(),
- CodeGen.plugins.react.jsx({
+ CodeGen.plugins.icejs.jsx({
nodeTypeMapping: {
Div: 'div',
Component: 'div',
@@ -679,13 +683,13 @@ export default function createHelloWorldProjectBuilder() {
CodeGen.plugins.style.css(),
],
router: [
- CodeGen.plugins.common.esmodule(),
+ CodeGen.plugins.common.esModule(),
CodeGen.solutionParts.icejs.plugins.router(),
],
entry: [CodeGen.solutionParts.icejs.plugins.entry()],
constants: [CodeGen.plugins.project.constants()],
utils: [
- CodeGen.plugins.common.esmodule(),
+ CodeGen.plugins.common.esModule(),
CodeGen.plugins.project.utils('react'),
],
i18n: [CodeGen.plugins.project.i18n()],
diff --git a/modules/code-generator/src/const/index.ts b/modules/code-generator/src/const/index.ts
index 103d912db6..24449ca429 100644
--- a/modules/code-generator/src/const/index.ts
+++ b/modules/code-generator/src/const/index.ts
@@ -8,5 +8,26 @@ export const CONTAINER_TYPE = {
export const SUPPORT_SCHEMA_VERSION_LIST = ['0.0.1', '1.0.0'];
+// built-in slot names which have been handled in ProjectBuilder
+export const BUILTIN_SLOT_NAMES = [
+ 'pages',
+ 'components',
+ 'router',
+ 'entry',
+ 'appConfig',
+ 'buildConfig',
+ 'constants',
+ 'utils',
+ 'i18n',
+ 'globalStyle',
+ 'htmlEntry',
+ 'packageJSON',
+ 'demo',
+];
+
+export const isBuiltinSlotName = function (name: string) {
+ return BUILTIN_SLOT_NAMES.includes(name);
+};
+
export * from './file';
export * from './generator';
diff --git a/modules/code-generator/src/generator/ModuleBuilder.ts b/modules/code-generator/src/generator/ModuleBuilder.ts
index f4554ef612..e172f716e5 100644
--- a/modules/code-generator/src/generator/ModuleBuilder.ts
+++ b/modules/code-generator/src/generator/ModuleBuilder.ts
@@ -1,4 +1,4 @@
-import { ProjectSchema, ResultFile, ResultDir } from '@alilc/lowcode-types';
+import { IPublicTypeProjectSchema, ResultFile, ResultDir } from '@alilc/lowcode-types';
import {
BuilderComponentPlugin,
@@ -62,10 +62,9 @@ export function createModuleBuilder(
if (options.postProcessors.length > 0) {
files = files.map((file) => {
- let { content } = file;
- const type = file.ext;
+ let { content, ext: type, name } = file;
options.postProcessors.forEach((processer) => {
- content = processer(content, type);
+ content = processer(content, type, name);
});
return createResultFile(file.name, type, content);
@@ -77,7 +76,7 @@ export function createModuleBuilder(
};
};
- const generateModuleCode = async (schema: ProjectSchema | string): Promise => {
+ const generateModuleCode = async (schema: IPublicTypeProjectSchema | string): Promise => {
// Init
const schemaParser: ISchemaParser = new SchemaParser();
const parseResult: IParseResult = schemaParser.parse(schema);
diff --git a/modules/code-generator/src/generator/ProjectBuilder.ts b/modules/code-generator/src/generator/ProjectBuilder.ts
index 2a1282d6eb..a910b49002 100644
--- a/modules/code-generator/src/generator/ProjectBuilder.ts
+++ b/modules/code-generator/src/generator/ProjectBuilder.ts
@@ -1,4 +1,4 @@
-import { ResultDir, ResultFile, ProjectSchema } from '@alilc/lowcode-types';
+import { ResultDir, ResultFile, IPublicTypeProjectSchema } from '@alilc/lowcode-types';
import {
IModuleBuilder,
@@ -16,6 +16,7 @@ import { createResultDir, addDirectory, addFile } from '../utils/resultHelper';
import { createModuleBuilder } from './ModuleBuilder';
import { ProjectPreProcessor, ProjectPostProcessor, IContextData } from '../types/core';
import { CodeGeneratorError } from '../types/error';
+import { isBuiltinSlotName } from '../const';
interface IModuleInfo {
moduleName?: string;
@@ -24,22 +25,36 @@ interface IModuleInfo {
}
export interface ProjectBuilderInitOptions {
+
/** 项目模板 */
template: IProjectTemplate;
+
/** 项目插件 */
plugins: IProjectPlugins;
+
/** 模块后置处理器 */
postProcessors: PostProcessor[];
+
/** Schema 解析器 */
schemaParser?: ISchemaParser;
+
/** 项目级别的前置处理器 */
projectPreProcessors?: ProjectPreProcessor[];
+
/** 项目级别的后置处理器 */
projectPostProcessors?: ProjectPostProcessor[];
+
/** 是否处于严格模式 */
inStrictMode?: boolean;
+
/** 一些额外的上下文数据 */
extraContextData?: Record;
+
+ /**
+ * Hook which is used to customize original options, we can reorder/add/remove plugins/processors
+ * of the existing solution.
+ */
+ customizeBuilderOptions?(originalOptions: ProjectBuilderInitOptions): ProjectBuilderInitOptions;
}
export class ProjectBuilder implements IProjectBuilder {
@@ -62,21 +77,26 @@ export class ProjectBuilder implements IProjectBuilder {
private projectPostProcessors: ProjectPostProcessor[];
/** 是否处于严格模式 */
- public readonly inStrictMode: boolean;
+ readonly inStrictMode: boolean;
/** 一些额外的上下文数据 */
- public readonly extraContextData: IContextData;
-
- constructor({
- template,
- plugins,
- postProcessors,
- schemaParser = new SchemaParser(),
- projectPreProcessors = [],
- projectPostProcessors = [],
- inStrictMode = false,
- extraContextData = {},
- }: ProjectBuilderInitOptions) {
+ readonly extraContextData: IContextData;
+
+ constructor(builderOptions: ProjectBuilderInitOptions) {
+ let customBuilderOptions = builderOptions;
+ if (typeof builderOptions.customizeBuilderOptions === 'function') {
+ customBuilderOptions = builderOptions.customizeBuilderOptions(builderOptions);
+ }
+ const {
+ template,
+ plugins,
+ postProcessors,
+ schemaParser = new SchemaParser(),
+ projectPreProcessors = [],
+ projectPostProcessors = [],
+ inStrictMode = false,
+ extraContextData = {},
+ } = customBuilderOptions;
this.template = template;
this.plugins = plugins;
this.postProcessors = postProcessors;
@@ -87,34 +107,39 @@ export class ProjectBuilder implements IProjectBuilder {
this.extraContextData = extraContextData;
}
- async generateProject(originalSchema: ProjectSchema | string): Promise {
+ async generateProject(originalSchema: IPublicTypeProjectSchema | string): Promise {
// Init
const { schemaParser } = this;
- const builders = this.createModuleBuilders();
-
- const projectRoot = await this.template.generateTemplate();
- let schema: ProjectSchema =
+ let schema: IPublicTypeProjectSchema =
typeof originalSchema === 'string' ? JSON.parse(originalSchema) : originalSchema;
- // Validate
- if (!schemaParser.validate(schema)) {
- throw new CodeGeneratorError('Schema is invalid');
- }
-
// Parse / Format
-
// Preprocess
for (const preProcessor of this.projectPreProcessors) {
// eslint-disable-next-line no-await-in-loop
schema = await preProcessor(schema);
}
+ // Validate
+ if (!schemaParser.validate(schema)) {
+ throw new CodeGeneratorError('Schema is invalid');
+ }
+
// Collect Deps
// Parse JSExpression
const parseResult: IParseResult = schemaParser.parse(schema);
+
+ const projectRoot = await this.template.generateTemplate(parseResult);
+
let buildResult: IModuleInfo[] = [];
+ const builders = this.createModuleBuilders({
+ extraContextData: {
+ projectRemark: parseResult?.project?.projectRemark,
+ template: this.template,
+ },
+ });
// Generator Code module
// components
// pages
@@ -241,14 +266,25 @@ export class ProjectBuilder implements IProjectBuilder {
});
}
- // TODO: 更多 slots 的处理？？是不是可以考虑把 template 中所有的 slots 都处理下？
+ // demo
+ if (parseResult.project && builders.demo) {
+ const { files } = await builders.demo.generateModule(parseResult.project);
+ buildResult.push({
+ path: this.template.slots.demo.path,
+ files,
+ });
+ }
- // Post Process
+ // handle extra slots
+ await this.generateExtraSlots(builders, parseResult, buildResult);
+ // Post Process
+ const isSingleComponent = parseResult?.project?.projectRemark?.isSingleComponent;
// Combine Modules
buildResult.forEach((moduleInfo) => {
let targetDir = getDirFromRoot(projectRoot, moduleInfo.path);
- if (moduleInfo.moduleName) {
+ // if project only contain single component, skip creation of directory.
+ if (moduleInfo.moduleName && !isSingleComponent) {
const dir = createResultDir(moduleInfo.moduleName);
addDirectory(targetDir, dir);
targetDir = dir;
@@ -260,13 +296,17 @@ export class ProjectBuilder implements IProjectBuilder {
let finalResult = projectRoot;
for (const projectPostProcessor of this.projectPostProcessors) {
// eslint-disable-next-line no-await-in-loop
- finalResult = await projectPostProcessor(finalResult, schema, originalSchema);
+ finalResult = await projectPostProcessor(finalResult, schema, originalSchema, {
+ template: this.template,
+ parseResult,
+ });
}
return finalResult;
}
- private createModuleBuilders(): Record {
+ private createModuleBuilders(extraContextData: Record = {}):
+ Record {
const builders: Record = {};
Object.keys(this.plugins).forEach((pluginName) => {
@@ -279,10 +319,12 @@ export class ProjectBuilder implements IProjectBuilder {
plugins: this.plugins[pluginName],
postProcessors: this.postProcessors,
contextData: {
+ // template: this.template,
inStrictMode: this.inStrictMode,
tolerateEvalErrors: true,
evalErrorsHandler: '',
...this.extraContextData,
+ ...extraContextData,
},
...options,
});
@@ -291,6 +333,22 @@ export class ProjectBuilder implements IProjectBuilder {
return builders;
}
+
+ private async generateExtraSlots(
+ builders: Record,
+ parseResult: IParseResult,
+ buildResult: IModuleInfo[],
+ ) {
+ for (const slotName in this.template.slots) {
+ if (!isBuiltinSlotName(slotName)) {
+ const { files } = await builders[slotName].generateModule(parseResult);
+ buildResult.push({
+ path: this.template.slots[slotName].path,
+ files,
+ });
+ }
+ }
+ }
}
export function createProjectBuilder(initOptions: ProjectBuilderInitOptions): IProjectBuilder {
diff --git a/modules/code-generator/src/index.ts b/modules/code-generator/src/index.ts
index 7cf861e6f8..da9b12d877 100644
--- a/modules/code-generator/src/index.ts
+++ b/modules/code-generator/src/index.ts
@@ -1,6 +1,6 @@
/**
* 低代码引擎的出码模块，负责将编排产出的 Schema 转换成实际可执行的代码。
- * 注意：为了保持 API 的稳定性, 这里所有导出的 API 均要显式命名方式导出
+ * 注意：为了保持 API 的稳定性，这里所有导出的 API 均要显式命名方式导出
* （即用 export { xxx } from 'xx' 的方式，不要直接 export * from 'xxx')
* 而且所有导出的 API 务必在 tests/public 中编写单元测试
*/
@@ -8,7 +8,8 @@ import { createProjectBuilder } from './generator/ProjectBuilder';
import { createModuleBuilder } from './generator/ModuleBuilder';
import { createDiskPublisher } from './publisher/disk';
import { createZipPublisher } from './publisher/zip';
-import createIceJsProjectBuilder, { plugins as reactPlugins } from './solutions/icejs';
+import createIceJsProjectBuilder, { plugins as icejsPlugins } from './solutions/icejs';
+import createIceJs3ProjectBuilder, { plugins as icejs3Plugins } from './solutions/icejs3';
import createRaxAppProjectBuilder, { plugins as raxPlugins } from './solutions/rax-app';
// 引入说明
@@ -18,6 +19,7 @@ import { COMMON_CHUNK_NAME, CLASS_DEFINE_CHUNK_NAME, DEFAULT_LINK_AFTER } from '
// 引入通用插件组
import esmodule from './plugins/common/esmodule';
import requireUtils from './plugins/common/requireUtils';
+import styleImport from './plugins/common/styleImport';
import css from './plugins/component/style/css';
import constants from './plugins/project/constants';
@@ -32,6 +34,7 @@ import * as CONSTANTS from './const';
// 引入内置解决方案模块
import icejs from './plugins/project/framework/icejs';
+import icejs3 from './plugins/project/framework/icejs3';
import rax from './plugins/project/framework/rax';
export default {
@@ -39,10 +42,12 @@ export default {
createModuleBuilder,
solutions: {
icejs: createIceJsProjectBuilder,
+ icejs3: createIceJs3ProjectBuilder,
rax: createRaxAppProjectBuilder,
},
solutionParts: {
icejs,
+ icejs3,
rax,
},
publishers: {
@@ -51,6 +56,7 @@ export default {
},
plugins: {
common: {
+
/**
* 处理 ES Module
* @deprecated please use esModule
@@ -58,12 +64,7 @@ export default {
esmodule,
esModule: esmodule,
requireUtils,
- },
- react: {
- ...reactPlugins,
- },
- rax: {
- ...raxPlugins,
+ styleImport,
},
style: {
css,
@@ -73,6 +74,22 @@ export default {
i18n,
utils,
},
+ icejs: {
+ ...icejsPlugins,
+ },
+ icejs3: {
+ ...icejs3Plugins,
+ },
+ rax: {
+ ...raxPlugins,
+ },
+
+ /**
+ * @deprecated please use icejs
+ */
+ react: {
+ ...icejsPlugins,
+ },
},
postprocessor: {
prettier,
diff --git a/modules/code-generator/src/parser/SchemaParser.ts b/modules/code-generator/src/parser/SchemaParser.ts
index 2e526d88bc..b4f7424ce5 100644
--- a/modules/code-generator/src/parser/SchemaParser.ts
+++ b/modules/code-generator/src/parser/SchemaParser.ts
@@ -4,14 +4,14 @@
*/
import changeCase from 'change-case';
import {
- UtilItem,
- NodeDataType,
- NodeSchema,
- ContainerSchema,
- ProjectSchema,
- PropsMap,
- NodeData,
- NpmInfo,
+ IPublicTypeUtilItem,
+ IPublicTypeNodeDataType,
+ IPublicTypeNodeSchema,
+ IPublicTypeContainerSchema,
+ IPublicTypeProjectSchema,
+ IPublicTypePropsMap,
+ IPublicTypeNodeData,
+ IPublicTypeNpmInfo,
} from '@alilc/lowcode-types';
import {
IPageMeta,
@@ -32,10 +32,11 @@ import {
import { SUPPORT_SCHEMA_VERSION_LIST } from '../const';
import { getErrorMessage } from '../utils/errors';
-import { handleSubNodes } from '../utils/schema';
+import { handleSubNodes, isValidContainerType, ContainerType } from '../utils/schema';
import { uniqueArray } from '../utils/common';
import { componentAnalyzer } from '../analyzer/componentAnalyzer';
import { ensureValidClassName } from '../utils/validate';
+import type { ProjectRemark } from '../types/intermediate';
const defaultContainer: IContainerInfo = {
containerType: 'Component',
@@ -71,18 +72,18 @@ function getRootComponentName(typeName: string, maps: Record, depName: string) {
+ const dep = internalDeps[depName];
+ return (dep && dep.type !== InternalDependencyType.PAGE) ? dep : null;
+}
+
export class SchemaParser implements ISchemaParser {
- validate(schema: ProjectSchema): boolean {
+ validate(schema: IPublicTypeProjectSchema): boolean {
if (SUPPORT_SCHEMA_VERSION_LIST.indexOf(schema.version) < 0) {
throw new CompatibilityError(`Not support schema with version [${schema.version}]`);
}
@@ -114,7 +120,7 @@ export class SchemaParser implements ISchemaParser {
return true;
}
- parse(schemaSrc: ProjectSchema | string): IParseResult {
+ parse(schemaSrc: IPublicTypeProjectSchema | string): IParseResult {
// TODO: collect utils depends in JSExpression
const compDeps: Record = {};
const internalDeps: Record = {};
@@ -139,9 +145,9 @@ export class SchemaParser implements ISchemaParser {
let containers: IContainerInfo[];
// Test if this is a lowcode component without container
if (schema.componentsTree.length > 0) {
- const firstRoot: ContainerSchema = schema.componentsTree[0] as ContainerSchema;
+ const firstRoot: IPublicTypeContainerSchema = schema.componentsTree[0] as IPublicTypeContainerSchema;
- if (!('fileName' in firstRoot) || !firstRoot.fileName) {
+ if (!firstRoot.fileName && !isValidContainerType(firstRoot)) {
// 整个 schema 描述一个容器，且无根节点定义
const container: IContainerInfo = {
...firstRoot,
@@ -149,18 +155,19 @@ export class SchemaParser implements ISchemaParser {
props: firstRoot.props || defaultContainer.props,
css: firstRoot.css || defaultContainer.css,
moduleName: (firstRoot as IContainerInfo).moduleName || defaultContainer.moduleName,
- children: schema.componentsTree as NodeSchema[],
+ children: schema.componentsTree as IPublicTypeNodeSchema[],
};
containers = [container];
} else {
// 普通带 1 到多个容器的 schema
containers = schema.componentsTree.map((n) => {
- const subRoot = n as ContainerSchema;
+ const subRoot = n as IPublicTypeContainerSchema;
const container: IContainerInfo = {
...subRoot,
componentName: getRootComponentName(subRoot.componentName, compDeps),
containerType: subRoot.componentName,
- moduleName: ensureValidClassName(changeCase.pascalCase(subRoot.fileName)),
+ moduleName: ensureValidClassName(subRoot.componentName === ContainerType.Component ?
+ subRoot.fileName : changeCase.pascalCase(subRoot.fileName)),
};
return container;
});
@@ -172,7 +179,7 @@ export class SchemaParser implements ISchemaParser {
// 分析引用能力的依赖
containers = containers.map((con) => ({
...con,
- analyzeResult: componentAnalyzer(con as ContainerSchema),
+ analyzeResult: componentAnalyzer(con as IPublicTypeContainerSchema),
}));
// 建立所有容器的内部依赖索引
@@ -210,7 +217,7 @@ export class SchemaParser implements ISchemaParser {
handleSubNodes(
container.children,
{
- node: (i: NodeSchema) => processChildren(i),
+ node: (i: IPublicTypeNodeSchema) => processChildren(i),
},
{
rerun: true,
@@ -219,12 +226,11 @@ export class SchemaParser implements ISchemaParser {
}
});
- // 分析容器内部组件依赖
containers.forEach((container) => {
const depNames = this.getComponentNames(container);
// eslint-disable-next-line no-param-reassign
container.deps = uniqueArray(depNames, (i: string) => i)
- .map((depName) => internalDeps[depName] || compDeps[depName])
+ .map((depName) => getInternalDep(internalDeps, depName) || compDeps[depName])
.filter(Boolean);
// container.deps = Object.keys(compDeps).map((depName) => compDeps[depName]);
});
@@ -254,13 +260,12 @@ export class SchemaParser implements ISchemaParser {
.filter((dep) => !!dep);
// 分析 Utils 依赖
- let utils: UtilItem[];
+ let utils: IPublicTypeUtilItem[];
if (schema.utils) {
utils = schema.utils;
utilsDeps = schema.utils
.filter(
- (u): u is { name: string; type: 'npm' | 'tnpm'; content: NpmInfo } =>
- u.type !== 'function',
+ (u): u is { name: string; type: 'npm' | 'tnpm'; content: IPublicTypeNpmInfo } => u.type !== 'function',
)
.map(
(u): IExternalDependency => ({
@@ -320,15 +325,22 @@ export class SchemaParser implements ISchemaParser {
utilsDeps,
packages: npms || [],
dataSourcesTypes: this.collectDataSourcesTypes(schema),
+ projectRemark: this.getProjectRemark(containers),
},
};
}
- getComponentNames(children: NodeDataType): string[] {
+ getProjectRemark(containers: IContainerInfo[]): ProjectRemark {
+ return {
+ isSingleComponent: containers.length === 1 && containers[0].containerType === 'Component',
+ };
+ }
+
+ getComponentNames(children: IPublicTypeNodeDataType): string[] {
return handleSubNodes(
children,
{
- node: (i: NodeSchema) => i.componentName,
+ node: (i: IPublicTypeNodeSchema) => i.componentName,
},
{
rerun: true,
@@ -336,8 +348,8 @@ export class SchemaParser implements ISchemaParser {
);
}
- decodeSchema(schemaSrc: string | ProjectSchema): ProjectSchema {
- let schema: ProjectSchema;
+ decodeSchema(schemaSrc: string | IPublicTypeProjectSchema): IPublicTypeProjectSchema {
+ let schema: IPublicTypeProjectSchema;
if (typeof schemaSrc === 'string') {
try {
schema = JSON.parse(schemaSrc);
@@ -352,7 +364,7 @@ export class SchemaParser implements ISchemaParser {
return schema;
}
- private collectDataSourcesTypes(schema: ProjectSchema): string[] {
+ private collectDataSourcesTypes(schema: IPublicTypeProjectSchema): string[] {
const dataSourcesTypes = new Set();
// 数据源的默认类型为 fetch
diff --git a/modules/code-generator/src/plugins/common/esmodule.ts b/modules/code-generator/src/plugins/common/esmodule.ts
index ee28083d15..53f3f9418b 100644
--- a/modules/code-generator/src/plugins/common/esmodule.ts
+++ b/modules/code-generator/src/plugins/common/esmodule.ts
@@ -443,6 +443,7 @@ function buildPackageImport(
export interface PluginConfig {
fileType?: string; // 导出的文件类型
useAliasName?: boolean; // 是否使用 componentName 重命名组件 identifier
+ filter?: (deps: IDependency[]) => IDependency[]; // 支持过滤能力
}
const pluginFactory: BuilderComponentPluginFactory = (config?: PluginConfig) => {
@@ -460,7 +461,8 @@ const pluginFactory: BuilderComponentPluginFactory = (config?: Plu
const ir = next.ir as IWithDependency;
if (ir && ir.deps && ir.deps.length > 0) {
- const packs = groupDepsByPack(ir.deps);
+ const deps = cfg.filter ? cfg.filter(ir.deps) : ir.deps;
+ const packs = groupDepsByPack(deps);
Object.keys(packs).forEach((pkg) => {
const chunks = buildPackageImport(pkg, packs[pkg], cfg.fileType, cfg.useAliasName);
diff --git a/modules/code-generator/src/plugins/common/styleImport.ts b/modules/code-generator/src/plugins/common/styleImport.ts
new file mode 100644
index 0000000000..23e1293025
--- /dev/null
+++ b/modules/code-generator/src/plugins/common/styleImport.ts
@@ -0,0 +1,64 @@
+import changeCase from 'change-case';
+import {
+ FileType,
+ BuilderComponentPluginFactory,
+ BuilderComponentPlugin,
+ ICodeStruct,
+ IWithDependency,
+ ChunkType,
+} from '../../types';
+
+import { COMMON_CHUNK_NAME } from '../../const/generator';
+
+const pluginFactory: BuilderComponentPluginFactory = () => {
+ const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
+ const next: ICodeStruct = {
+ ...pre,
+ };
+
+ const ir = next.ir as IWithDependency;
+ const { chunks } = next;
+
+ if (ir && ir.deps && ir.deps.length > 0) {
+ let lowcodeMaterialsStyleAdded = false;
+ let fusionUIStyleAdded = false;
+ let nextStyleAddedMap: Record = {};
+ ir.deps.forEach((dep: any) => {
+ if (dep.package === '@alifd/next' && !nextStyleAddedMap[dep.exportName]) {
+ chunks.push({
+ type: ChunkType.STRING,
+ fileType: FileType.JSX,
+ name: COMMON_CHUNK_NAME.InternalDepsImport,
+ content: `import '@alifd/next/lib/${changeCase.paramCase(dep.exportName)}/style';`,
+ linkAfter: [COMMON_CHUNK_NAME.ExternalDepsImport],
+ });
+ nextStyleAddedMap[dep.exportName] = true;
+ } else if (dep.package === '@alilc/lowcode-materials' && !lowcodeMaterialsStyleAdded) {
+ chunks.push({
+ type: ChunkType.STRING,
+ fileType: FileType.JSX,
+ name: COMMON_CHUNK_NAME.InternalDepsImport,
+ content: 'import \'@alilc/lowcode-materials/lib/style\';',
+ linkAfter: [COMMON_CHUNK_NAME.ExternalDepsImport],
+ });
+ lowcodeMaterialsStyleAdded = true;
+ } else if (dep.package === '@alifd/fusion-ui' && !fusionUIStyleAdded) {
+ chunks.push({
+ type: ChunkType.STRING,
+ fileType: FileType.JSX,
+ name: COMMON_CHUNK_NAME.InternalDepsImport,
+ content: 'import \'@alifd/fusion-ui/lib/style\';',
+ linkAfter: [COMMON_CHUNK_NAME.ExternalDepsImport],
+ });
+ fusionUIStyleAdded = true;
+ }
+ });
+ }
+
+ return next;
+ };
+
+ return plugin;
+};
+
+export default pluginFactory;
diff --git a/modules/code-generator/src/plugins/component/rax/containerInjectDataSourceEngine.ts b/modules/code-generator/src/plugins/component/rax/containerInjectDataSourceEngine.ts
index 446b1d3f89..cb7a9e8c36 100644
--- a/modules/code-generator/src/plugins/component/rax/containerInjectDataSourceEngine.ts
+++ b/modules/code-generator/src/plugins/component/rax/containerInjectDataSourceEngine.ts
@@ -1,8 +1,8 @@
/* eslint-disable @typescript-eslint/indent */
import {
- CompositeValue,
- JSExpression,
+ IPublicTypeCompositeValue,
+ IPublicTypeJSExpression,
InterpretDataSourceConfig,
isJSExpression,
isJSFunction,
@@ -56,7 +56,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
(dataSourceConfig && dataSourceConfig.list) || [];
const dataSourceEngineOptions = { runtimeConfig: true };
if (dataSourceItems.length > 0) {
- const requestHandlersMap: Record = {};
+ const requestHandlersMap: Record = {};
dataSourceItems.forEach((ds) => {
const dsType = ds.type || 'fetch';
@@ -178,7 +178,7 @@ _defineDataSourceConfig() {
export default pluginFactory;
-function wrapAsFunction(value: CompositeValue, scope: IScope): CompositeValue {
+function wrapAsFunction(value: IPublicTypeCompositeValue, scope: IScope): IPublicTypeCompositeValue {
if (isJSExpression(value) || isJSFunction(value)) {
return {
type: 'JSExpression',
diff --git a/modules/code-generator/src/plugins/component/rax/containerLifeCycle.ts b/modules/code-generator/src/plugins/component/rax/containerLifeCycle.ts
index f928c3995e..bbee6367f2 100644
--- a/modules/code-generator/src/plugins/component/rax/containerLifeCycle.ts
+++ b/modules/code-generator/src/plugins/component/rax/containerLifeCycle.ts
@@ -13,6 +13,7 @@ import {
IContainerInfo,
} from '../../../types';
import { debug } from '../../../utils/debug';
+import { isJSExpressionFn } from '../../../utils/common';
export interface PluginConfig {
fileType: string;
@@ -49,6 +50,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
// 过滤掉非法数据（有些场景下会误传入空字符串或 null)
if (
!isJSFunction(lifeCycles[lifeCycleName]) &&
+ !isJSExpressionFn(lifeCycles[lifeCycleName]) &&
!isJSExpression(lifeCycles[lifeCycleName])
) {
return;
diff --git a/modules/code-generator/src/plugins/component/rax/jsx.ts b/modules/code-generator/src/plugins/component/rax/jsx.ts
index ebc72104f0..ddae619cd6 100644
--- a/modules/code-generator/src/plugins/component/rax/jsx.ts
+++ b/modules/code-generator/src/plugins/component/rax/jsx.ts
@@ -1,8 +1,8 @@
import {
- NodeSchema,
- JSExpression,
- NpmInfo,
- CompositeValue,
+ IPublicTypeNodeSchema,
+ IPublicTypeJSExpression,
+ IPublicTypeNpmInfo,
+ IPublicTypeCompositeValue,
isJSExpression,
} from '@alilc/lowcode-types';
@@ -75,8 +75,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
// 注意：这里其实隐含了一个假设：schema 中的 componentName 应该是一个有效的 JS 标识符，而且是大写字母打头的
// FIXME: 为了快速修复临时加的逻辑，需要用 pre-process 的方式替代处理。
- const mapComponentNameToAliasOrKeepIt = (componentName: string) =>
- componentsNameAliasMap.get(componentName) || componentName;
+ const mapComponentNameToAliasOrKeepIt = (componentName: string) => componentsNameAliasMap.get(componentName) || componentName;
// 然后过滤掉所有的别名 chunks
next.chunks = next.chunks.filter((chunk) => !isImportAliasDefineChunk(chunk));
@@ -86,7 +85,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
// 2. 小程序出码的时候，很容易出现 Uncaught TypeError: Cannot read property 'avatar' of undefined 这样的异常(如下图的 50 行) -- 因为若直接出码，Rax 构建到小程序的时候会立即计算所有在视图中用到的变量
// 3. 通过 this.xxx 能拿到的东西太多了，而且自定义的 methods 可能会无意间破坏 Rax 框架或小程序框架在页面 this 上的东东
const customHandlers: HandlerSet = {
- expression(input: JSExpression, scope: IScope) {
+ expression(input: IPublicTypeJSExpression, scope: IScope) {
return transformJsExpr(generateExpression(input, scope), scope, {
dontWrapEval: !tolerateEvalErrors,
});
@@ -147,7 +146,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
function __$$eval(expr) {
try {
return expr();
- } catch (error) {
+ } catch (error) {
${evalErrorsHandler}
}
}
@@ -171,7 +170,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
return next;
function generateRaxLoopCtrl(
- nodeItem: NodeSchema,
+ nodeItem: IPublicTypeNodeSchema,
scope: IScope,
config?: NodeGeneratorConfig,
next?: NodePlugin,
@@ -218,7 +217,7 @@ function isImportAliasDefineChunk(chunk: ICodeChunk): chunk is ICodeChunk & {
ext: {
aliasName: string;
originalName: string;
- dependency: NpmInfo;
+ dependency: IPublicTypeNpmInfo;
};
} {
return (
@@ -226,13 +225,13 @@ function isImportAliasDefineChunk(chunk: ICodeChunk): chunk is ICodeChunk & {
!!chunk.ext &&
typeof chunk.ext.aliasName === 'string' &&
typeof chunk.ext.originalName === 'string' &&
- !!(chunk.ext.dependency as NpmInfo | null)?.componentName
+ !!(chunk.ext.dependency as IPublicTypeNpmInfo | null)?.componentName
);
}
function generateNodeAttrForRax(
this: { cfg: PluginConfig },
- attrData: { attrName: string; attrValue: CompositeValue },
+ attrData: { attrName: string; attrValue: IPublicTypeCompositeValue },
scope: IScope,
config?: NodeGeneratorConfig,
next?: AttrPlugin,
@@ -257,7 +256,7 @@ function generateNodeAttrForRax(
function generateEventHandlerAttrForRax(
attrName: string,
- attrValue: CompositeValue,
+ attrValue: IPublicTypeCompositeValue,
scope: IScope,
config?: NodeGeneratorConfig,
): CodePiece[] {
diff --git a/modules/code-generator/src/plugins/component/react/containerClass.ts b/modules/code-generator/src/plugins/component/react/containerClass.ts
index 0758c893e2..eab6cbebee 100644
--- a/modules/code-generator/src/plugins/component/react/containerClass.ts
+++ b/modules/code-generator/src/plugins/component/react/containerClass.ts
@@ -26,7 +26,7 @@ const pluginFactory: BuilderComponentPluginFactory = () => {
// 将模块名转换成 PascalCase 的格式，并添加特定后缀，防止命名冲突
const componentClassName = ensureValidClassName(
- `${changeCase.pascalCase(ir.moduleName)}$$Page`,
+ `${changeCase.pascalCase(ir.moduleName)}$$${ir.containerType}`,
);
next.chunks.push({
@@ -43,6 +43,18 @@ const pluginFactory: BuilderComponentPluginFactory = () => {
],
});
+ if (ir.containerType === 'Component') {
+ next.chunks.push({
+ type: ChunkType.STRING,
+ fileType: FileType.JSX,
+ name: CLASS_DEFINE_CHUNK_NAME.InsVar,
+ content: `static displayName = '${ir.moduleName}';`,
+ linkAfter: [
+ CLASS_DEFINE_CHUNK_NAME.Start,
+ ],
+ });
+ }
+
next.chunks.push({
type: ChunkType.STRING,
fileType: FileType.JSX,
diff --git a/modules/code-generator/src/plugins/component/react/containerInitState.ts b/modules/code-generator/src/plugins/component/react/containerInitState.ts
index 5f246e1156..d1dd0d1ddf 100644
--- a/modules/code-generator/src/plugins/component/react/containerInitState.ts
+++ b/modules/code-generator/src/plugins/component/react/containerInitState.ts
@@ -13,12 +13,12 @@ import {
} from '../../../types';
export interface PluginConfig {
- fileType: string;
+ fileType?: string;
implementType: 'inConstructor' | 'insMember' | 'hooks';
}
const pluginFactory: BuilderComponentPluginFactory = (config?) => {
- const cfg: PluginConfig = {
+ const cfg: PluginConfig & { fileType: string } = {
fileType: FileType.JSX,
implementType: 'inConstructor',
...config,
diff --git a/modules/code-generator/src/plugins/component/react/containerInjectConstants.ts b/modules/code-generator/src/plugins/component/react/containerInjectConstants.ts
new file mode 100644
index 0000000000..92cd4a3920
--- /dev/null
+++ b/modules/code-generator/src/plugins/component/react/containerInjectConstants.ts
@@ -0,0 +1,55 @@
+import {
+ CLASS_DEFINE_CHUNK_NAME,
+ COMMON_CHUNK_NAME,
+ DEFAULT_LINK_AFTER,
+} from '../../../const/generator';
+
+import {
+ BuilderComponentPlugin,
+ BuilderComponentPluginFactory,
+ ChunkType,
+ FileType,
+ ICodeStruct,
+} from '../../../types';
+
+export interface PluginConfig {
+ fileType: string;
+}
+
+const pluginFactory: BuilderComponentPluginFactory = (config?) => {
+ const cfg: PluginConfig = {
+ fileType: FileType.JSX,
+ ...config,
+ };
+
+ const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
+ const next: ICodeStruct = {
+ ...pre,
+ };
+
+ next.chunks.push({
+ type: ChunkType.STRING,
+ fileType: cfg.fileType,
+ name: COMMON_CHUNK_NAME.InternalDepsImport,
+ content: "import __$$constants from '../../constants';",
+ linkAfter: [COMMON_CHUNK_NAME.ExternalDepsImport],
+ });
+
+ next.chunks.push({
+ type: ChunkType.STRING,
+ fileType: cfg.fileType,
+ name: CLASS_DEFINE_CHUNK_NAME.InsVar,
+ content: `
+ get constants() {
+ return __$$constants || {};
+ }
+ `,
+ linkAfter: [...DEFAULT_LINK_AFTER[CLASS_DEFINE_CHUNK_NAME.InsVar]],
+ });
+
+ return next;
+ };
+ return plugin;
+};
+
+export default pluginFactory;
diff --git a/modules/code-generator/src/plugins/component/react/containerInjectDataSourceEngine.ts b/modules/code-generator/src/plugins/component/react/containerInjectDataSourceEngine.ts
index 20302dea99..c4385017b8 100644
--- a/modules/code-generator/src/plugins/component/react/containerInjectDataSourceEngine.ts
+++ b/modules/code-generator/src/plugins/component/react/containerInjectDataSourceEngine.ts
@@ -1,8 +1,8 @@
/* eslint-disable @typescript-eslint/indent */
import {
- CompositeValue,
- JSExpression,
+ IPublicTypeCompositeValue,
+ IPublicTypeJSExpression,
InterpretDataSourceConfig,
isJSExpression,
isJSFunction,
@@ -27,8 +27,9 @@ import {
import { generateCompositeType } from '../../../utils/compositeType';
import { parseExpressionConvertThis2Context } from '../../../utils/expressionParser';
-import { isContainerSchema } from '../../../utils/schema';
+import { isValidContainerType } from '../../../utils/schema';
import { REACT_CHUNK_NAME } from './const';
+import { isJSExpressionFn } from '../../../utils/common';
export interface PluginConfig {
fileType?: string;
@@ -37,6 +38,7 @@ export interface PluginConfig {
* 数据源配置
*/
datasourceConfig?: {
+
/** 数据源引擎的版本 */
engineVersion?: string;
@@ -67,12 +69,12 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
};
const scope = Scope.createRootScope();
- const dataSourceConfig = isContainerSchema(pre.ir) ? pre.ir.dataSource : null;
+ const dataSourceConfig = isValidContainerType(pre.ir) ? pre.ir.dataSource : null;
const dataSourceItems: InterpretDataSourceConfig[] =
(dataSourceConfig && dataSourceConfig.list) || [];
const dataSourceEngineOptions = { runtimeConfig: true };
if (dataSourceItems.length > 0) {
- const requestHandlersMap: Record = {};
+ const requestHandlersMap: Record = {};
dataSourceItems.forEach((ds) => {
const dsType = ds.type || 'fetch';
@@ -187,16 +189,16 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
export default pluginFactory;
-function wrapAsFunction(value: CompositeValue, scope: IScope): CompositeValue {
- if (isJSExpression(value) || isJSFunction(value)) {
+function wrapAsFunction(value: IPublicTypeCompositeValue, scope: IScope): IPublicTypeCompositeValue {
+ if (isJSExpression(value) || isJSFunction(value) || isJSExpressionFn(value)) {
return {
type: 'JSExpression',
- value: `function(){ return ((${value.value}))}`,
+ value: `function(){ return ((${value.value}))}.bind(this)`,
};
}
return {
type: 'JSExpression',
- value: `function(){return((${generateCompositeType(value, scope)}))}`,
+ value: `function(){return((${generateCompositeType(value, scope)}))}.bind(this)`,
};
}
diff --git a/modules/code-generator/src/plugins/component/react/containerInjectI18n.ts b/modules/code-generator/src/plugins/component/react/containerInjectI18n.ts
index da04029c00..aff42af15f 100644
--- a/modules/code-generator/src/plugins/component/react/containerInjectI18n.ts
+++ b/modules/code-generator/src/plugins/component/react/containerInjectI18n.ts
@@ -11,6 +11,7 @@ import {
FileType,
ICodeStruct,
} from '../../../types';
+import { getSlotRelativePath } from '../../../utils/pathHelper';
export interface PluginConfig {
fileType: string;
@@ -31,9 +32,8 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
type: ChunkType.STRING,
fileType: cfg.fileType,
name: COMMON_CHUNK_NAME.InternalDepsImport,
- // TODO: 下面这个路径有没有更好的方式来获取？而非写死
content: `
- import * as __$$i18n from '../../i18n';
+ import * as __$$i18n from '${getSlotRelativePath({ contextData: next.contextData, from: 'components', to: 'i18n' })}';
`,
linkAfter: [COMMON_CHUNK_NAME.ExternalDepsImport],
});
diff --git a/modules/code-generator/src/plugins/component/react/containerInjectUtils.ts b/modules/code-generator/src/plugins/component/react/containerInjectUtils.ts
index 6c614f143a..d9eb14f769 100644
--- a/modules/code-generator/src/plugins/component/react/containerInjectUtils.ts
+++ b/modules/code-generator/src/plugins/component/react/containerInjectUtils.ts
@@ -12,13 +12,17 @@ import {
ICodeStruct,
IContainerInfo,
} from '../../../types';
+import { getSlotRelativePath } from '../../../utils/pathHelper';
export interface PluginConfig {
- fileType: string;
+ fileType?: string;
+
+ /** prefer using class property to define utils */
+ preferClassProperty?: boolean;
}
const pluginFactory: BuilderComponentPluginFactory = (config?) => {
- const cfg: PluginConfig = {
+ const cfg: PluginConfig & { fileType: string } = {
fileType: FileType.JSX,
...config,
};
@@ -36,20 +40,31 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
type: ChunkType.STRING,
fileType: cfg.fileType,
name: COMMON_CHUNK_NAME.InternalDepsImport,
- // TODO: 下面这个路径有没有更好的方式来获取？而非写死
content: `
- import utils${useRef ? ', { RefsManager }' : ''} from '../../utils';
+ import utils${useRef ? ', { RefsManager }' : ''} from '${getSlotRelativePath({ contextData: next.contextData, from: 'components', to: 'utils' })}';
`,
linkAfter: [COMMON_CHUNK_NAME.ExternalDepsImport],
});
- next.chunks.push({
- type: ChunkType.STRING,
- fileType: cfg.fileType,
- name: CLASS_DEFINE_CHUNK_NAME.ConstructorContent,
- content: 'this.utils = utils;',
- linkAfter: [CLASS_DEFINE_CHUNK_NAME.ConstructorStart],
- });
+ if (cfg.preferClassProperty) {
+ // mode: class property
+ next.chunks.push({
+ type: ChunkType.STRING,
+ fileType: cfg.fileType,
+ name: CLASS_DEFINE_CHUNK_NAME.InsVar,
+ content: 'utils = utils;',
+ linkAfter: [...DEFAULT_LINK_AFTER[CLASS_DEFINE_CHUNK_NAME.InsVar]],
+ });
+ } else {
+ // mode: assign in constructor
+ next.chunks.push({
+ type: ChunkType.STRING,
+ fileType: cfg.fileType,
+ name: CLASS_DEFINE_CHUNK_NAME.ConstructorContent,
+ content: 'this.utils = utils;',
+ linkAfter: [CLASS_DEFINE_CHUNK_NAME.ConstructorStart],
+ });
+ }
if (useRef) {
next.chunks.push({
@@ -89,7 +104,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
type: ChunkType.STRING,
fileType: cfg.fileType,
name: CLASS_DEFINE_CHUNK_NAME.InsMethod,
- content: ` $ = () => null; `,
+ content: ' $ = () => null; ',
linkAfter: [...DEFAULT_LINK_AFTER[CLASS_DEFINE_CHUNK_NAME.InsMethod]],
});
@@ -97,7 +112,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
type: ChunkType.STRING,
fileType: cfg.fileType,
name: CLASS_DEFINE_CHUNK_NAME.InsMethod,
- content: ` $$ = () => []; `,
+ content: ' $$ = () => []; ',
linkAfter: [...DEFAULT_LINK_AFTER[CLASS_DEFINE_CHUNK_NAME.InsMethod]],
});
}
diff --git a/modules/code-generator/src/plugins/component/react/containerLifeCycle.ts b/modules/code-generator/src/plugins/component/react/containerLifeCycle.ts
index 8caa9b105a..5f7d6d22a7 100644
--- a/modules/code-generator/src/plugins/component/react/containerLifeCycle.ts
+++ b/modules/code-generator/src/plugins/component/react/containerLifeCycle.ts
@@ -13,15 +13,17 @@ import {
IContainerInfo,
} from '../../../types';
import { isJSFunction, isJSExpression } from '@alilc/lowcode-types';
+import { isJSExpressionFn } from '../../../utils/common';
export interface PluginConfig {
- fileType: string;
- exportNameMapping: Record;
- normalizeNameMapping: Record;
+ fileType?: string;
+ exportNameMapping?: Record;
+ normalizeNameMapping?: Record;
+ exclude?: string[];
}
const pluginFactory: BuilderComponentPluginFactory = (config?) => {
- const cfg: PluginConfig = {
+ const cfg = {
fileType: FileType.JSX,
exportNameMapping: {},
normalizeNameMapping: {},
@@ -41,6 +43,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
// 过滤掉非法数据（有些场景下会误传入空字符串或 null)
if (
!isJSFunction(lifeCycles[lifeCycleName]) &&
+ !isJSExpressionFn(lifeCycles[lifeCycleName]) &&
!isJSExpression(lifeCycles[lifeCycleName])
) {
return null;
@@ -54,6 +57,10 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
normalizeName = cfg.normalizeNameMapping[lifeCycleName] || lifeCycleName;
}
+ if (cfg?.exclude?.includes(normalizeName)) {
+ return null;
+ }
+
const exportName = cfg.exportNameMapping[lifeCycleName] || lifeCycleName;
if (normalizeName === 'constructor') {
return {
@@ -95,7 +102,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
}),
linkAfter: [...DEFAULT_LINK_AFTER[CLASS_DEFINE_CHUNK_NAME.InsMethod]],
};
- });
+ }).filter((i) => !!i);
next.chunks.push(...chunks.filter((x): x is ICodeChunk => x !== null));
}
diff --git a/modules/code-generator/src/plugins/component/react/jsx.ts b/modules/code-generator/src/plugins/component/react/jsx.ts
index 445dce7a5f..588b356ad6 100644
--- a/modules/code-generator/src/plugins/component/react/jsx.ts
+++ b/modules/code-generator/src/plugins/component/react/jsx.ts
@@ -16,7 +16,7 @@ import { COMMON_CHUNK_NAME } from '../../../const/generator';
import { createReactNodeGenerator } from '../../../utils/nodeToJSX';
import { Scope } from '../../../utils/Scope';
-import { JSExpression } from '@alilc/lowcode-types';
+import { IPublicTypeJSExpression } from '@alilc/lowcode-types';
import { generateExpression } from '../../../utils/jsExpression';
import { transformJsExpr } from '../../../core/jsx/handlers/transformJsExpression';
import { transformThis2Context } from '../../../core/jsx/handlers/transformThis2Context';
@@ -47,7 +47,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
// 这里会将内部的一些子上下文的访问(this.xxx)转换为 __$$context.xxx 的形式
// 与 Rax 所不同的是，这里不会将最顶层的 this 转换掉
const customHandlers: HandlerSet = {
- expression(input: JSExpression, scope: IScope, config) {
+ expression(input: IPublicTypeJSExpression, scope: IScope, config) {
return transformJsExpr(generateExpression(input, scope), scope, {
dontWrapEval: !(config?.tolerateEvalErrors ?? tolerateEvalErrors),
dontTransformThis2ContextAtRootScope: true,
@@ -58,7 +58,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
generateCompositeType(
{
type: 'JSFunction',
- value: input.value || 'null',
+ value: input.value || 'function () {}',
},
Scope.createRootScope(),
),
@@ -120,7 +120,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) =>
function __$$eval(expr) {
try {
return expr();
- } catch (error) {
+ } catch (error) {
${evalErrorsHandler}
}
}
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/index.ts b/modules/code-generator/src/plugins/project/framework/icejs3/index.ts
new file mode 100644
index 0000000000..37fa7a9e39
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/index.ts
@@ -0,0 +1,17 @@
+import template from './template';
+import globalStyle from './plugins/globalStyle';
+import packageJSON from './plugins/packageJSON';
+import layout from './plugins/layout';
+import appConfig from './plugins/appConfig';
+import buildConfig from './plugins/buildConfig';
+
+export default {
+ template,
+ plugins: {
+ appConfig,
+ buildConfig,
+ globalStyle,
+ packageJSON,
+ layout,
+ },
+};
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/plugins/appConfig.ts b/modules/code-generator/src/plugins/project/framework/icejs3/plugins/appConfig.ts
new file mode 100644
index 0000000000..6ec5384a5d
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/plugins/appConfig.ts
@@ -0,0 +1,50 @@
+import {
+ BuilderComponentPlugin,
+ BuilderComponentPluginFactory,
+ ChunkType,
+ FileType,
+ ICodeStruct,
+} from '../../../../../types';
+import { COMMON_CHUNK_NAME } from '../../../../../const/generator';
+
+export interface AppConfigPluginConfig {
+
+}
+
+function getContent() {
+ return `import { defineAppConfig } from 'ice';
+
+// App config, see https://v3.ice.work/docs/guide/basic/app
+export default defineAppConfig(() => ({
+ // Set your configs here.
+ app: {
+ rootId: 'App',
+ },
+ router: {
+ type: 'browser',
+ basename: '/',
+ },
+}));`;
+}
+
+const pluginFactory: BuilderComponentPluginFactory = () => {
+ const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
+ const next: ICodeStruct = {
+ ...pre,
+ };
+
+ next.chunks.push({
+ type: ChunkType.STRING,
+ fileType: FileType.TS,
+ name: COMMON_CHUNK_NAME.FileMainContent,
+ content: getContent(),
+ linkAfter: [],
+ });
+
+ return next;
+ };
+
+ return plugin;
+};
+
+export default pluginFactory;
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/plugins/buildConfig.ts b/modules/code-generator/src/plugins/project/framework/icejs3/plugins/buildConfig.ts
new file mode 100644
index 0000000000..322796154a
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/plugins/buildConfig.ts
@@ -0,0 +1,165 @@
+import {
+ BuilderComponentPlugin,
+ BuilderComponentPluginFactory,
+ ChunkType,
+ FileType,
+ ICodeStruct,
+} from '../../../../../types';
+import { COMMON_CHUNK_NAME } from '../../../../../const/generator';
+import { format } from '../../../../../utils/format';
+import { getThemeInfo } from '../../../../../utils/theme';
+
+export interface BuildConfigPluginConfig {
+
+ /** 包名 */
+ themePackage?: string;
+}
+
+function getContent(cfg?: BuildConfigPluginConfig, routesContent?: string) {
+ return `
+import { join } from 'path';
+import { defineConfig } from '@ice/app';
+import _ from 'lodash';
+import fusion from '@ice/plugin-fusion';
+import locales from '@ice/plugin-moment-locales';
+import type { Plugin } from '@ice/app/esm/types';
+
+interface PluginOptions {
+ id: string;
+}
+
+const plugin: Plugin = (options) => ({
+ // name 可选，插件名称
+ name: 'plugin-name',
+ // setup 必选，用于定制工程构建配置
+ setup: ({ onGetConfig, modifyUserConfig }) => {
+ modifyUserConfig('codeSplitting', 'page');
+
+ onGetConfig((config) => {
+ config.entry = {
+ web: join(process.cwd(), '.ice/entry.client.tsx'),
+ };
+
+ config.cssFilename = '[name].css';
+
+ config.configureWebpack = config.configureWebpack || [];
+ config.configureWebpack?.push((webpackConfig) => {
+ if (webpackConfig.output) {
+ webpackConfig.output.filename = '[name].js';
+ webpackConfig.output.chunkFilename = '[name].js';
+ }
+ return webpackConfig;
+ });
+
+ config.swcOptions = _.merge(config.swcOptions, {
+ compilationConfig: {
+ jsc: {
+ transform: {
+ react: {
+ runtime: 'classic',
+ },
+ },
+ },
+ }
+ });
+
+ // 解决 webpack publicPath 问题
+ config.transforms = config.transforms || [];
+ config.transforms.push((source: string, id: string) => {
+ if (id.includes('.ice/entry.client.tsx')) {
+ let code = \`
+ if (!__webpack_public_path__?.startsWith('http') && document.currentScript) {
+ // @ts-ignore
+ __webpack_public_path__ = document.currentScript.src.replace(/^(.*\\\\/)[^/]+$/, '$1');
+ window.__ICE_ASSETS_MANIFEST__ = window.__ICE_ASSETS_MANIFEST__ || {};
+ window.__ICE_ASSETS_MANIFEST__.publicPath = __webpack_public_path__;
+ }
+ \`;
+ code += source;
+ return { code };
+ }
+ });
+ });
+ },
+});
+
+// The project config, see https://v3.ice.work/docs/guide/basic/config
+const minify = process.env.NODE_ENV === 'production' ? 'swc' : false;
+export default defineConfig(() => ({
+ ssr: false,
+ ssg: false,
+ minify,
+ ${routesContent}
+ externals: {
+ react: 'React',
+ 'react-dom': 'ReactDOM',
+ 'react-dom/client': 'ReactDOM',
+ '@alifd/next': 'Next',
+ lodash: 'var window._',
+ '@alilc/lowcode-engine': 'var window.AliLowCodeEngine',
+ },
+ plugins: [
+ fusion(${cfg?.themePackage ? `{
+ importStyle: 'sass',
+ themePackage: '${getThemeInfo(cfg.themePackage).name}',
+ }` : `{
+ importStyle: 'sass',
+ }`}),
+ locales(),
+ plugin(),
+ ]
+}));
+ `;
+}
+
+function getRoutesContent(navData: any, needShell = true) {
+ const routes = [
+ 'routes: {',
+ ' defineRoutes: route => {',
+ ];
+ function _getRoutes(nav: any, _routes: string[] = []) {
+ const { slug, children } = nav;
+ if (children && children.length > 0) {
+ children.forEach((_nav: any) => _getRoutes(_nav, _routes));
+ } else if (slug) {
+ _routes.push(`route('/${slug}', '${slug}/index.jsx');`);
+ }
+ }
+ if (needShell) {
+ routes.push(" route('/', 'layout.jsx', () => {");
+ }
+ navData?.forEach((nav: any) => {
+ _getRoutes(nav, routes);
+ });
+ if (needShell) {
+ routes.push(' });');
+ }
+ routes.push(' }'); // end of defineRoutes
+ routes.push(' },'); // end of routes
+ return routes.join('\n');
+}
+
+const pluginFactory: BuilderComponentPluginFactory = (cfg?) => {
+ const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
+ const next: ICodeStruct = {
+ ...pre,
+ };
+
+ const { navConfig } = next.contextData;
+ const routesContent = navConfig?.data ? getRoutesContent(navConfig.data, true) : '';
+
+ next.chunks.push({
+ type: ChunkType.STRING,
+ fileType: FileType.MTS,
+ name: COMMON_CHUNK_NAME.FileMainContent,
+ content: format(getContent(cfg, routesContent)),
+ linkAfter: [],
+ });
+
+ return next;
+ };
+
+ return plugin;
+};
+
+export default pluginFactory;
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/plugins/globalStyle.ts b/modules/code-generator/src/plugins/project/framework/icejs3/plugins/globalStyle.ts
new file mode 100644
index 0000000000..3daaeecdc0
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/plugins/globalStyle.ts
@@ -0,0 +1,56 @@
+import { COMMON_CHUNK_NAME } from '../../../../../const/generator';
+
+import {
+ BuilderComponentPlugin,
+ BuilderComponentPluginFactory,
+ ChunkType,
+ FileType,
+ ICodeStruct,
+ IProjectInfo,
+} from '../../../../../types';
+
+const pluginFactory: BuilderComponentPluginFactory = () => {
+ const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
+ const next: ICodeStruct = {
+ ...pre,
+ };
+
+ const ir = next.ir as IProjectInfo;
+
+ next.chunks.push({
+ type: ChunkType.STRING,
+ fileType: FileType.SCSS,
+ name: COMMON_CHUNK_NAME.StyleDepsImport,
+ content: `
+ // 引入默认全局样式
+ @import '@alifd/next/reset.scss';
+ `,
+ linkAfter: [],
+ });
+
+ next.chunks.push({
+ type: ChunkType.STRING,
+ fileType: FileType.SCSS,
+ name: COMMON_CHUNK_NAME.StyleCssContent,
+ content: `
+ body {
+ -webkit-font-smoothing: antialiased;
+ }
+ `,
+ linkAfter: [COMMON_CHUNK_NAME.StyleDepsImport],
+ });
+
+ next.chunks.push({
+ type: ChunkType.STRING,
+ fileType: FileType.SCSS,
+ name: COMMON_CHUNK_NAME.StyleCssContent,
+ content: ir.css || '',
+ linkAfter: [COMMON_CHUNK_NAME.StyleDepsImport],
+ });
+
+ return next;
+ };
+ return plugin;
+};
+
+export default pluginFactory;
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/plugins/layout.ts b/modules/code-generator/src/plugins/project/framework/icejs3/plugins/layout.ts
new file mode 100644
index 0000000000..a67f227019
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/plugins/layout.ts
@@ -0,0 +1,41 @@
+import {
+ BuilderComponentPlugin,
+ BuilderComponentPluginFactory,
+ ChunkType,
+ FileType,
+ ICodeStruct,
+} from '../../../../../types';
+import { COMMON_CHUNK_NAME } from '../../../../../const/generator';
+
+const pluginFactory: BuilderComponentPluginFactory = () => {
+ const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
+ const next: ICodeStruct = {
+ ...pre,
+ };
+
+ next.chunks.push({
+ type: ChunkType.STRING,
+ fileType: FileType.JSX,
+ name: COMMON_CHUNK_NAME.FileMainContent,
+ content: `
+ import { Outlet } from 'ice';
+ import BasicLayout from '@/layouts/BasicLayout';
+
+ export default function Layout() {
+ return (
+
+
+ );;
+ }
+ `,
+ linkAfter: [],
+ });
+
+ return next;
+ };
+
+ return plugin;
+};
+
+export default pluginFactory;
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/plugins/packageJSON.ts b/modules/code-generator/src/plugins/project/framework/icejs3/plugins/packageJSON.ts
new file mode 100644
index 0000000000..3c39ba7399
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/plugins/packageJSON.ts
@@ -0,0 +1,119 @@
+import { PackageJSON } from '@alilc/lowcode-types';
+
+import { COMMON_CHUNK_NAME } from '../../../../../const/generator';
+
+import {
+ BuilderComponentPlugin,
+ BuilderComponentPluginFactory,
+ ChunkType,
+ FileType,
+ ICodeStruct,
+ IProjectInfo,
+} from '../../../../../types';
+import { buildDataSourceDependencies } from '../../../../../utils/dataSource';
+
+interface IIceJs3PackageJSON extends PackageJSON {
+ originTemplate: string;
+}
+
+export type IceJs3PackageJsonPluginConfig = {
+
+ /**
+ * 数据源配置
+ */
+ datasourceConfig?: {
+
+ /** 数据源引擎的版本 */
+ engineVersion?: string;
+
+ /** 数据源引擎的包名 */
+ enginePackage?: string;
+
+ /** 数据源 handlers 的版本 */
+ handlersVersion?: {
+ [key: string]: string;
+ };
+
+ /** 数据源 handlers 的包名 */
+ handlersPackages?: {
+ [key: string]: string;
+ };
+ };
+
+ /** 包名 */
+ packageName?: string;
+
+ /** 版本 */
+ packageVersion?: string;
+};
+
+const pluginFactory: BuilderComponentPluginFactory = (cfg) => {
+ const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
+ const next: ICodeStruct = {
+ ...pre,
+ };
+
+ const ir = next.ir as IProjectInfo;
+
+ const packageJson: IIceJs3PackageJSON = {
+ name: cfg?.packageName || 'icejs3-demo-app',
+ version: cfg?.packageVersion || '0.1.5',
+ description: 'icejs 3 轻量级模板，使用 JavaScript，仅包含基础的 Layout。',
+ dependencies: {
+ moment: '^2.24.0',
+ react: '^18.2.0',
+ 'react-dom': '^18.2.0',
+ 'react-router': '^6.9.0',
+ 'react-router-dom': '^6.9.0',
+ 'intl-messageformat': '^9.3.6',
+ '@alifd/next': '1.26.15',
+ '@ice/runtime': '~1.1.0',
+ // 数据源相关的依赖:
+ ...buildDataSourceDependencies(ir, cfg?.datasourceConfig),
+ },
+ devDependencies: {
+ '@ice/app': '~3.1.0',
+ '@types/react': '^18.0.0',
+ '@types/react-dom': '^18.0.0',
+ '@types/node': '^18.11.17',
+ '@ice/plugin-fusion': '^1.0.1',
+ '@ice/plugin-moment-locales': '^1.0.0',
+ eslint: '^6.0.1',
+ stylelint: '^13.2.0',
+ },
+ scripts: {
+ start: 'ice start',
+ build: 'ice build',
+ lint: 'npm run eslint && npm run stylelint',
+ eslint: 'eslint --cache --ext .js,.jsx ./',
+ stylelint: 'stylelint ./**/*.scss',
+ },
+ engines: {
+ node: '>=14.0.0',
+ },
+ repository: {
+ type: 'git',
+ url: 'http://gitlab.xxx.com/msd/leak-scan/tree/master',
+ },
+ private: true,
+ originTemplate: '@alifd/scaffold-lite-js',
+ };
+
+ ir.packages.forEach((packageInfo) => {
+ packageJson.dependencies[packageInfo.package] = packageInfo.version;
+ });
+
+ next.chunks.push({
+ type: ChunkType.JSON,
+ fileType: FileType.JSON,
+ name: COMMON_CHUNK_NAME.FileMainContent,
+ content: packageJson,
+ linkAfter: [],
+ });
+
+ return next;
+ };
+ return plugin;
+};
+
+export default pluginFactory;
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/template/files/README.md.ts b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/README.md.ts
new file mode 100644
index 0000000000..e73ab2b82c
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/README.md.ts
@@ -0,0 +1,12 @@
+import { ResultFile } from '@alilc/lowcode-types';
+import { createResultFile } from '../../../../../../utils/resultHelper';
+
+export default function getFile(): [string[], ResultFile] {
+ const file = createResultFile(
+ 'README',
+ 'md',
+ 'This project is generated by lowcode-code-generator & lowcode-solution-icejs3.',
+ );
+
+ return [[], file];
+}
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/template/files/browserslistrc.ts b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/browserslistrc.ts
new file mode 100644
index 0000000000..a3a346e3ff
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/browserslistrc.ts
@@ -0,0 +1,14 @@
+import { ResultFile } from '@alilc/lowcode-types';
+import { createResultFile } from '../../../../../../utils/resultHelper';
+
+export default function getFile(): [string[], ResultFile] {
+ const file = createResultFile(
+ '.browserslistrc',
+ '',
+ `defaults
+ios_saf 9
+ `,
+ );
+
+ return [[], file];
+}
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/template/files/document.ts b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/document.ts
new file mode 100644
index 0000000000..3345625557
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/document.ts
@@ -0,0 +1,41 @@
+import { ResultFile } from '@alilc/lowcode-types';
+import { createResultFile } from '../../../../../../utils/resultHelper';
+
+/* eslint-disable max-len */
+export default function getFile(): [string[], ResultFile] {
+ const file = createResultFile(
+ 'document',
+ 'tsx',
+ `import React from 'react';
+import { Meta, Title, Links, Main, Scripts } from 'ice';
+
+export default function Document() {
+ return (
+
+
+
+
+
+
+
+
+
+ {childrenItems}
+
+ );
+ return subNav;
+ }
+
+ return null;
+ }
+
+ const navItem = (
+
+ {item.name}
+
+ );
+ return navItem;
+}
+
+const Navigation = (props, context) => {
+ const location = useLocation();
+ const { pathname } = location;
+ const { isCollapse } = context;
+ return (
+
+ );
+};
+
+Navigation.contextTypes = {
+ isCollapse: PropTypes.bool,
+};
+export default Navigation;
+ `,
+ );
+
+ return [['src', 'layouts', 'BasicLayout', 'components', 'PageNav'], file];
+}
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/template/files/src/layouts/BasicLayout/index.jsx.ts b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/src/layouts/BasicLayout/index.jsx.ts
new file mode 100644
index 0000000000..9c7318dab0
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/src/layouts/BasicLayout/index.jsx.ts
@@ -0,0 +1,92 @@
+import { ResultFile } from '@alilc/lowcode-types';
+import { createResultFile } from '../../../../../../../../../utils/resultHelper';
+
+export default function getFile(): [string[], ResultFile] {
+ const file = createResultFile(
+ 'index',
+ 'jsx',
+ `
+import React, { useState } from 'react';
+import { Shell, ConfigProvider } from '@alifd/next';
+import PageNav from './components/PageNav';
+import Logo from './components/Logo';
+import Footer from './components/Footer';
+
+(function() {
+ const throttle = function(type, name, obj = window) {
+ let running = false;
+
+ const func = () => {
+ if (running) {
+ return;
+ }
+
+ running = true;
+ requestAnimationFrame(() => {
+ obj.dispatchEvent(new CustomEvent(name));
+ running = false;
+ });
+ };
+
+ obj.addEventListener(type, func);
+ };
+
+ throttle('resize', 'optimizedResize');
+})();
+
+export default function BasicLayout({ children }) {
+ const getDevice = width => {
+ const isPhone =
+ typeof navigator !== 'undefined' && navigator && navigator.userAgent.match(/phone/gi);
+
+ if (width < 680 || isPhone) {
+ return 'phone';
+ }
+ if (width < 1280 && width > 680) {
+ return 'tablet';
+ }
+ return 'desktop';
+ };
+
+ const [device, setDevice] = useState(getDevice(NaN));
+ window.addEventListener('optimizedResize', e => {
+ setDevice(getDevice(e && e.target && e.target.innerWidth));
+ });
+ return (
+
+
+
+
+
+
+
+ {children}
+
+
+
+
+
+ );
+}
+ `,
+ );
+
+ return [['src', 'layouts', 'BasicLayout'], file];
+}
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/template/files/src/layouts/BasicLayout/menuConfig.js.ts b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/src/layouts/BasicLayout/menuConfig.js.ts
new file mode 100644
index 0000000000..636539b657
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/src/layouts/BasicLayout/menuConfig.js.ts
@@ -0,0 +1,22 @@
+import { ResultFile } from '@alilc/lowcode-types';
+import { createResultFile } from '../../../../../../../../../utils/resultHelper';
+
+export default function getFile(): [string[], ResultFile] {
+ const file = createResultFile(
+ 'menuConfig',
+ 'js',
+ `
+const headerMenuConfig = [];
+const asideMenuConfig = [
+ {
+ name: 'Dashboard',
+ path: '/',
+ icon: 'smile',
+ },
+];
+export { headerMenuConfig, asideMenuConfig };
+ `,
+ );
+
+ return [['src', 'layouts', 'BasicLayout'], file];
+}
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/template/files/tsconfig.ts b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/tsconfig.ts
new file mode 100644
index 0000000000..f58639db20
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/tsconfig.ts
@@ -0,0 +1,38 @@
+import { ResultFile } from '@alilc/lowcode-types';
+import { createResultFile } from '../../../../../../utils/resultHelper';
+
+export default function getFile(): [string[], ResultFile] {
+ const file = createResultFile(
+ 'tsconfig',
+ 'json',
+ `
+{
+ "compilerOptions": {
+ "baseUrl": "./",
+ "module": "ESNext",
+ "target": "ESNext",
+ "lib": ["DOM", "ESNext", "DOM.Iterable"],
+ "jsx": "react-jsx",
+ "moduleResolution": "node",
+ "allowSyntheticDefaultImports": true,
+ "forceConsistentCasingInFileNames": true,
+ "noImplicitReturns": true,
+ "noImplicitThis": true,
+ "noImplicitAny": false,
+ "importHelpers": true,
+ "strictNullChecks": true,
+ "suppressImplicitAnyIndexErrors": true,
+ "skipLibCheck": true,
+ "paths": {
+ "@/*": ["./src/*"],
+ "ice": [".ice"]
+ }
+ },
+ "include": ["src", ".ice"],
+ "exclude": ["build"]
+}
+ `,
+ );
+
+ return [[], file];
+}
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/template/files/typings.ts b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/typings.ts
new file mode 100644
index 0000000000..c8cbe92545
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/typings.ts
@@ -0,0 +1,20 @@
+import { ResultFile } from '@alilc/lowcode-types';
+import { createResultFile } from '../../../../../../utils/resultHelper';
+
+export default function getFile(): [string[], ResultFile] {
+ const file = createResultFile(
+ 'typings.d',
+ 'ts',
+ `/// ;
+ }
+}
+ `,
+ );
+
+ return [['src'], file];
+}
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/template/index.ts b/modules/code-generator/src/plugins/project/framework/icejs3/template/index.ts
new file mode 100644
index 0000000000..e29f931386
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/template/index.ts
@@ -0,0 +1,57 @@
+import { IProjectTemplate } from '../../../../../types';
+import { generateStaticFiles } from './static-files';
+
+const icejs3Template: IProjectTemplate = {
+ slots: {
+ components: {
+ path: ['src', 'components'],
+ fileName: 'index',
+ },
+ pages: {
+ path: ['src', 'pages'],
+ fileName: 'index',
+ },
+ entry: {
+ path: ['src'],
+ fileName: 'app',
+ },
+ constants: {
+ path: ['src'],
+ fileName: 'constants',
+ },
+ utils: {
+ path: ['src'],
+ fileName: 'utils',
+ },
+ i18n: {
+ path: ['src'],
+ fileName: 'i18n',
+ },
+ globalStyle: {
+ path: ['src'],
+ fileName: 'global',
+ },
+ packageJSON: {
+ path: [],
+ fileName: 'package',
+ },
+ appConfig: {
+ path: ['src'],
+ fileName: 'app',
+ },
+ buildConfig: {
+ path: [],
+ fileName: 'ice.config',
+ },
+ layout: {
+ path: ['src', 'pages'],
+ fileName: 'layout',
+ },
+ },
+
+ generateTemplate() {
+ return generateStaticFiles();
+ },
+};
+
+export default icejs3Template;
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/template/static-files.ts b/modules/code-generator/src/plugins/project/framework/icejs3/template/static-files.ts
new file mode 100644
index 0000000000..8f3794b61a
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/template/static-files.ts
@@ -0,0 +1,33 @@
+import { ResultDir } from '@alilc/lowcode-types';
+import { createResultDir } from '../../../../../utils/resultHelper';
+import { runFileGenerator } from '../../../../../utils/templateHelper';
+
+import file1 from './files/gitignore';
+import file2 from './files/README.md';
+import file3 from './files/browserslistrc';
+import file4 from './files/typings';
+import file5 from './files/document';
+import file6 from './files/src/layouts/BasicLayout/components/Footer/index.jsx';
+import file7 from './files/src/layouts/BasicLayout/components/Footer/index.style';
+import file8 from './files/src/layouts/BasicLayout/components/Logo/index.jsx';
+import file9 from './files/src/layouts/BasicLayout/components/Logo/index.style';
+import file10 from './files/src/layouts/BasicLayout/components/PageNav/index.jsx';
+import file11 from './files/src/layouts/BasicLayout/index.jsx';
+import file12 from './files/src/layouts/BasicLayout/menuConfig.js';
+
+export function generateStaticFiles(root = createResultDir('.')): ResultDir {
+ runFileGenerator(root, file1);
+ runFileGenerator(root, file2);
+ runFileGenerator(root, file3);
+ runFileGenerator(root, file4);
+ runFileGenerator(root, file5);
+ runFileGenerator(root, file6);
+ runFileGenerator(root, file7);
+ runFileGenerator(root, file8);
+ runFileGenerator(root, file9);
+ runFileGenerator(root, file10);
+ runFileGenerator(root, file11);
+ runFileGenerator(root, file12);
+
+ return root;
+}
diff --git a/modules/code-generator/src/plugins/project/framework/rax/plugins/packageJSON.ts b/modules/code-generator/src/plugins/project/framework/rax/plugins/packageJSON.ts
index e95a3dc0bf..401ba3f97f 100644
--- a/modules/code-generator/src/plugins/project/framework/rax/plugins/packageJSON.ts
+++ b/modules/code-generator/src/plugins/project/framework/rax/plugins/packageJSON.ts
@@ -1,4 +1,4 @@
-import { NpmInfo, PackageJSON } from '@alilc/lowcode-types';
+import { IPublicTypeNpmInfo, PackageJSON } from '@alilc/lowcode-types';
import { COMMON_CHUNK_NAME } from '../../../../../const/generator';
import {
@@ -84,9 +84,9 @@ const pluginFactory: BuilderComponentPluginFactory = (cfg)
export default pluginFactory;
-function getNpmDependencies(project: IProjectInfo): NpmInfo[] {
- const npmDeps: NpmInfo[] = [];
- const npmNameToPkgMap = new Map();
+function getNpmDependencies(project: IProjectInfo): IPublicTypeNpmInfo[] {
+ const npmDeps: IPublicTypeNpmInfo[] = [];
+ const npmNameToPkgMap = new Map();
const allDeps = project.packages;
diff --git a/modules/code-generator/src/plugins/project/i18n.ts b/modules/code-generator/src/plugins/project/i18n.ts
index 7658f9c854..4c36345a5f 100644
--- a/modules/code-generator/src/plugins/project/i18n.ts
+++ b/modules/code-generator/src/plugins/project/i18n.ts
@@ -34,14 +34,14 @@ const pluginFactory: BuilderComponentPluginFactory = () => {
};
const isEmptyVariables = variables => (
- Array.isArray(variables) && variables.length === 0
+ Array.isArray(variables) && variables.length === 0
|| typeof variables === 'object' && (!variables || Object.keys(variables).length === 0)
);
// 按低代码规范里面的要求进行变量替换
const format = (msg, variables) => (
- typeof msg === 'string'
- ? msg.replace(/\\\$\\{(\\w+)\\}/g, (match, key) => variables?.[key] ?? '')
+ typeof msg === 'string'
+ ? msg.replace(/\\\$?\\{(\\w+)\\}/g, (match, key) => variables?.[key] ?? '')
: msg
);
@@ -69,7 +69,7 @@ const pluginFactory: BuilderComponentPluginFactory = () => {
};
target._i18nText = (t) => {
// 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace('-', '_')]
+ const localMsg = t[locale] ?? t[String(locale).replace('-', '_')]
if (localMsg != null) {
return format(localMsg, t.params);
}
@@ -81,7 +81,7 @@ const pluginFactory: BuilderComponentPluginFactory = () => {
}
// 兜底用 use 指定的或默认语言的
- return format(t[t.use || "zh_CN"] ?? t.en_US, t.params);
+ return format(t[t.use || "zh-CN"] ?? t.en_US, t.params);
}
// 注入到上下文中去
diff --git a/modules/code-generator/src/postprocessor/prettier/index.ts b/modules/code-generator/src/postprocessor/prettier/index.ts
index afdcc62258..079c45582e 100644
--- a/modules/code-generator/src/postprocessor/prettier/index.ts
+++ b/modules/code-generator/src/postprocessor/prettier/index.ts
@@ -9,7 +9,7 @@ const PARSERS = ['css', 'scss', 'less', 'json', 'html', 'vue'];
export interface ProcessorConfig {
customFileTypeParser: Record;
- plugins?: Array;
+ plugins?: prettier.Plugin[];
}
const factory: PostProcessorFactory = (config?: ProcessorConfig) => {
@@ -20,8 +20,10 @@ const factory: PostProcessorFactory = (config?: ProcessorConfig
const codePrettier: PostProcessor = (content: string, fileType: string) => {
let parser: prettier.BuiltInParserName | any;
- if (fileType === 'js' || fileType === 'jsx') {
- parser = 'babel';
+ if (fileType === 'js' || fileType === 'jsx' || fileType === 'ts' || fileType === 'tsx') {
+ parser = 'babel-ts';
+ } else if (fileType === 'json') {
+ parser = 'json-stringify';
} else if (PARSERS.indexOf(fileType) >= 0) {
parser = fileType;
} else if (cfg.customFileTypeParser[fileType]) {
@@ -33,6 +35,8 @@ const factory: PostProcessorFactory = (config?: ProcessorConfig
return prettier.format(content, {
parser,
plugins: [parserBabel, parserPostCss, parserHtml, ...(cfg.plugins || [])],
+ singleQuote: true,
+ jsxSingleQuote: false,
});
};
diff --git a/modules/code-generator/src/publisher/zip/index.ts b/modules/code-generator/src/publisher/zip/index.ts
index cc2f082b27..0ac0b6f67f 100644
--- a/modules/code-generator/src/publisher/zip/index.ts
+++ b/modules/code-generator/src/publisher/zip/index.ts
@@ -2,9 +2,9 @@ import { ResultDir } from '@alilc/lowcode-types';
import { PublisherFactory, IPublisher, IPublisherFactoryParams, PublisherError } from '../../types';
import { getErrorMessage } from '../../utils/errors';
import { isNodeProcess, writeZipToDisk, generateProjectZip } from './utils';
+import { saveAs } from 'file-saver';
-// export type ZipBuffer = Buffer | Blob;
-export type ZipBuffer = Buffer;
+export type ZipBuffer = Buffer | Blob;
declare type ZipPublisherResponse = string | ZipBuffer;
@@ -44,10 +44,16 @@ export const createZipPublisher: PublisherFactory => {
let zip = new JSZip();
zip = writeFolderToZip(project, zip, true);
- // const zipType = isNodeProcess() ? 'nodebuffer' : 'blob';
- const zipType = 'nodebuffer'; // 目前先只支持 node 调用
+ const zipType = isNodeProcess() ? 'nodebuffer' : 'blob';
return zip.generateAsync({ type: zipType });
};
diff --git a/modules/code-generator/src/solutions/icejs.ts b/modules/code-generator/src/solutions/icejs.ts
index 0a9d5c60d1..1149098ecb 100644
--- a/modules/code-generator/src/solutions/icejs.ts
+++ b/modules/code-generator/src/solutions/icejs.ts
@@ -3,11 +3,13 @@ import { IProjectBuilder, IProjectBuilderOptions } from '../types';
import { createProjectBuilder } from '../generator/ProjectBuilder';
import esmodule from '../plugins/common/esmodule';
+import styleImport from '../plugins/common/styleImport';
import containerClass from '../plugins/component/react/containerClass';
import containerInitState from '../plugins/component/react/containerInitState';
import containerInjectContext from '../plugins/component/react/containerInjectContext';
import containerInjectUtils from '../plugins/component/react/containerInjectUtils';
import containerInjectDataSourceEngine from '../plugins/component/react/containerInjectDataSourceEngine';
+import containerInjectConstants from '../plugins/component/react/containerInjectConstants';
import containerInjectI18n from '../plugins/component/react/containerInjectI18n';
import containerLifeCycle from '../plugins/component/react/containerLifeCycle';
import containerMethod from '../plugins/component/react/containerMethod';
@@ -22,7 +24,7 @@ import icejs from '../plugins/project/framework/icejs';
import { prettier } from '../postprocessor';
-export interface IceJsProjectBuilderOptions extends IProjectBuilderOptions {}
+export type IceJsProjectBuilderOptions = IProjectBuilderOptions;
export default function createIceJsProjectBuilder(
options?: IceJsProjectBuilderOptions,
@@ -37,11 +39,13 @@ export default function createIceJsProjectBuilder(
esmodule({
fileType: 'jsx',
}),
+ styleImport(),
containerClass(),
containerInjectContext(),
containerInjectUtils(),
containerInjectDataSourceEngine(),
containerInjectI18n(),
+ containerInjectConstants(),
containerInitState(),
containerLifeCycle(),
containerMethod(),
@@ -60,11 +64,13 @@ export default function createIceJsProjectBuilder(
esmodule({
fileType: 'jsx',
}),
+ styleImport(),
containerClass(),
containerInjectContext(),
containerInjectUtils(),
containerInjectDataSourceEngine(),
containerInjectI18n(),
+ containerInjectConstants(),
containerInitState(),
containerLifeCycle(),
containerMethod(),
@@ -89,16 +95,18 @@ export default function createIceJsProjectBuilder(
packageJSON: [icejs.plugins.packageJSON()],
},
postProcessors: [prettier()],
+ customizeBuilderOptions: options?.customizeBuilderOptions,
});
}
export const plugins = {
containerClass,
- containerInitState,
containerInjectContext,
containerInjectUtils,
- containerInjectI18n,
containerInjectDataSourceEngine,
+ containerInjectI18n,
+ containerInjectConstants,
+ containerInitState,
containerLifeCycle,
containerMethod,
jsx,
diff --git a/modules/code-generator/src/solutions/icejs3.ts b/modules/code-generator/src/solutions/icejs3.ts
new file mode 100644
index 0000000000..a8622e74ab
--- /dev/null
+++ b/modules/code-generator/src/solutions/icejs3.ts
@@ -0,0 +1,113 @@
+import { IProjectBuilder, IProjectBuilderOptions } from '../types';
+
+import { createProjectBuilder } from '../generator/ProjectBuilder';
+
+import esmodule from '../plugins/common/esmodule';
+import styleImport from '../plugins/common/styleImport';
+import containerClass from '../plugins/component/react/containerClass';
+import containerInitState from '../plugins/component/react/containerInitState';
+import containerInjectContext from '../plugins/component/react/containerInjectContext';
+import containerInjectUtils from '../plugins/component/react/containerInjectUtils';
+import containerInjectDataSourceEngine from '../plugins/component/react/containerInjectDataSourceEngine';
+import containerInjectConstants from '../plugins/component/react/containerInjectConstants';
+import containerInjectI18n from '../plugins/component/react/containerInjectI18n';
+import containerLifeCycle from '../plugins/component/react/containerLifeCycle';
+import containerMethod from '../plugins/component/react/containerMethod';
+import jsx from '../plugins/component/react/jsx';
+import reactCommonDeps from '../plugins/component/react/reactCommonDeps';
+import css from '../plugins/component/style/css';
+import constants from '../plugins/project/constants';
+import i18n from '../plugins/project/i18n';
+import utils from '../plugins/project/utils';
+
+import icejs3 from '../plugins/project/framework/icejs3';
+
+import { prettier } from '../postprocessor';
+
+export type IceJs3ProjectBuilderOptions = IProjectBuilderOptions;
+
+export default function createIceJsProjectBuilder(
+ options?: IceJs3ProjectBuilderOptions,
+): IProjectBuilder {
+ return createProjectBuilder({
+ inStrictMode: options?.inStrictMode,
+ extraContextData: { ...options },
+ template: icejs3.template,
+ plugins: {
+ components: [
+ reactCommonDeps(),
+ esmodule({
+ fileType: 'jsx',
+ }),
+ styleImport(),
+ containerClass(),
+ containerInjectContext(),
+ containerInjectUtils(),
+ containerInjectDataSourceEngine(),
+ containerInjectI18n(),
+ containerInjectConstants(),
+ containerInitState(),
+ containerLifeCycle(),
+ containerMethod(),
+ jsx({
+ nodeTypeMapping: {
+ Div: 'div',
+ Component: 'div',
+ Page: 'div',
+ Block: 'div',
+ },
+ }),
+ css(),
+ ],
+ pages: [
+ reactCommonDeps(),
+ esmodule({
+ fileType: 'jsx',
+ }),
+ styleImport(),
+ containerClass(),
+ containerInjectContext(),
+ containerInjectUtils(),
+ containerInjectDataSourceEngine(),
+ containerInjectI18n(),
+ containerInjectConstants(),
+ containerInitState(),
+ containerLifeCycle(),
+ containerMethod(),
+ jsx({
+ nodeTypeMapping: {
+ Div: 'div',
+ Component: 'div',
+ Page: 'div',
+ Block: 'div',
+ Box: 'div',
+ },
+ }),
+ css(),
+ ],
+ constants: [constants()],
+ utils: [esmodule(), utils('react')],
+ i18n: [i18n()],
+ globalStyle: [icejs3.plugins.globalStyle()],
+ packageJSON: [icejs3.plugins.packageJSON()],
+ buildConfig: [icejs3.plugins.buildConfig()],
+ appConfig: [icejs3.plugins.appConfig()],
+ layout: [icejs3.plugins.layout()],
+ },
+ postProcessors: [prettier()],
+ customizeBuilderOptions: options?.customizeBuilderOptions,
+ });
+}
+
+export const plugins = {
+ containerClass,
+ containerInitState,
+ containerInjectContext,
+ containerInjectUtils,
+ containerInjectI18n,
+ containerInjectDataSourceEngine,
+ containerLifeCycle,
+ containerMethod,
+ jsx,
+ commonDeps: reactCommonDeps,
+};
diff --git a/modules/code-generator/src/solutions/rax-app.ts b/modules/code-generator/src/solutions/rax-app.ts
index c2b3adac50..f7e9038353 100644
--- a/modules/code-generator/src/solutions/rax-app.ts
+++ b/modules/code-generator/src/solutions/rax-app.ts
@@ -71,6 +71,7 @@ export default function createRaxProjectBuilder(
packageJSON: [raxApp.plugins.packageJSON(options)],
},
postProcessors: [prettier()],
+ customizeBuilderOptions: options?.customizeBuilderOptions,
});
}
diff --git a/modules/code-generator/src/standalone-loader.ts b/modules/code-generator/src/standalone-loader.ts
index 882b1de9dd..0c8903ddcb 100644
--- a/modules/code-generator/src/standalone-loader.ts
+++ b/modules/code-generator/src/standalone-loader.ts
@@ -1,5 +1,5 @@
import fetch from 'node-fetch';
-import type { ProjectSchema, ResultDir } from '@alilc/lowcode-types';
+import type { IPublicTypeProjectSchema, ResultDir } from '@alilc/lowcode-types';
import type { FlattenFile } from './types/file';
declare const Worker: any;
@@ -26,7 +26,7 @@ export type Result = ResultDir | FlattenFile[];
export async function generateCode(options: {
solution: 'icejs' | 'rax';
- schema: ProjectSchema;
+ schema: IPublicTypeProjectSchema;
flattenResult?: boolean;
workerJsUrl?: string;
timeoutInMs?: number;
diff --git a/modules/code-generator/src/standalone-worker.ts b/modules/code-generator/src/standalone-worker.ts
index 71f56e67a3..e00a4877bf 100644
--- a/modules/code-generator/src/standalone-worker.ts
+++ b/modules/code-generator/src/standalone-worker.ts
@@ -1,5 +1,5 @@
/* eslint-disable no-console */
-import type { ProjectSchema } from '@alilc/lowcode-types';
+import type { IPublicTypeProjectSchema } from '@alilc/lowcode-types';
import CodeGen from './standalone';
declare const self: any;
@@ -13,7 +13,7 @@ self.onmessage = (event: any) => {
self.postMessage({ type: 'ready' });
-async function run(msg: { solution: string; schema: ProjectSchema; flattenResult?: boolean }) {
+async function run(msg: { solution: string; schema: IPublicTypeProjectSchema; flattenResult?: boolean }) {
try {
print('begin run...');
self.postMessage({ type: 'run:begin' });
diff --git a/modules/code-generator/src/standalone.ts b/modules/code-generator/src/standalone.ts
index 2f15515cf8..23d16e61f0 100644
--- a/modules/code-generator/src/standalone.ts
+++ b/modules/code-generator/src/standalone.ts
@@ -8,7 +8,8 @@ import './polyfills/buffer';
import { createProjectBuilder } from './generator/ProjectBuilder';
import { createModuleBuilder } from './generator/ModuleBuilder';
import { createZipPublisher } from './publisher/zip';
-import createIceJsProjectBuilder, { plugins as reactPlugins } from './solutions/icejs';
+import createIceJsProjectBuilder, { plugins as icejsPlugins } from './solutions/icejs';
+import createIceJs3ProjectBuilder, { plugins as icejs3Plugins } from './solutions/icejs3';
import createRaxAppProjectBuilder, { plugins as raxPlugins } from './solutions/rax-app';
// 引入说明
@@ -18,6 +19,7 @@ import { COMMON_CHUNK_NAME, CLASS_DEFINE_CHUNK_NAME, DEFAULT_LINK_AFTER } from '
// 引入通用插件组
import esmodule from './plugins/common/esmodule';
import requireUtils from './plugins/common/requireUtils';
+import styleImport from './plugins/common/styleImport';
import css from './plugins/component/style/css';
import constants from './plugins/project/constants';
@@ -32,6 +34,7 @@ import * as CONSTANTS from './const';
// 引入内置解决方案模块
import icejs from './plugins/project/framework/icejs';
+import icejs3 from './plugins/project/framework/icejs3';
import rax from './plugins/project/framework/rax';
export default {
@@ -39,10 +42,12 @@ export default {
createModuleBuilder,
solutions: {
icejs: createIceJsProjectBuilder,
+ icejs3: createIceJs3ProjectBuilder,
rax: createRaxAppProjectBuilder,
},
solutionParts: {
icejs,
+ icejs3,
rax,
},
publishers: {
@@ -50,6 +55,7 @@ export default {
},
plugins: {
common: {
+
/**
* 处理 ES Module
* @deprecated please use esModule
@@ -57,12 +63,7 @@ export default {
esmodule,
esModule: esmodule,
requireUtils,
- },
- react: {
- ...reactPlugins,
- },
- rax: {
- ...raxPlugins,
+ styleImport,
},
style: {
css,
@@ -72,6 +73,22 @@ export default {
i18n,
utils,
},
+ icejs: {
+ ...icejsPlugins,
+ },
+ icejs3: {
+ ...icejs3Plugins,
+ },
+ rax: {
+ ...raxPlugins,
+ },
+
+ /**
+ * @deprecated please use icejs
+ */
+ react: {
+ ...icejsPlugins,
+ },
},
postprocessor: {
prettier,
diff --git a/modules/code-generator/src/types/analyze.ts b/modules/code-generator/src/types/analyze.ts
index 43de307434..3bf444d29e 100644
--- a/modules/code-generator/src/types/analyze.ts
+++ b/modules/code-generator/src/types/analyze.ts
@@ -1,7 +1,7 @@
-import type { ContainerSchema } from '@alilc/lowcode-types';
+import type { IPublicTypeContainerSchema } from '@alilc/lowcode-types';
export interface ICompAnalyzeResult {
isUsingRef: boolean;
}
-export type TComponentAnalyzer = (container: ContainerSchema) => ICompAnalyzeResult;
+export type TComponentAnalyzer = (container: IPublicTypeContainerSchema) => ICompAnalyzeResult;
diff --git a/modules/code-generator/src/types/core.ts b/modules/code-generator/src/types/core.ts
index 99ca8c97ad..1219a1e767 100644
--- a/modules/code-generator/src/types/core.ts
+++ b/modules/code-generator/src/types/core.ts
@@ -1,19 +1,15 @@
import {
- JSONArray,
- JSONObject,
- CompositeArray,
- CompositeObject,
- ResultDir,
+ IPublicTypeCompositeArray,
+ IPublicTypeCompositeObject, IPublicTypeJSExpression,
+ IPublicTypeJSFunction, IPublicTypeJSONArray,
+ IPublicTypeJSONObject, IPublicTypeJSSlot, IPublicTypeNodeDataType,
+ IPublicTypeProjectSchema, ResultDir,
ResultFile,
- NodeDataType,
- ProjectSchema,
- JSExpression,
- JSFunction,
- JSSlot,
} from '@alilc/lowcode-types';
-import { IParseResult } from './intermediate';
+import type { ProjectBuilderInitOptions } from '../generator/ProjectBuilder';
import { IScopeBindings } from '../utils/ScopeBindings';
+import { IParseResult } from './intermediate';
export enum FileType {
CSS = 'css',
@@ -21,10 +17,13 @@ export enum FileType {
LESS = 'less',
HTML = 'html',
JS = 'js',
+ MJS = 'mjs',
JSX = 'jsx',
TS = 'ts',
+ MTS = 'mts',
TSX = 'tsx',
JSON = 'json',
+ MD = 'md',
}
export enum ChunkType {
@@ -64,14 +63,17 @@ export interface ICodeStruct extends IBaseCodeStruct {
/** 上下文数据，用来在插件之间共享一些数据 */
export interface IContextData extends IProjectBuilderOptions {
- /** 是否使用了 Ref 的 API (this.$/this.$$) */
- useRefApi?: boolean;
/**
* 其他自定义数据
* （三方自定义插件也可以在此放一些数据，建议起个长一点的名称，用自己的插件名做前缀，以防冲突）
*/
[key: string]: any;
+
+ /**
+ * 是否使用了 Ref 的 API (this.$/this.$$)
+ * */
+ useRefApi?: boolean;
}
export type BuilderComponentPlugin = (initStruct: ICodeStruct) => Promise;
@@ -95,7 +97,7 @@ export interface ICompiledModule {
export interface IModuleBuilder {
generateModule: (input: unknown) => Promise;
- generateModuleCode: (schema: ProjectSchema | string) => Promise;
+ generateModuleCode: (schema: IPublicTypeProjectSchema | string) => Promise;
linkCodeChunks: (chunks: Record, fileName: string) => ResultFile[];
addPlugin: (plugin: BuilderComponentPlugin) => void;
}
@@ -107,24 +109,25 @@ export interface IModuleBuilder {
* @interface ICodeGenerator
*/
export interface ICodeGenerator {
+
/**
* 出码接口，把 Schema 转换成代码文件系统描述
*
- * @param {(ProjectSchema)} schema 传入的 Schema
+ * @param {(IPublicTypeProjectSchema)} schema 传入的 Schema
* @returns {ResultDir}
* @memberof ICodeGenerator
*/
- toCode: (schema: ProjectSchema) => Promise;
+ toCode: (schema: IPublicTypeProjectSchema) => Promise;
}
export interface ISchemaParser {
- validate: (schema: ProjectSchema) => boolean;
- parse: (schema: ProjectSchema | string) => IParseResult;
+ validate: (schema: IPublicTypeProjectSchema) => boolean;
+ parse: (schema: IPublicTypeProjectSchema | string) => IParseResult;
}
export interface IProjectTemplate {
slots: Record;
- generateTemplate: () => ResultDir | Promise;
+ generateTemplate: (data: IParseResult) => ResultDir | Promise;
}
export interface IProjectSlot {
@@ -137,51 +140,65 @@ export interface IProjectPlugins {
}
export interface IProjectBuilderOptions {
- /** 是否处于严格模式(默认: 否) */
+
+ /** 是否处于严格模式 (默认：否) */
inStrictMode?: boolean;
/**
* 是否要容忍对 JSExpression 求值时的异常
* 默认：true
- * 注: 如果容忍异常，则会在求值时包裹 try-catch 块，
+ * 注：如果容忍异常，则会在求值时包裹 try-catch 块，
* catch 到异常时默认会抛出一个 CustomEvent 事件里面包含异常信息和求值的表达式
*/
tolerateEvalErrors?: boolean;
/**
* 容忍异常的时候的的错误处理语句块
- * 默认: 无
+ * 默认：无
* 您可以设置为一个语句块，比如：
* window.dispatchEvent(new CustomEvent('lowcode-eval-error', { error, expr }))
*
* 一般可以结合埋点监控模块用来监控求值异常
*
- * 其中:
+ * 其中：
* - error: 异常信息
* - expr: 求值的表达式
*/
evalErrorsHandler?: string;
+
+ /**
+ * Hook which is used to customize original options, we can reorder/add/remove plugins/processors
+ * of the existing solution.
+ */
+ customizeBuilderOptions?(originalOptions: ProjectBuilderInitOptions): ProjectBuilderInitOptions;
}
export interface IProjectBuilder {
- generateProject: (schema: ProjectSchema | string) => Promise;
+ generateProject: (schema: IPublicTypeProjectSchema | string) => Promise;
}
/** 项目级别的前置处理器 */
-export type ProjectPreProcessor = (schema: ProjectSchema) => Promise | ProjectSchema;
+export type ProjectPreProcessor = (schema: IPublicTypeProjectSchema) =>
+ Promise | IPublicTypeProjectSchema;
+
+export interface ProjectPostProcessorOptions {
+ parseResult?: IParseResult;
+ template?: IProjectTemplate;
+}
/** 项目级别的后置处理器 */
export type ProjectPostProcessor = (
result: ResultDir,
- schema: ProjectSchema,
- originalSchema: ProjectSchema | string,
+ schema: IPublicTypeProjectSchema,
+ originalSchema: IPublicTypeProjectSchema | string,
+ options: ProjectPostProcessorOptions,
) => Promise | ResultDir;
/** 模块级别的后置处理器的工厂方法 */
export type PostProcessorFactory = (config?: T) => PostProcessor;
/** 模块级别的后置处理器 */
-export type PostProcessor = (content: string, fileType: string) => string;
+export type PostProcessor = (content: string, fileType: string, name?: string) => string;
// TODO: temp interface, need modify
export interface IPluginOptions {
@@ -198,20 +215,20 @@ type CompositeTypeGenerator =
| BaseGenerator
| Array>;
-export type NodeGenerator = (nodeItem: NodeDataType, scope: IScope) => T;
+export type NodeGenerator = (nodeItem: IPublicTypeNodeDataType, scope: IScope) => T;
// FIXME: 在新的实现中，添加了第一参数 this: CustomHandlerSet 作为上下文。究其本质
// scopeBindings?: IScopeBindings;
-// 这个组合只用来用来处理 CompositeValue 类型，不是这个类型的不要放在这里
+// 这个组合只用来用来处理 IPublicTypeCompositeValue 类型，不是这个类型的不要放在这里
export interface HandlerSet {
string?: CompositeTypeGenerator;
boolean?: CompositeTypeGenerator;
number?: CompositeTypeGenerator;
- expression?: CompositeTypeGenerator;
- function?: CompositeTypeGenerator;
- slot?: CompositeTypeGenerator;
- array?: CompositeTypeGenerator;
- object?: CompositeTypeGenerator;
+ expression?: CompositeTypeGenerator;
+ function?: CompositeTypeGenerator;
+ slot?: CompositeTypeGenerator;
+ array?: CompositeTypeGenerator;
+ object?: CompositeTypeGenerator;
}
export interface CompositeValueGeneratorOptions {
diff --git a/modules/code-generator/src/types/deps.ts b/modules/code-generator/src/types/deps.ts
index cb2fb5eac4..a6531092d5 100644
--- a/modules/code-generator/src/types/deps.ts
+++ b/modules/code-generator/src/types/deps.ts
@@ -35,4 +35,4 @@ export interface IDependency {
main?: string; // 包导出组件入口文件路径 /lib/input
dependencyType?: DependencyType; // 依赖类型 内/外
componentName?: string; // 导入后名称
-}
+}
\ No newline at end of file
diff --git a/modules/code-generator/src/types/intermediate.ts b/modules/code-generator/src/types/intermediate.ts
index 43d8f0e844..7cba0bd44b 100644
--- a/modules/code-generator/src/types/intermediate.ts
+++ b/modules/code-generator/src/types/intermediate.ts
@@ -1,4 +1,9 @@
-import { I18nMap, UtilsMap, ContainerSchema, JSONObject } from '@alilc/lowcode-types';
+import {
+ IPublicTypeI18nMap,
+ IPublicTypeUtilsMap,
+ IPublicTypeContainerSchema,
+ IPublicTypeJSONObject,
+} from '@alilc/lowcode-types';
import { IDependency, INpmPackage } from './deps';
import { ICompAnalyzeResult } from './analyze';
@@ -6,7 +11,7 @@ import { ICompAnalyzeResult } from './analyze';
export interface IParseResult {
containers: IContainerInfo[];
globalUtils?: IUtilInfo;
- globalI18n?: I18nMap;
+ globalI18n?: IPublicTypeI18nMap;
globalRouter?: IRouterInfo;
project?: IProjectInfo;
}
@@ -15,14 +20,14 @@ export interface IWithDependency {
deps?: IDependency[];
}
-export interface IContainerInfo extends ContainerSchema, IWithDependency {
+export interface IContainerInfo extends IPublicTypeContainerSchema, IWithDependency {
containerType: string;
moduleName: string;
analyzeResult?: ICompAnalyzeResult;
}
export interface IUtilInfo extends IWithDependency {
- utils: UtilsMap;
+ utils: IPublicTypeUtilsMap;
}
export interface IRouterInfo extends IWithDependency {
@@ -33,16 +38,26 @@ export interface IRouterInfo extends IWithDependency {
}>;
}
+/**
+ * project's remarks
+ */
+export interface ProjectRemark {
+
+ /** if current project only contain one container which type is `Component` */
+ isSingleComponent?: boolean;
+}
+
export interface IProjectInfo {
css?: string;
containersDeps?: IDependency[];
utilsDeps?: IDependency[];
- constants?: JSONObject;
- i18n?: I18nMap;
+ constants?: IPublicTypeJSONObject;
+ i18n?: IPublicTypeI18nMap;
packages: INpmPackage[];
meta?: { name?: string; title?: string } | Record;
config?: Record;
dataSourcesTypes?: string[];
+ projectRemark?: ProjectRemark;
}
export interface IPageMeta {
diff --git a/modules/code-generator/src/types/jsx.ts b/modules/code-generator/src/types/jsx.ts
index c79f1d2070..28f948d639 100644
--- a/modules/code-generator/src/types/jsx.ts
+++ b/modules/code-generator/src/types/jsx.ts
@@ -1,4 +1,4 @@
-import { NodeSchema, CompositeValue } from '@alilc/lowcode-types';
+import { IPublicTypeNodeSchema, IPublicTypeCompositeValue } from '@alilc/lowcode-types';
import { HandlerSet, BaseGenerator, NodeGenerator } from './core';
export enum PIECE_TYPE {
@@ -17,11 +17,11 @@ export interface CodePiece {
export interface AttrData {
attrName: string;
- attrValue: CompositeValue;
+ attrValue: IPublicTypeCompositeValue;
}
-// 对 JSX 出码的理解，目前定制点包含 【包装】【标签名】【属性】
+// 对 JSX 出码的理解，目前定制点包含【包装】【标签名】【属性】
export type AttrPlugin = BaseGenerator;
-export type NodePlugin = BaseGenerator;
+export type NodePlugin = BaseGenerator;
export interface NodeGeneratorConfig {
handlers?: HandlerSet;
@@ -33,7 +33,7 @@ export interface NodeGeneratorConfig {
/**
* 是否要容忍对 JSExpression 求值时的异常
* 默认：true
- * 注: 如果容忍异常，则会在求值时包裹 try-catch 块 -- 通过 __$$eval / __$$evalArray
+ * 注：如果容忍异常，则会在求值时包裹 try-catch 块 -- 通过 __$$eval / __$$evalArray
* catch 到异常时默认会抛出一个 CustomEvent 事件里面包含异常信息和求值的表达式
*/
tolerateEvalErrors?: boolean;
diff --git a/modules/code-generator/src/utils/common.ts b/modules/code-generator/src/utils/common.ts
index cfba393e96..fa7ab30a95 100644
--- a/modules/code-generator/src/utils/common.ts
+++ b/modules/code-generator/src/utils/common.ts
@@ -1,5 +1,7 @@
+import type { IPublicTypeJSExpression, IPublicTypeJSFunction } from '@alilc/lowcode-types';
import changeCase from 'change-case';
import short from 'short-uuid';
+import { DependencyType, IDependency, IExternalDependency, IInternalDependency } from '../types';
// Doc: https://www.npmjs.com/package/change-case
@@ -39,3 +41,19 @@ export function getStaticExprValue(expr: string): T {
// eslint-disable-next-line no-new-func
return Function(`"use strict";return (${expr})`)();
}
+
+export function isJSExpressionFn(data: any): data is IPublicTypeJSFunction {
+ return data?.type === 'JSExpression' && data?.extType === 'function';
+}
+
+export function isInternalDependency(
+ dependency: IDependency,
+): dependency is IInternalDependency {
+ return dependency.dependencyType === DependencyType.Internal;
+}
+
+export function isExternalDependency(
+ dependency: IDependency,
+): dependency is IExternalDependency {
+ return dependency.dependencyType === DependencyType.External;
+}
\ No newline at end of file
diff --git a/modules/code-generator/src/utils/compositeType.ts b/modules/code-generator/src/utils/compositeType.ts
index d4885e2243..0dd612641d 100644
--- a/modules/code-generator/src/utils/compositeType.ts
+++ b/modules/code-generator/src/utils/compositeType.ts
@@ -1,13 +1,13 @@
import {
- CompositeArray,
- CompositeValue,
- CompositeObject,
- JSFunction,
- JSExpression,
+ IPublicTypeCompositeArray,
+ IPublicTypeCompositeValue,
+ IPublicTypeCompositeObject,
+ IPublicTypeJSFunction,
+ IPublicTypeJSExpression,
isJSExpression,
isJSFunction,
isJSSlot,
- JSSlot,
+ IPublicTypeJSSlot,
} from '@alilc/lowcode-types';
import _ from 'lodash';
@@ -16,6 +16,7 @@ import { generateExpression, generateFunction } from './jsExpression';
import { generateJsSlot } from './jsSlot';
import { executeFunctionStack } from './aopHelper';
import { parseExpressionGetKeywords } from './expressionParser';
+import { isJSExpressionFn } from './common';
interface ILegaoVariable {
type: 'variable';
@@ -43,7 +44,7 @@ function isDataSource(v: unknown): v is DataSource {
}
function generateArray(
- value: CompositeArray,
+ value: IPublicTypeCompositeArray,
scope: IScope,
options: CompositeValueGeneratorOptions = {},
): string {
@@ -52,7 +53,7 @@ function generateArray(
}
function generateObject(
- value: CompositeObject,
+ value: IPublicTypeCompositeObject,
scope: IScope,
options: CompositeValueGeneratorOptions = {},
): string {
@@ -88,7 +89,7 @@ function generateBool(value: boolean): string {
return value ? 'true' : 'false';
}
-function genFunction(value: JSFunction): string {
+function genFunction(value: IPublicTypeJSFunction): string {
const globalVars = parseExpressionGetKeywords(value.value);
if (globalVars.includes('arguments')) {
@@ -98,7 +99,7 @@ function genFunction(value: JSFunction): string {
return generateFunction(value, { isArrow: true });
}
-function genJsSlot(value: JSSlot, scope: IScope, options: CompositeValueGeneratorOptions = {}) {
+function genJsSlot(value: IPublicTypeJSSlot, scope: IScope, options: CompositeValueGeneratorOptions = {}) {
if (options.nodeGenerator) {
return generateJsSlot(value, scope, options.nodeGenerator);
}
@@ -106,7 +107,7 @@ function genJsSlot(value: JSSlot, scope: IScope, options: CompositeValueGenerato
}
function generateUnknownType(
- value: CompositeValue,
+ value: IPublicTypeCompositeValue,
scope: IScope,
options: CompositeValueGeneratorOptions = {},
): string {
@@ -128,19 +129,20 @@ function generateUnknownType(
// FIXME: 这个是临时方案
// 在遇到 type variable 私有类型时，转换为 JSExpression
if (isVariable(value)) {
- const transValue: JSExpression = {
+ const transValue: IPublicTypeJSExpression = {
type: 'JSExpression',
value: value.variable,
};
if (options.handlers?.expression) {
- return executeFunctionStack(
+ const expression = executeFunctionStack(
transValue,
scope,
options.handlers.expression,
generateExpression,
options,
);
+ return expression || 'undefined';
}
return generateExpression(transValue, scope);
}
@@ -158,7 +160,7 @@ function generateUnknownType(
return generateExpression(value, scope);
}
- if (isJSFunction(value)) {
+ if (isJSFunction(value) || isJSExpressionFn(value)) {
if (options.handlers?.function) {
return executeFunctionStack(value, scope, options.handlers.function, genFunction, options);
}
@@ -187,7 +189,7 @@ function generateUnknownType(
if (options.handlers?.object) {
return executeFunctionStack(value, scope, options.handlers.object, generateObject, options);
}
- return generateObject(value as CompositeObject, scope, options);
+ return generateObject(value as IPublicTypeCompositeObject, scope, options);
}
if (_.isString(value)) {
@@ -217,7 +219,7 @@ function generateUnknownType(
// 这一层曾经是对产出做最外层包装的，但其实包装逻辑不应该属于这一层
// 这一层先不去掉，做冗余，方便后续重构
export function generateCompositeType(
- value: CompositeValue,
+ value: IPublicTypeCompositeValue,
scope: IScope,
options: CompositeValueGeneratorOptions = {},
): string {
diff --git a/modules/code-generator/src/utils/dataSource.ts b/modules/code-generator/src/utils/dataSource.ts
index 610f399344..5595b8defd 100644
--- a/modules/code-generator/src/utils/dataSource.ts
+++ b/modules/code-generator/src/utils/dataSource.ts
@@ -1,20 +1,24 @@
import changeCase from 'change-case';
import type { IProjectInfo } from '../types/intermediate';
-export type DataSourceDependenciesConfig = {
+export interface DataSourceDependenciesConfig {
+
/** 数据源引擎的版本 */
engineVersion?: string;
+
/** 数据源引擎的包名 */
enginePackage?: string;
+
/** 数据源 handlers 的版本 */
handlersVersion?: {
[key: string]: string;
};
+
/** 数据源 handlers 的包名 */
handlersPackages?: {
[key: string]: string;
};
-};
+}
export function buildDataSourceDependencies(
ir: IProjectInfo,
@@ -22,13 +26,13 @@ export function buildDataSourceDependencies(
): Record {
return {
// 数据源引擎的依赖包
- [cfg.enginePackage || '@alilc/lowcode-datasource-engine']: cfg.engineVersion || 'latest',
+ [cfg.enginePackage || '@alilc/lowcode-datasource-engine']: cfg.engineVersion || '^1.0.0',
// 各种数据源的 handlers 的依赖包
...(ir.dataSourcesTypes || []).reduce(
(acc, dsType) => ({
...acc,
- [getDataSourceHandlerPackageName(dsType)]: cfg.handlersVersion?.[dsType] || 'latest',
+ [getDataSourceHandlerPackageName(dsType)]: cfg.handlersVersion?.[dsType] || '^1.0.0',
}),
{},
),
diff --git a/modules/code-generator/src/utils/expressionParser.ts b/modules/code-generator/src/utils/expressionParser.ts
index 58c6e6ca8c..15320b9637 100644
--- a/modules/code-generator/src/utils/expressionParser.ts
+++ b/modules/code-generator/src/utils/expressionParser.ts
@@ -161,9 +161,13 @@ export function parseExpressionGetKeywords(expr: string | null | undefined): str
try {
const keywordVars = new OrderedSet();
- const ast = parser.parse(`!(${expr});`);
+ const ast = parser.parse(`!(${expr});`, {
+ plugins: [
+ 'jsx',
+ ],
+ });
- const addIdentifierIfNeeded = (x: Record | number | null | undefined) => {
+ const addIdentifierIfNeeded = (x: Node | null | undefined) => {
if (typeof x === 'object' && isIdentifier(x) && JS_KEYWORDS.includes(x.name)) {
keywordVars.add(x.name);
}
@@ -185,7 +189,7 @@ export function parseExpressionGetKeywords(expr: string | null | undefined): str
addIdentifierIfNeeded(item);
});
} else {
- addIdentifierIfNeeded(fieldValue as Record | null);
+ addIdentifierIfNeeded(fieldValue as any);
}
}
});
@@ -213,7 +217,7 @@ export function parseExpressionGetGlobalVariables(
const ast = parser.parse(`!(${expr});`);
const addUndeclaredIdentifierIfNeeded = (
- x: Record | number | null | undefined,
+ x: Node | null | undefined,
path: NodePath,
) => {
if (typeof x === 'object' && isIdentifier(x) && !path.scope.hasBinding(x.name)) {
@@ -237,7 +241,7 @@ export function parseExpressionGetGlobalVariables(
addUndeclaredIdentifierIfNeeded(item, path);
});
} else {
- addUndeclaredIdentifierIfNeeded(fieldValue as Record | null, path);
+ addUndeclaredIdentifierIfNeeded(fieldValue as any, path);
}
}
});
diff --git a/modules/code-generator/src/utils/format.ts b/modules/code-generator/src/utils/format.ts
new file mode 100644
index 0000000000..7c865e8f34
--- /dev/null
+++ b/modules/code-generator/src/utils/format.ts
@@ -0,0 +1,12 @@
+import prettier from 'prettier';
+import parserBabel from 'prettier/parser-babel';
+
+export function format(content: string, options = {}) {
+ return prettier.format(content, {
+ parser: 'babel',
+ plugins: [parserBabel],
+ singleQuote: true,
+ jsxSingleQuote: false,
+ ...options,
+ });
+}
diff --git a/modules/code-generator/src/utils/index.ts b/modules/code-generator/src/utils/index.ts
index ff5194172d..8c41d678ff 100644
--- a/modules/code-generator/src/utils/index.ts
+++ b/modules/code-generator/src/utils/index.ts
@@ -11,6 +11,8 @@ import * as schema from './schema';
import * as version from './version';
import * as scope from './Scope';
import * as expressionParser from './expressionParser';
+import * as dataSource from './dataSource';
+import * as pathHelper from './pathHelper';
export {
common,
@@ -25,4 +27,6 @@ export {
version,
scope,
expressionParser,
+ dataSource,
+ pathHelper,
};
diff --git a/modules/code-generator/src/utils/jsExpression.ts b/modules/code-generator/src/utils/jsExpression.ts
index d9fb67892c..08d2fafd8a 100644
--- a/modules/code-generator/src/utils/jsExpression.ts
+++ b/modules/code-generator/src/utils/jsExpression.ts
@@ -2,13 +2,19 @@ import * as parser from '@babel/parser';
import generate from '@babel/generator';
import traverse from '@babel/traverse';
import * as t from '@babel/types';
-import { JSExpression, JSFunction, isJSExpression, isJSFunction } from '@alilc/lowcode-types';
+import { IPublicTypeJSExpression, IPublicTypeJSFunction, isJSExpression, isJSFunction } from '@alilc/lowcode-types';
import { CodeGeneratorError, IScope } from '../types';
import { transformExpressionLocalRef, ParseError } from './expressionParser';
+import { isJSExpressionFn } from './common';
function parseFunction(content: string): t.FunctionExpression | null {
try {
- const ast = parser.parse(`(${content});`);
+ const ast = parser.parse(`(${content});`, {
+ plugins: [
+ 'jsx',
+ ],
+ });
+
let resultNode: t.FunctionExpression | null = null;
traverse(ast, {
FunctionExpression(path) {
@@ -73,13 +79,18 @@ function getBodyStatements(content: string) {
throw new Error('Can not find Function Statement');
}
-export function isJsCode(value: unknown): boolean {
- return isJSExpression(value) || isJSFunction(value);
+/**
+ * 是否是广义上的 JSFunction
+ * @param value
+ * @returns
+ */
+export function isBroadJSFunction(value: unknown): boolean {
+ return isJSExpressionFn(value) || isJSFunction(value);
}
export function generateExpression(value: any, scope: IScope): string {
if (isJSExpression(value)) {
- const exprVal = (value as JSExpression).value.trim();
+ const exprVal = (value as IPublicTypeJSExpression).value.trim();
if (!exprVal) {
return 'null';
}
@@ -91,6 +102,10 @@ export function generateExpression(value: any, scope: IScope): string {
throw new CodeGeneratorError('Not a JSExpression');
}
+function getFunctionSource(cfg: IPublicTypeJSFunction): string {
+ return cfg.source || cfg.value || cfg.compiled;
+}
+
export function generateFunction(
value: any,
config: {
@@ -107,21 +122,26 @@ export function generateFunction(
isBindExpr: false,
},
) {
- if (isJsCode(value)) {
- const functionCfg = value as JSFunction;
+ if (isBroadJSFunction(value)) {
+ const functionCfg = value as IPublicTypeJSFunction;
+ const functionSource = getFunctionSource(functionCfg);
if (config.isMember) {
- return transformFuncExpr2MethodMember(config.name || '', functionCfg.value);
+ return transformFuncExpr2MethodMember(config.name || '', functionSource);
}
if (config.isBlock) {
- return getBodyStatements(functionCfg.value);
+ return getBodyStatements(functionSource);
}
if (config.isArrow) {
- return getArrowFunction(functionCfg.value);
+ return getArrowFunction(functionSource);
}
if (config.isBindExpr) {
- return `(${functionCfg.value}).bind(this)`;
+ return `(${functionSource}).bind(this)`;
}
- return functionCfg.value;
+ return functionSource;
+ }
+
+ if (isJSExpression(value)) {
+ return value.value;
}
throw new CodeGeneratorError('Not a JSFunction or JSExpression');
diff --git a/modules/code-generator/src/utils/jsSlot.ts b/modules/code-generator/src/utils/jsSlot.ts
index 49f7b31704..265f6857f2 100644
--- a/modules/code-generator/src/utils/jsSlot.ts
+++ b/modules/code-generator/src/utils/jsSlot.ts
@@ -1,4 +1,4 @@
-import { JSSlot, isJSSlot, NodeData } from '@alilc/lowcode-types';
+import { IPublicTypeJSSlot, isJSSlot, IPublicTypeNodeData } from '@alilc/lowcode-types';
import { CodeGeneratorError, NodeGenerator, IScope } from '../types';
import { unwrapJsExprQuoteInJsx } from './jsxHelpers';
@@ -8,7 +8,7 @@ function generateSingleLineComment(commentText: string): string {
export function generateJsSlot(slot: any, scope: IScope, generator: NodeGenerator): string {
if (isJSSlot(slot)) {
- const { title, params, value } = slot as JSSlot;
+ const { title, params, value } = slot as IPublicTypeJSSlot;
// slot 也是分有参数和无参数的
// - 有参数的 slot 就是类似一个 render 函数，需要创建子作用域
@@ -39,7 +39,7 @@ export function generateJsSlot(slot: any, scope: IScope, generator: NodeGenerato
}
function generateNodeDataOrArrayForJsSlot(
- value: NodeData | NodeData[],
+ value: IPublicTypeNodeData | IPublicTypeNodeData[],
generator: NodeGenerator,
scope: IScope,
) {
diff --git a/modules/code-generator/src/utils/nodeToJSX.ts b/modules/code-generator/src/utils/nodeToJSX.ts
index 0b5919902f..d29f28762c 100644
--- a/modules/code-generator/src/utils/nodeToJSX.ts
+++ b/modules/code-generator/src/utils/nodeToJSX.ts
@@ -1,6 +1,6 @@
import _ from 'lodash';
import { pipe } from 'fp-ts/function';
-import { NodeSchema, isNodeSchema, NodeDataType, CompositeValue } from '@alilc/lowcode-types';
+import { IPublicTypeNodeSchema, isNodeSchema, IPublicTypeNodeDataType, IPublicTypeCompositeValue } from '@alilc/lowcode-types';
import {
IScope,
@@ -19,6 +19,7 @@ import { executeFunctionStack } from './aopHelper';
import { encodeJsxStringNode } from './encodeJsxAttrString';
import { unwrapJsExprQuoteInJsx } from './jsxHelpers';
import { transformThis2Context } from '../core/jsx/handlers/transformThis2Context';
+import { isValidIdentifier } from './validate';
function mergeNodeGeneratorConfig(
cfg1: NodeGeneratorConfig,
@@ -57,7 +58,7 @@ export function isPureString(v: string) {
}
function generateAttrValue(
- attrData: { attrName: string; attrValue: CompositeValue },
+ attrData: { attrName: string; attrValue: IPublicTypeCompositeValue },
scope: IScope,
config?: NodeGeneratorConfig,
): CodePiece[] {
@@ -76,7 +77,7 @@ function generateAttrValue(
function generateAttr(
attrName: string,
- attrValue: CompositeValue,
+ attrValue: IPublicTypeCompositeValue,
scope: IScope,
config?: NodeGeneratorConfig,
): CodePiece[] {
@@ -115,7 +116,7 @@ function generateAttr(
}
function generateAttrs(
- nodeItem: NodeSchema,
+ nodeItem: IPublicTypeNodeSchema,
scope: IScope,
config?: NodeGeneratorConfig,
): CodePiece[] {
@@ -126,11 +127,13 @@ function generateAttrs(
if (props) {
if (!Array.isArray(props)) {
Object.keys(props).forEach((propName: string) => {
- pieces = pieces.concat(generateAttr(propName, props[propName], scope, config));
+ if (isValidIdentifier(propName)) {
+ pieces = pieces.concat(generateAttr(propName, props[propName] as IPublicTypeCompositeValue, scope, config));
+ }
});
} else {
props.forEach((prop) => {
- if (prop.name && !prop.spread) {
+ if (prop.name && isValidIdentifier(prop.name) && !prop.spread) {
pieces = pieces.concat(generateAttr(prop.name, prop.value, scope, config));
}
@@ -144,7 +147,7 @@ function generateAttrs(
}
function generateBasicNode(
- nodeItem: NodeSchema,
+ nodeItem: IPublicTypeNodeSchema,
scope: IScope,
config?: NodeGeneratorConfig,
): CodePiece[] {
@@ -160,7 +163,7 @@ function generateBasicNode(
}
function generateSimpleNode(
- nodeItem: NodeSchema,
+ nodeItem: IPublicTypeNodeSchema,
scope: IScope,
config?: NodeGeneratorConfig,
): CodePiece[] {
@@ -182,7 +185,7 @@ function generateSimpleNode(
function linkPieces(pieces: CodePiece[]): string {
const tagsPieces = pieces.filter((p) => p.type === PIECE_TYPE.TAG);
if (tagsPieces.length !== 1) {
- throw new CodeGeneratorError('One node only need one tag define');
+ throw new CodeGeneratorError('Only one tag definition required', tagsPieces);
}
const tagName = tagsPieces[0].value;
@@ -216,13 +219,13 @@ function linkPieces(pieces: CodePiece[]): string {
}
function generateNodeSchema(
- nodeItem: NodeSchema,
+ nodeItem: IPublicTypeNodeSchema,
scope: IScope,
config?: NodeGeneratorConfig,
): string {
const pieces: CodePiece[] = [];
if (config?.nodePlugins) {
- const res = executeFunctionStack(
+ const res = executeFunctionStack(
nodeItem,
scope,
config.nodePlugins,
@@ -247,11 +250,11 @@ function generateNodeSchema(
* @type NodePlugin Extended
*
* @export
- * @param {NodeSchema} nodeItem 当前 UI 节点
+ * @param {IPublicTypeNodeSchema} nodeItem 当前 UI 节点
* @returns {CodePiece[]} 实现功能的相关代码片段
*/
export function generateReactLoopCtrl(
- nodeItem: NodeSchema,
+ nodeItem: IPublicTypeNodeSchema,
scope: IScope,
config?: NodeGeneratorConfig,
next?: NodePlugin,
@@ -270,8 +273,7 @@ export function generateReactLoopCtrl(
const loopDataExpr = pipe(
nodeItem.loop,
// 将 JSExpression 转换为 JS 表达式代码:
- (expr) =>
- generateCompositeType(expr, scope, {
+ (expr) => generateCompositeType(expr, scope, {
handlers: config?.handlers,
tolerateEvalErrors: false, // 这个内部不需要包 try catch, 下面会统一加的
}),
@@ -302,11 +304,11 @@ export function generateReactLoopCtrl(
* @type NodePlugin
*
* @export
- * @param {NodeSchema} nodeItem 当前 UI 节点
+ * @param {IPublicTypeNodeSchema} nodeItem 当前 UI 节点
* @returns {CodePiece[]} 实现功能的相关代码片段
*/
export function generateConditionReactCtrl(
- nodeItem: NodeSchema,
+ nodeItem: IPublicTypeNodeSchema,
scope: IScope,
config?: NodeGeneratorConfig,
next?: NodePlugin,
@@ -337,11 +339,11 @@ export function generateConditionReactCtrl(
* @type NodePlugin
*
* @export
- * @param {NodeSchema} nodeItem 当前 UI 节点
+ * @param {IPublicTypeNodeSchema} nodeItem 当前 UI 节点
* @returns {CodePiece[]} 实现功能的相关代码片段
*/
export function generateReactExprInJS(
- nodeItem: NodeSchema,
+ nodeItem: IPublicTypeNodeSchema,
scope: IScope,
config?: NodeGeneratorConfig,
next?: NodePlugin,
@@ -366,7 +368,7 @@ export function generateReactExprInJS(
const handleChildren = (v: string[]) => v.join('');
export function createNodeGenerator(cfg: NodeGeneratorConfig = {}): NodeGenerator {
- const generateNode = (nodeItem: NodeDataType, scope: IScope): string => {
+ const generateNode = (nodeItem: IPublicTypeNodeDataType, scope: IScope): string => {
if (_.isArray(nodeItem)) {
const resList = nodeItem.map((n) => generateNode(n, scope));
return handleChildren(resList);
@@ -391,8 +393,7 @@ export function createNodeGenerator(cfg: NodeGeneratorConfig = {}): NodeGenerato
return `{${valueStr}}`;
};
- return (nodeItem: NodeDataType, scope: IScope) =>
- unwrapJsExprQuoteInJsx(generateNode(nodeItem, scope));
+ return (nodeItem: IPublicTypeNodeDataType, scope: IScope) => unwrapJsExprQuoteInJsx(generateNode(nodeItem, scope));
}
const defaultReactGeneratorConfig: NodeGeneratorConfig = {
diff --git a/modules/code-generator/src/utils/pathHelper.ts b/modules/code-generator/src/utils/pathHelper.ts
new file mode 100644
index 0000000000..8440089d89
--- /dev/null
+++ b/modules/code-generator/src/utils/pathHelper.ts
@@ -0,0 +1,41 @@
+import { IContextData } from '../types';
+
+function relativePath(from: string[], to: string[]): string[] {
+ const length = Math.min(from.length, to.length);
+ let samePartsLength = length;
+ for (let i = 0; i < length; i++) {
+ if (from[i] !== to[i]) {
+ samePartsLength = i;
+ break;
+ }
+ }
+ if (samePartsLength === 0) {
+ return to;
+ }
+ let outputParts = [];
+ for (let i = samePartsLength; i < from.length; i++) {
+ outputParts.push('..');
+ }
+ outputParts = [...outputParts, ...to.slice(samePartsLength)];
+ if (outputParts[0] !== '..') {
+ outputParts.unshift('.');
+ }
+ return outputParts;
+}
+
+export function getSlotRelativePath(options: {
+ contextData: IContextData;
+ from: string;
+ to: string;
+}) {
+ const { contextData, from, to } = options;
+ const isSingleComponent = contextData?.extraContextData?.projectRemark?.isSingleComponent;
+ const template = contextData?.extraContextData?.template;
+ let toPath = template.slots[to].path;
+ toPath = [...toPath, template.slots[to].fileName!];
+ let fromPath = template.slots[from].path;
+ if (!isSingleComponent && ['components', 'pages'].indexOf(from) !== -1) {
+ fromPath = [...fromPath, 'pageName'];
+ }
+ return relativePath(fromPath, toPath).join('/');
+}
\ No newline at end of file
diff --git a/modules/code-generator/src/utils/schema.ts b/modules/code-generator/src/utils/schema.ts
index b2faecbc64..f9529945eb 100644
--- a/modules/code-generator/src/utils/schema.ts
+++ b/modules/code-generator/src/utils/schema.ts
@@ -1,20 +1,21 @@
import * as _ from 'lodash';
import {
- JSExpression,
- NodeData,
- NodeSchema,
+ IPublicTypeJSExpression,
+ IPublicTypeNodeData,
+ IPublicTypeNodeSchema,
isJSExpression,
isJSSlot,
isDOMText,
- ContainerSchema,
- NpmInfo,
- CompositeValue,
+ IPublicTypeContainerSchema,
+ IPublicTypeNpmInfo,
+ IPublicTypeCompositeValue,
isNodeSchema,
isJSFunction,
} from '@alilc/lowcode-types';
import { CodeGeneratorError } from '../types/error';
+import { isJSExpressionFn } from './common';
-export function isContainerSchema(x: any): x is ContainerSchema {
+export function isContainerSchema(x: any): x is IPublicTypeContainerSchema {
return (
typeof x === 'object' &&
x &&
@@ -23,7 +24,7 @@ export function isContainerSchema(x: any): x is ContainerSchema {
);
}
-export function isNpmInfo(x: any): x is NpmInfo {
+export function isNpmInfo(x: any): x is IPublicTypeNpmInfo {
return typeof x === 'object' && x && typeof x.package === 'string';
}
@@ -43,11 +44,11 @@ const DEFAULT_MAX_DEPTH = 100000;
* @returns
*/
export function handleSubNodes(
- children: NodeSchema['children'],
+ children: IPublicTypeNodeSchema['children'],
handlers: {
string?: (i: string) => T;
- expression?: (i: JSExpression) => T;
- node?: (i: NodeSchema) => T;
+ expression?: (i: IPublicTypeJSExpression) => T;
+ node?: (i: IPublicTypeNodeSchema) => T;
},
options?: {
rerun?: boolean;
@@ -64,7 +65,7 @@ export function handleSubNodes(
}
if (Array.isArray(children)) {
- const list: NodeData[] = children as NodeData[];
+ const list: IPublicTypeNodeData[] = children as IPublicTypeNodeData[];
return list
.map((child) => handleSubNodes(child, handlers, { ...opt, maxDepth: maxDepth - 1 }))
.reduce((p, c) => p.concat(c), []);
@@ -84,7 +85,7 @@ export function handleSubNodes(
return handleSubNodes(children.value, handlers, { ...opt, maxDepth: maxDepth - 1 });
} else if (isNodeSchema(children)) {
const handler = handlers.node || noop;
- const child = children as NodeSchema;
+ const child = children as IPublicTypeNodeSchema;
result = handler(child);
if (child.children) {
@@ -100,7 +101,7 @@ export function handleSubNodes(
});
} else {
Object.values(child.props).forEach((value) => {
- const childRes = handleCompositeValueInProps(value);
+ const childRes = handleCompositeValueInProps(value as IPublicTypeCompositeValue);
childrenRes.push(...childRes);
});
}
@@ -115,7 +116,7 @@ export function handleSubNodes(
return childrenRes;
- function handleCompositeValueInProps(value: CompositeValue): T[] {
+ function handleCompositeValueInProps(value: IPublicTypeCompositeValue): T[] {
if (isJSSlot(value)) {
return handleSubNodes(value.value, handlers, { ...opt, maxDepth: maxDepth - 1 });
}
@@ -125,9 +126,10 @@ export function handleSubNodes(
return _.flatMap(value, (v) => handleCompositeValueInProps(v));
}
- // CompositeObject
+ // IPublicTypeCompositeObject
if (
!isJSExpression(value) &&
+ !isJSExpressionFn(value) &&
!isJSFunction(value) &&
typeof value === 'object' &&
value !== null
@@ -138,3 +140,17 @@ export function handleSubNodes(
return [];
}
}
+
+export function isValidContainerType(schema: IPublicTypeNodeSchema) {
+ return [
+ 'Page',
+ 'Component',
+ 'Block',
+ ].includes(schema.componentName);
+}
+
+export const enum ContainerType {
+ Page = 'Page',
+ Component = 'Component',
+ Block = 'Block',
+}
\ No newline at end of file
diff --git a/modules/code-generator/src/utils/theme.ts b/modules/code-generator/src/utils/theme.ts
new file mode 100644
index 0000000000..590cf711cf
--- /dev/null
+++ b/modules/code-generator/src/utils/theme.ts
@@ -0,0 +1,20 @@
+/**
+ * 获取主题信息
+ * @param theme theme 形如 @alife/theme-97 或者 @alife/theme-97@^1.0.0
+ */
+
+export interface ThemeInfo {
+ name: string;
+ version?: string;
+}
+
+export function getThemeInfo(theme: string): ThemeInfo {
+ const sepIdx = theme.indexOf('@', 1);
+ if (sepIdx === -1) {
+ return { name: theme };
+ }
+ return {
+ name: theme.slice(0, sepIdx),
+ version: theme.slice(sepIdx + 1),
+ };
+}
\ No newline at end of file
diff --git a/modules/code-generator/src/utils/validate.ts b/modules/code-generator/src/utils/validate.ts
index 4ee0d5b2a3..8d6f9c0d1c 100644
--- a/modules/code-generator/src/utils/validate.ts
+++ b/modules/code-generator/src/utils/validate.ts
@@ -2,6 +2,10 @@ export const isValidIdentifier = (name: string) => {
return /^[_$a-zA-Z\xA0-\uFFFF][_$a-zA-Z0-9\xA0-\uFFFF]*$/.test(name);
};
+export const isValidComponentName = (name: string) => {
+ return /^[_$a-zA-Z\xA0-\uFFFF][_$a-zA-Z0-9\xA0-\uFFFF.]*$/.test(name);
+};
+
export const ensureValidClassName = (name: string) => {
if (!isValidIdentifier(name)) {
return `$${name.replace(/[^_$a-zA-Z0-9]/g, '')}`;
diff --git a/modules/code-generator/test-cases/rax-app/demo01/expected/demo-project/package.json b/modules/code-generator/test-cases/rax-app/demo01/expected/demo-project/package.json
deleted file mode 100644
index 38cfdd186a..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo01/expected/demo-project/package.json
+++ /dev/null
@@ -1,29 +0,0 @@
-{
- "name": "rax-demo-app",
- "private": true,
- "version": "1.0.0",
- "scripts": {
- "start": "rax-app start",
- "build": "rax-app build",
- "eslint": "eslint --ext .js,.jsx ./",
- "stylelint": "stylelint \"**/*.{css,scss,less}\"",
- "prettier": "prettier **/* --write",
- "lint": "npm run eslint && npm run stylelint"
- },
- "dependencies": {
- "@alilc/lowcode-datasource-engine": "latest",
- "universal-env": "^3.2.0",
- "intl-messageformat": "^9.3.6",
- "rax": "^1.1.0",
- "rax-document": "^0.1.6",
- "rax-view": "^1.0.0",
- "rax-text": "^1.0.0"
- },
- "devDependencies": {
- "@iceworks/spec": "^1.0.0",
- "rax-app": "^3.0.0",
- "eslint": "^6.8.0",
- "prettier": "^2.1.2",
- "stylelint": "^13.7.2"
- }
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo01/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/rax-app/demo01/expected/demo-project/src/i18n.js
deleted file mode 100644
index 2c28c064ea..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo01/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,68 +0,0 @@
-const i18nConfig = {};
-
-let locale = typeof navigator === 'object' && typeof navigator.language === 'string' ? navigator.language : 'zh-CN';
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === 'object' && (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === 'string' ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? '') : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg = i18nConfig[locale]?.[id] ?? i18nConfig[locale.replace('-', '_')]?.[id] ?? defaultMessage;
- if (msg == null) {
- console.warn('[i18n]: unknown message id: %o (locale=%o)', id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace('-', '_')];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || 'zh_CN'] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/rax-app/demo01/schema.json5 b/modules/code-generator/test-cases/rax-app/demo01/schema.json5
deleted file mode 100644
index 282f979e89..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo01/schema.json5
+++ /dev/null
@@ -1,55 +0,0 @@
-{
- // 本例是一个非常简单的 Hello world 页面
- // Schema 参见：https://yuque.antfin-inc.com/mo/spec/spec-materials#eNCJr
- version: '1.0.0',
- componentsMap: [
- {
- componentName: 'Page',
- package: 'rax-view',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'Page',
- },
- {
- componentName: 'Text',
- package: 'rax-text',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'Text',
- },
- ],
- componentsTree: [
- {
- componentName: 'Page',
- props: {},
- lifeCycles: {},
- fileName: 'home',
- meta: {
- router: '/',
- },
- dataSource: {
- list: [],
- },
- children: [
- {
- componentName: 'Text',
- props: {},
- children: 'Hello world!',
- },
- ],
- },
- ],
- config: {
- sdkVersion: '1.0.3',
- historyMode: 'hash',
- targetRootID: 'root',
- },
- meta: {
- name: 'Rax App Demo',
- git_group: 'demo-group',
- project_name: 'demo-project',
- description: '这是一个示例应用',
- spma: 'spmademo',
- creator: '张三',
- },
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo02/expected/demo-project/package.json b/modules/code-generator/test-cases/rax-app/demo02/expected/demo-project/package.json
deleted file mode 100644
index ca5a0f59cb..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo02/expected/demo-project/package.json
+++ /dev/null
@@ -1,35 +0,0 @@
-{
- "name": "rax-demo-app",
- "private": true,
- "version": "1.0.0",
- "scripts": {
- "start": "rax-app start",
- "build": "rax-app build",
- "eslint": "eslint --ext .js,.jsx ./",
- "stylelint": "stylelint \"**/*.{css,scss,less}\"",
- "prettier": "prettier **/* --write",
- "lint": "npm run eslint && npm run stylelint"
- },
- "dependencies": {
- "@alilc/lowcode-datasource-engine": "latest",
- "@alilc/lowcode-datasource-url-params-handler": "latest",
- "@alilc/lowcode-datasource-fetch-handler": "latest",
- "universal-env": "^3.2.0",
- "intl-messageformat": "^9.3.6",
- "rax": "^1.1.0",
- "rax-document": "^0.1.6",
- "rax-view": "^1.0.0",
- "rax-text": "^1.0.0",
- "rax-image": "^1.0.0",
- "moment": "*",
- "lodash": "*",
- "universal-toast": "^1.2.0"
- },
- "devDependencies": {
- "@iceworks/spec": "^1.0.0",
- "rax-app": "^3.0.0",
- "eslint": "^6.8.0",
- "prettier": "^2.1.2",
- "stylelint": "^13.7.2"
- }
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo02/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/rax-app/demo02/expected/demo-project/src/i18n.js
deleted file mode 100644
index 2c28c064ea..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo02/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,68 +0,0 @@
-const i18nConfig = {};
-
-let locale = typeof navigator === 'object' && typeof navigator.language === 'string' ? navigator.language : 'zh-CN';
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === 'object' && (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === 'string' ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? '') : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg = i18nConfig[locale]?.[id] ?? i18nConfig[locale.replace('-', '_')]?.[id] ?? defaultMessage;
- if (msg == null) {
- console.warn('[i18n]: unknown message id: %o (locale=%o)', id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace('-', '_')];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || 'zh_CN'] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/rax-app/demo02/expected/demo-project/src/pages/Home/index.jsx b/modules/code-generator/test-cases/rax-app/demo02/expected/demo-project/src/pages/Home/index.jsx
deleted file mode 100644
index 7bfda59caf..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo02/expected/demo-project/src/pages/Home/index.jsx
+++ /dev/null
@@ -1,349 +0,0 @@
-// 注意: 出码引擎注入的临时变量默认都以 "__$$" 开头，禁止在搭建的代码中直接访问。
-// 例外：rax 框架的导出名和各种组件名除外。
-import { createElement, Component } from 'rax';
-import { getSearchParams as __$$getSearchParams } from 'rax-app';
-
-import Page from 'rax-view';
-
-import View from 'rax-view';
-
-import Text from 'rax-text';
-
-import Image from 'rax-image';
-
-import { createUrlParamsHandler as __$$createUrlParamsRequestHandler } from '@alilc/lowcode-datasource-url-params-handler';
-
-import { createFetchHandler as __$$createFetchRequestHandler } from '@alilc/lowcode-datasource-fetch-handler';
-
-import { create as __$$createDataSourceEngine } from '@alilc/lowcode-datasource-engine/runtime';
-
-import { isMiniApp as __$$isMiniApp } from 'universal-env';
-
-import __$$constants from '../../constants';
-
-import * as __$$i18n from '../../i18n';
-
-import __$$projectUtils from '../../utils';
-
-import './index.css';
-
-class Home$$Page extends Component {
- state = {
- clickCount: 0,
- user: {
- name: '张三',
- age: 18,
- avatar: 'https://gw.alicdn.com/tfs/TB1Ui9BMkY2gK0jSZFgXXc5OFXa-50-50.png',
- },
- orders: [
- {
- title: '【小米智能生活】米家扫地机器人家用全自动扫拖一体机拖地吸尘器',
- price: 1799,
- coverUrl: 'https://gw.alicdn.com/tfs/TB1dGVlRfb2gK0jSZK9XXaEgFXa-258-130.png',
- },
- {
- title: '【限时下单立减】Apple/苹果 iPhone 11 4G全网通智能手机正品苏宁易购官方旗舰店苹果11',
- price: 4999,
- coverUrl: 'https://gw.alicdn.com/tfs/TB18gdJddTfau8jSZFwXXX1mVXa-1298-1202.png',
- },
- ],
- };
-
- _methods = this._defineMethods();
-
- _context = this._createContext();
-
- _dataSourceConfig = this._defineDataSourceConfig();
- _dataSourceEngine = __$$createDataSourceEngine(this._dataSourceConfig, this._context, {
- runtimeConfig: true,
- requestHandlersMap: {
- urlParams: __$$createUrlParamsRequestHandler(__$$getSearchParams()),
- fetch: __$$createFetchRequestHandler(),
- },
- });
-
- _utils = this._defineUtils();
-
- _lifeCycles = this._defineLifeCycles();
-
- constructor(props, context) {
- super(props);
-
- __$$i18n._inject2(this);
- } /* end of constructor */
-
- componentDidMount() {
- this._dataSourceEngine.reloadDataSource();
-
- this._lifeCycles.didMount();
- } /* end of componentDidMount */
-
- componentWillUnmount() {
- this._lifeCycles.willUnmount();
- } /* end of componentWillUnmount */
-
- render() {
- const __$$context = this._context;
- const {
- state,
- setState,
- dataSourceMap,
- reloadDataSource,
- utils,
- constants,
- i18n,
- i18nFormat,
- getLocale,
- setLocale,
- } = __$$context;
-
- return (
-
-
- Demo data source logic
-
-
- === User Info: ===
-
- {!!__$$eval(() => __$$context.state.user) && (
-
- __$$context.state.user.avatar) }}
- style={{ width: '32px', height: '32px' }}
- />
-
- {__$$eval(() => __$$context.state.user.name)}
- {__$$eval(() => __$$context.state.user.age)}岁
-
-
- )}
-
- === Orders: ===
-
- {__$$evalArray(() => __$$eval(() => __$$context.state.orders)).map((order, index) =>
- ((__$$context) => (
- {
- if (__$$isMiniApp) {
- const __$$event = __$$args[0];
- const order = __$$event.target.dataset.order;
- return function () {
- __$$context.utils.recordEvent(`CLICK_ORDER`, order.title);
- }.apply(this, __$$args);
- } else {
- return function () {
- __$$context.utils.recordEvent(`CLICK_ORDER`, order.title);
- }.apply(this, __$$args);
- }
- }}
- >
-
- order.coverUrl) }} style={{ width: '80px', height: '60px' }} />
-
-
- {__$$eval(() => order.title)}
- {__$$eval(() => __$$context.utils.formatPrice(order.price, '元'))}
-
-
- ))(__$$createChildContext(__$$context, { order, index })),
- )}
-
- 点击次数：{__$$eval(() => __$$context.state.clickCount)}(点击加 1)
-
-
- 操作提示：
- 1. 点击会员名，可以弹出 Toast "Hello xxx!"
- 2. 点击订单，会记录点击的订单信息，并弹出 Toast 提示
- 3. 最下面的【点击次数】，点一次应该加 1
-
-
- );
- } /* end of render */
-
- _createContext() {
- const self = this;
- const context = {
- get state() {
- return self.state;
- },
- setState(newState, callback) {
- self.setState(newState, callback);
- },
- get dataSourceMap() {
- return self._dataSourceEngine.dataSourceMap || {};
- },
- async reloadDataSource() {
- await self._dataSourceEngine.reloadDataSource();
- },
- get utils() {
- return self._utils;
- },
- get page() {
- return context;
- },
- get component() {
- return context;
- },
- get props() {
- return self.props;
- },
- get constants() {
- return __$$constants;
- },
- i18n: __$$i18n.i18n,
- i18nFormat: __$$i18n.i18nFormat,
- getLocale: __$$i18n.getLocale,
- setLocale(locale) {
- __$$i18n.setLocale(locale);
- self.forceUpdate();
- },
- ...this._methods,
- };
-
- return context;
- }
-
- _defineDataSourceConfig() {
- const __$$context = this._context;
- return {
- list: [
- {
- errorHandler: function (err) {
- setTimeout(() => {
- __$$context.setState({
- __refresh: Date.now() + Math.random(),
- });
- }, 0);
- throw err;
- },
- id: 'urlParams',
- type: 'urlParams',
- isInit: true,
- options: function () {
- return undefined;
- },
- },
- {
- errorHandler: function (err) {
- setTimeout(() => {
- __$$context.setState({
- __refresh: Date.now() + Math.random(),
- });
- }, 0);
- throw err;
- },
- id: 'user',
- type: 'fetch',
- options: function () {
- return {
- method: 'GET',
- uri: 'https://shs.xxx.com/mock/1458/demo/user',
- isSync: true,
- };
- },
- dataHandler: function (response) {
- if (!response.success) {
- throw new Error(response.message);
- }
-
- return response.data;
- },
- isInit: true,
- },
- {
- errorHandler: function (err) {
- setTimeout(() => {
- __$$context.setState({
- __refresh: Date.now() + Math.random(),
- });
- }, 0);
- throw err;
- },
- id: 'orders',
- type: 'fetch',
- options: function () {
- return {
- method: 'GET',
- uri: __$$context.state.user.ordersApiUri,
- isSync: true,
- };
- },
- dataHandler: function (response) {
- if (!response.success) {
- throw new Error(response.message);
- }
-
- return response.data.result;
- },
- isInit: true,
- },
- ],
- dataHandler: function (dataMap) {
- console.info('All datasources loaded:', dataMap);
- },
- };
- }
-
- _defineUtils() {
- return {
- ...__$$projectUtils,
- };
- }
-
- _defineLifeCycles() {
- const __$$lifeCycles = {
- didMount: function didMount() {
- this.utils.Toast.show(`Hello ${this.state.user.name}!`);
- },
-
- willUnmount: function didMount() {
- this.utils.Toast.show(`Bye, ${this.state.user.name}!`);
- },
- };
-
- // 为所有的方法绑定上下文
- Object.entries(__$$lifeCycles).forEach(([lifeCycleName, lifeCycleMethod]) => {
- if (typeof lifeCycleMethod === 'function') {
- __$$lifeCycles[lifeCycleName] = (...args) => {
- return lifeCycleMethod.apply(this._context, args);
- };
- }
- });
-
- return __$$lifeCycles;
- }
-
- _defineMethods() {
- return {
- hello: function hello() {
- this.utils.Toast.show(`Hello ${this.state.user.name}!`);
- console.log(`Hello ${this.state.user.name}!`);
- },
- };
- }
-}
-
-export default Home$$Page;
-
-function __$$eval(expr) {
- try {
- return expr();
- } catch (error) {}
-}
-
-function __$$evalArray(expr) {
- const res = __$$eval(expr);
- return Array.isArray(res) ? res : [];
-}
-
-function __$$createChildContext(oldContext, ext) {
- return Object.assign({}, oldContext, ext);
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo02/schema.json5 b/modules/code-generator/test-cases/rax-app/demo02/schema.json5
deleted file mode 100644
index fa39cdb45d..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo02/schema.json5
+++ /dev/null
@@ -1,375 +0,0 @@
-{
- // 本例是一个比较复杂的，带有循环和条件渲染的，以及有各种事件处理函数的页面
- // Schema 参见：https://yuque.antfin-inc.com/mo/spec/spec-materials#eNCJr
- version: '1.0.0',
- componentsMap: [
- {
- componentName: 'View',
- package: 'rax-view',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'View',
- },
- {
- componentName: 'Text',
- package: 'rax-text',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'Text',
- },
- {
- componentName: 'Image',
- package: 'rax-image',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'Image',
- },
- {
- componentName: 'Page',
- package: 'rax-view',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'Page',
- },
- ],
- componentsTree: [
- {
- componentName: 'Page',
- fileName: 'home',
- meta: {
- router: '/',
- },
- state: {
- clickCount: 0,
- user: { name: '张三', age: 18, avatar: 'https://gw.alicdn.com/tfs/TB1Ui9BMkY2gK0jSZFgXXc5OFXa-50-50.png' },
- orders: [
- {
- title: '【小米智能生活】米家扫地机器人家用全自动扫拖一体机拖地吸尘器',
- price: 1799,
- coverUrl: 'https://gw.alicdn.com/tfs/TB1dGVlRfb2gK0jSZK9XXaEgFXa-258-130.png',
- },
- {
- title: '【限时下单立减】Apple/苹果 iPhone 11 4G全网通智能手机正品苏宁易购官方旗舰店苹果11',
- price: 4999,
- coverUrl: 'https://gw.alicdn.com/tfs/TB18gdJddTfau8jSZFwXXX1mVXa-1298-1202.png',
- },
- ],
- },
- props: {},
- lifeCycles: {
- didMount: {
- type: 'JSExpression',
- value: 'function didMount(){\n this.utils.Toast.show(`Hello ${this.state.user.name}!`);\n}',
- },
- willUnmount: {
- type: 'JSExpression',
- value: 'function didMount(){\n this.utils.Toast.show(`Bye, ${this.state.user.name}!`);\n}',
- },
- },
- methods: {
- hello: {
- type: 'JSExpression',
- value: 'function hello(){\n this.utils.Toast.show(`Hello ${this.state.user.name}!`);\n console.log(`Hello ${this.state.user.name}!`); }',
- },
- },
- dataSource: {
- list: [
- {
- id: 'urlParams',
- type: 'urlParams',
- },
- // 示例数据源：https://shs.xxx.com/mock/1458/demo/user
- {
- id: 'user',
- type: 'fetch',
- options: {
- method: 'GET',
- uri: 'https://shs.xxx.com/mock/1458/demo/user',
- isSync: true,
- },
- dataHandler: {
- type: 'JSExpression',
- value: 'function (response) {\nif (!response.success){\n throw new Error(response.message);\n }\n return response.data;\n}',
- },
- },
- // 示例数据源：https://shs.xxx.com/mock/1458/demo/orders
- {
- id: 'orders',
- type: 'fetch',
- options: {
- method: 'GET',
- uri: {
- type: 'JSExpression',
- value: 'this.state.user.ordersApiUri',
- },
- isSync: true,
- },
- dataHandler: {
- type: 'JSExpression',
- value: 'function (response) {\nif (!response.success){\n throw new Error(response.message);\n }\n return response.data.result;\n}',
- },
- },
- ],
- dataHandler: {
- type: 'JSExpression',
- value: 'function (dataMap) {\n console.info("All datasources loaded:", dataMap);\n}',
- },
- },
- children: [
- {
- componentName: 'View',
- children: [
- {
- componentName: 'Text',
- props: {},
- children: 'Demo data source logic',
- },
- ],
- },
- {
- componentName: 'View',
- children: [
- {
- componentName: 'Text',
- props: {},
- children: '=== User Info: ===',
- },
- ],
- },
- {
- componentName: 'View',
- condition: {
- type: 'JSExpression',
- value: 'this.state.user',
- },
- props: {
- style: { flexDirection: 'row' },
- },
- children: [
- {
- componentName: 'Image',
- props: {
- source: {
- uri: {
- type: 'JSExpression',
- value: 'this.state.user.avatar',
- },
- },
- style: {
- width: '32px',
- height: '32px',
- },
- },
- },
- {
- componentName: 'View',
- props: {
- onClick: {
- type: 'JSExpression',
- value: 'this.hello',
- },
- },
- children: [
- {
- componentName: 'Text',
- children: {
- type: 'JSExpression',
- value: 'this.state.user.name',
- },
- },
- {
- componentName: 'Text',
- children: [
- {
- type: 'JSExpression',
- value: 'this.state.user.age',
- },
- '岁',
- ],
- },
- ],
- },
- ],
- },
- {
- componentName: 'View',
- children: [
- {
- componentName: 'Text',
- props: {},
- children: '=== Orders: ===',
- },
- ],
- },
- {
- componentName: 'View',
- loop: {
- type: 'JSExpression',
- value: 'this.state.orders',
- },
- loopArgs: ['order', 'index'],
- props: {
- style: { flexDirection: 'row' },
- onClick: {
- type: 'JSExpression',
- value: 'function(){ this.utils.recordEvent(`CLICK_ORDER`, this.order.title) }',
- },
- },
- children: [
- {
- componentName: 'View',
- children: [
- {
- componentName: 'Image',
- props: {
- source: {
- uri: {
- type: 'JSExpression',
- value: 'this.order.coverUrl',
- },
- },
- style: {
- width: '80px',
- height: '60px',
- },
- },
- },
- ],
- },
- {
- componentName: 'View',
- children: [
- {
- componentName: 'Text',
- children: {
- type: 'JSExpression',
- value: 'this.order.title',
- },
- },
- {
- componentName: 'Text',
- children: {
- type: 'JSExpression',
- value: 'this.utils.formatPrice(this.order.price, "元")',
- },
- },
- ],
- },
- ],
- },
- {
- componentName: 'View',
- props: {
- onClick: {
- type: 'JSExpression',
- value: 'function (){ this.setState({ clickCount: this.state.clickCount + 1 }) }',
- },
- },
- children: [
- {
- componentName: 'Text',
- children: [
- '点击次数：',
- {
- type: 'JSExpression',
- value: 'this.state.clickCount',
- },
- '(点击加 1)',
- ],
- },
- ],
- },
- {
- componentName: 'View',
- children: [
- {
- componentName: 'Text',
- props: {},
- children: '操作提示：',
- },
- {
- componentName: 'Text',
- props: {},
- children: '1. 点击会员名，可以弹出 Toast "Hello xxx!"',
- },
- {
- componentName: 'Text',
- props: {},
- children: '2. 点击订单，会记录点击的订单信息，并弹出 Toast 提示',
- },
- {
- componentName: 'Text',
- props: {},
- children: '3. 最下面的【点击次数】，点一次应该加 1',
- },
- ],
- },
- ],
- },
- ],
- utils: [
- // 可以直接定义一个函数
- {
- name: 'formatPrice',
- type: 'function',
- content: {
- type: 'JSExpression',
- value: 'function formatPrice(price, unit) { return Number(price).toFixed(2) + unit; }',
- },
- },
- // 在 utils 里面也可以用 this 访问当前上下文:
- {
- name: 'recordEvent',
- type: 'function',
- content: {
- type: 'JSExpression',
- value: 'function recordEvent(eventName, eventDetail) { \n this.utils.Toast.show(`[EVENT]: ${eventName} ${eventDetail}`);\n console.log(`[EVENT]: ${eventName} (detail: %o) (user: %o)`, eventDetail, this.state.user); }',
- },
- },
- // 也可以直接从 npm 包引入 (下例等价于 `import moment from 'moment';`)
- {
- name: 'moment',
- type: 'npm',
- content: {
- package: 'moment',
- version: '*',
- exportName: 'moment',
- },
- },
- // 可以引入子目录（下例等价于 `import clone from 'lodash/clone';`)
- {
- name: 'clone',
- type: 'npm',
- content: {
- package: 'lodash',
- version: '*',
- exportName: 'clone',
- destructuring: false,
- main: '/clone',
- },
- },
- {
- name: 'Toast',
- type: 'npm',
- content: {
- package: 'universal-toast',
- version: '^1.2.0',
- exportName: 'Toast', // TODO: 这个 exportName 是否可以省略？省略后默认是上一层的 name？
- },
- },
- ],
- css: 'page,body{\n width: 750rpx;\n overflow-x: hidden;\n}',
- config: {
- sdkVersion: '1.0.3',
- historyMode: 'hash',
- targetRootID: 'root',
- },
- meta: {
- name: 'Rax App Demo',
- git_group: 'demo-group',
- project_name: 'demo-project',
- description: '这是一个示例应用',
- spma: 'spmademo',
- creator: '张三',
- },
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo03/expected/demo-project/package.json b/modules/code-generator/test-cases/rax-app/demo03/expected/demo-project/package.json
deleted file mode 100644
index 48690ff4d9..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo03/expected/demo-project/package.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
- "name": "rax-demo-app",
- "private": true,
- "version": "1.0.0",
- "scripts": {
- "start": "rax-app start",
- "build": "rax-app build",
- "eslint": "eslint --ext .js,.jsx ./",
- "stylelint": "stylelint \"**/*.{css,scss,less}\"",
- "prettier": "prettier **/* --write",
- "lint": "npm run eslint && npm run stylelint"
- },
- "dependencies": {
- "@alilc/lowcode-datasource-engine": "latest",
- "universal-env": "^3.2.0",
- "intl-messageformat": "^9.3.6",
- "rax": "^1.1.0",
- "rax-document": "^0.1.6",
- "rax-view": "^1.0.0",
- "rax-text": "^1.0.0",
- "rax-link": "^1.0.0"
- },
- "devDependencies": {
- "@iceworks/spec": "^1.0.0",
- "rax-app": "^3.0.0",
- "eslint": "^6.8.0",
- "prettier": "^2.1.2",
- "stylelint": "^13.7.2"
- }
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo03/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/rax-app/demo03/expected/demo-project/src/i18n.js
deleted file mode 100644
index 2c28c064ea..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo03/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,68 +0,0 @@
-const i18nConfig = {};
-
-let locale = typeof navigator === 'object' && typeof navigator.language === 'string' ? navigator.language : 'zh-CN';
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === 'object' && (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === 'string' ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? '') : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg = i18nConfig[locale]?.[id] ?? i18nConfig[locale.replace('-', '_')]?.[id] ?? defaultMessage;
- if (msg == null) {
- console.warn('[i18n]: unknown message id: %o (locale=%o)', id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace('-', '_')];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || 'zh_CN'] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/rax-app/demo03/schema.json5 b/modules/code-generator/test-cases/rax-app/demo03/schema.json5
deleted file mode 100644
index 5652b1db1a..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo03/schema.json5
+++ /dev/null
@@ -1,176 +0,0 @@
-{
- // 本例是一个路由测试页面，里面有几个页面，相互之间有跳转关系的
- // Schema 参见：https://yuque.antfin-inc.com/mo/spec/spec-materials#eNCJr
- version: '1.0.0',
- componentsMap: [
- {
- componentName: 'View',
- package: 'rax-view',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'View',
- },
- {
- componentName: 'Text',
- package: 'rax-text',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'Text',
- },
- {
- componentName: 'Link',
- package: 'rax-link',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'Link',
- },
- {
- componentName: 'Image',
- package: 'rax-image',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'Image',
- },
- {
- componentName: 'Page',
- package: 'rax-view',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'Page',
- },
- ],
- componentsTree: [
- {
- componentName: 'Page',
- fileName: 'home',
- state: {},
- dataSource: {
- list: [],
- },
- meta: {
- router: '/',
- },
- children: [
- {
- componentName: 'View',
- children: [
- {
- componentName: 'Text',
- children: 'This is the Home Page',
- },
- ],
- },
- {
- componentName: 'Link',
- props: {
- href: '#/list',
- miniappHref: 'navigate:/pages/List/index',
- },
- children: [
- {
- componentName: 'Text',
- children: 'Go To The List Page',
- },
- ],
- },
- ],
- },
- {
- componentName: 'Page',
- fileName: 'list',
- state: {},
- dataSource: {
- list: [],
- },
- meta: {
- router: '/list',
- },
- children: [
- {
- componentName: 'View',
- children: [
- {
- componentName: 'Text',
- children: 'This is the List Page',
- },
- ],
- },
- {
- componentName: 'Link',
- props: {
- href: '#/detail',
- miniappHref: 'navigate:/pages/Detail/index',
- },
- children: [
- {
- componentName: 'Text',
- children: 'Go To The Detail Page',
- },
- ],
- },
- {
- componentName: 'Link',
- props: {
- href: 'javascript:history.back();',
- miniappHref: 'navigateBack:',
- },
- children: [
- {
- componentName: 'Text',
- children: 'Go back',
- },
- ],
- },
- ],
- },
- {
- componentName: 'Page',
- fileName: 'detail',
- state: {},
- dataSource: {
- list: [],
- },
- meta: {
- router: '/detail',
- },
- children: [
- {
- componentName: 'View',
- children: [
- {
- componentName: 'Text',
- children: 'This is the Detail Page',
- },
- ],
- },
- {
- componentName: 'Link',
- props: {
- href: 'javascript:history.back();',
- miniappHref: 'navigateBack:',
- },
- children: [
- {
- componentName: 'Text',
- children: 'Go back',
- },
- ],
- },
- ],
- },
- ],
- css: 'page,body{\n width: 750rpx;\n overflow-x: hidden;\n}',
- config: {
- sdkVersion: '1.0.3',
- historyMode: 'hash',
- targetRootID: 'root',
- },
- meta: {
- name: 'Rax App Demo',
- git_group: 'demo-group',
- project_name: 'demo-project',
- description: '这是一个示例应用',
- spma: 'spmademo',
- creator: '张三',
- },
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo04/expected/demo-project/package.json b/modules/code-generator/test-cases/rax-app/demo04/expected/demo-project/package.json
deleted file mode 100644
index 16fa70bbc1..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo04/expected/demo-project/package.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
- "name": "rax-demo-app",
- "private": true,
- "version": "1.0.0",
- "scripts": {
- "start": "rax-app start",
- "build": "rax-app build",
- "eslint": "eslint --ext .js,.jsx ./",
- "stylelint": "stylelint \"**/*.{css,scss,less}\"",
- "prettier": "prettier **/* --write",
- "lint": "npm run eslint && npm run stylelint"
- },
- "dependencies": {
- "@alilc/lowcode-datasource-engine": "latest",
- "universal-env": "^3.2.0",
- "intl-messageformat": "^9.3.6",
- "rax": "^1.1.0",
- "rax-document": "^0.1.6",
- "rax-view": "^1.0.0",
- "@alife/right-design-card": "*",
- "rax-text": "^1.0.0"
- },
- "devDependencies": {
- "@iceworks/spec": "^1.0.0",
- "rax-app": "^3.0.0",
- "eslint": "^6.8.0",
- "prettier": "^2.1.2",
- "stylelint": "^13.7.2"
- }
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo04/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/rax-app/demo04/expected/demo-project/src/i18n.js
deleted file mode 100644
index 2c28c064ea..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo04/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,68 +0,0 @@
-const i18nConfig = {};
-
-let locale = typeof navigator === 'object' && typeof navigator.language === 'string' ? navigator.language : 'zh-CN';
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === 'object' && (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === 'string' ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? '') : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg = i18nConfig[locale]?.[id] ?? i18nConfig[locale.replace('-', '_')]?.[id] ?? defaultMessage;
- if (msg == null) {
- console.warn('[i18n]: unknown message id: %o (locale=%o)', id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace('-', '_')];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || 'zh_CN'] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/rax-app/demo05/expected/demo-project/package.json b/modules/code-generator/test-cases/rax-app/demo05/expected/demo-project/package.json
deleted file mode 100644
index 38cfdd186a..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo05/expected/demo-project/package.json
+++ /dev/null
@@ -1,29 +0,0 @@
-{
- "name": "rax-demo-app",
- "private": true,
- "version": "1.0.0",
- "scripts": {
- "start": "rax-app start",
- "build": "rax-app build",
- "eslint": "eslint --ext .js,.jsx ./",
- "stylelint": "stylelint \"**/*.{css,scss,less}\"",
- "prettier": "prettier **/* --write",
- "lint": "npm run eslint && npm run stylelint"
- },
- "dependencies": {
- "@alilc/lowcode-datasource-engine": "latest",
- "universal-env": "^3.2.0",
- "intl-messageformat": "^9.3.6",
- "rax": "^1.1.0",
- "rax-document": "^0.1.6",
- "rax-view": "^1.0.0",
- "rax-text": "^1.0.0"
- },
- "devDependencies": {
- "@iceworks/spec": "^1.0.0",
- "rax-app": "^3.0.0",
- "eslint": "^6.8.0",
- "prettier": "^2.1.2",
- "stylelint": "^13.7.2"
- }
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo05/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/rax-app/demo05/expected/demo-project/src/i18n.js
deleted file mode 100644
index acf6cd388b..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo05/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,75 +0,0 @@
-const i18nConfig = {
- 'zh-CN': {
- 'hello-world': '你好，世界！',
- },
- 'en-US': {
- 'hello-world': 'Hello world!',
- },
-};
-
-let locale = typeof navigator === 'object' && typeof navigator.language === 'string' ? navigator.language : 'zh-CN';
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === 'object' && (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === 'string' ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? '') : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg = i18nConfig[locale]?.[id] ?? i18nConfig[locale.replace('-', '_')]?.[id] ?? defaultMessage;
- if (msg == null) {
- console.warn('[i18n]: unknown message id: %o (locale=%o)', id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace('-', '_')];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || 'zh_CN'] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/rax-app/demo05/schema.json5 b/modules/code-generator/test-cases/rax-app/demo05/schema.json5
deleted file mode 100644
index 3c767dfd9b..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo05/schema.json5
+++ /dev/null
@@ -1,73 +0,0 @@
-{
- // 这是一个关于国际化的 schema 示例
- // Schema 参见：https://yuque.antfin-inc.com/mo/spec/spec-materials#eNCJr
- version: '1.0.0',
- componentsMap: [
- {
- componentName: 'Page',
- package: 'rax-view',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'Page',
- },
- {
- componentName: 'Text',
- package: 'rax-text',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'Text',
- },
- ],
- componentsTree: [
- {
- componentName: 'Page',
- props: {},
- lifeCycles: {},
- fileName: 'home',
- meta: {
- router: '/',
- },
- dataSource: {
- list: [],
- },
- children: [
- {
- componentName: 'Text',
- props: {
- onClick: {
- type: 'JSFunction',
- value: "function () {\n this.setLocale(this.getLocale() === 'en-US' ? 'zh-CN' : 'en-US');\n}",
- },
- },
- children: [
- {
- type: 'JSExpression',
- value: 'this.i18n["hello-world"]',
- },
- ],
- },
- ],
- },
- ],
- i18n: {
- 'zh-CN': {
- 'hello-world': '你好，世界！',
- },
- 'en-US': {
- 'hello-world': 'Hello world!',
- },
- },
- config: {
- sdkVersion: '1.0.3',
- historyMode: 'hash',
- targetRootID: 'root',
- },
- meta: {
- name: 'Rax App Demo',
- git_group: 'demo-group',
- project_name: 'demo-project',
- description: '这是一个示例应用',
- spma: 'spmademo',
- creator: '张三',
- },
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo06-jsslot/expected/demo-project/package.json b/modules/code-generator/test-cases/rax-app/demo06-jsslot/expected/demo-project/package.json
deleted file mode 100644
index bf31a967ea..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo06-jsslot/expected/demo-project/package.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
- "name": "rax-demo-app",
- "private": true,
- "version": "1.0.0",
- "scripts": {
- "start": "rax-app start",
- "build": "rax-app build",
- "eslint": "eslint --ext .js,.jsx ./",
- "stylelint": "stylelint \"**/*.{css,scss,less}\"",
- "prettier": "prettier **/* --write",
- "lint": "npm run eslint && npm run stylelint"
- },
- "dependencies": {
- "@alilc/lowcode-datasource-engine": "latest",
- "universal-env": "^3.2.0",
- "intl-messageformat": "^9.3.6",
- "rax": "^1.1.0",
- "rax-document": "^0.1.6",
- "rax-view": "^1.0.0",
- "rax-table": "^1.0.0",
- "rax-text": "^1.0.0"
- },
- "devDependencies": {
- "@iceworks/spec": "^1.0.0",
- "rax-app": "^3.0.0",
- "eslint": "^6.8.0",
- "prettier": "^2.1.2",
- "stylelint": "^13.7.2"
- }
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo06-jsslot/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/rax-app/demo06-jsslot/expected/demo-project/src/i18n.js
deleted file mode 100644
index acf6cd388b..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo06-jsslot/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,75 +0,0 @@
-const i18nConfig = {
- 'zh-CN': {
- 'hello-world': '你好，世界！',
- },
- 'en-US': {
- 'hello-world': 'Hello world!',
- },
-};
-
-let locale = typeof navigator === 'object' && typeof navigator.language === 'string' ? navigator.language : 'zh-CN';
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === 'object' && (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === 'string' ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? '') : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg = i18nConfig[locale]?.[id] ?? i18nConfig[locale.replace('-', '_')]?.[id] ?? defaultMessage;
- if (msg == null) {
- console.warn('[i18n]: unknown message id: %o (locale=%o)', id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace('-', '_')];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || 'zh_CN'] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/rax-app/demo07-newline-in-props/expected/demo-project/package.json b/modules/code-generator/test-cases/rax-app/demo07-newline-in-props/expected/demo-project/package.json
deleted file mode 100644
index 38cfdd186a..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo07-newline-in-props/expected/demo-project/package.json
+++ /dev/null
@@ -1,29 +0,0 @@
-{
- "name": "rax-demo-app",
- "private": true,
- "version": "1.0.0",
- "scripts": {
- "start": "rax-app start",
- "build": "rax-app build",
- "eslint": "eslint --ext .js,.jsx ./",
- "stylelint": "stylelint \"**/*.{css,scss,less}\"",
- "prettier": "prettier **/* --write",
- "lint": "npm run eslint && npm run stylelint"
- },
- "dependencies": {
- "@alilc/lowcode-datasource-engine": "latest",
- "universal-env": "^3.2.0",
- "intl-messageformat": "^9.3.6",
- "rax": "^1.1.0",
- "rax-document": "^0.1.6",
- "rax-view": "^1.0.0",
- "rax-text": "^1.0.0"
- },
- "devDependencies": {
- "@iceworks/spec": "^1.0.0",
- "rax-app": "^3.0.0",
- "eslint": "^6.8.0",
- "prettier": "^2.1.2",
- "stylelint": "^13.7.2"
- }
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo07-newline-in-props/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/rax-app/demo07-newline-in-props/expected/demo-project/src/i18n.js
deleted file mode 100644
index acf6cd388b..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo07-newline-in-props/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,75 +0,0 @@
-const i18nConfig = {
- 'zh-CN': {
- 'hello-world': '你好，世界！',
- },
- 'en-US': {
- 'hello-world': 'Hello world!',
- },
-};
-
-let locale = typeof navigator === 'object' && typeof navigator.language === 'string' ? navigator.language : 'zh-CN';
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === 'object' && (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === 'string' ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? '') : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg = i18nConfig[locale]?.[id] ?? i18nConfig[locale.replace('-', '_')]?.[id] ?? defaultMessage;
- if (msg == null) {
- console.warn('[i18n]: unknown message id: %o (locale=%o)', id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace('-', '_')];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || 'zh_CN'] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/rax-app/demo08-jsslot-with-multiple-children/expected/demo-project/package.json b/modules/code-generator/test-cases/rax-app/demo08-jsslot-with-multiple-children/expected/demo-project/package.json
deleted file mode 100644
index bf31a967ea..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo08-jsslot-with-multiple-children/expected/demo-project/package.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
- "name": "rax-demo-app",
- "private": true,
- "version": "1.0.0",
- "scripts": {
- "start": "rax-app start",
- "build": "rax-app build",
- "eslint": "eslint --ext .js,.jsx ./",
- "stylelint": "stylelint \"**/*.{css,scss,less}\"",
- "prettier": "prettier **/* --write",
- "lint": "npm run eslint && npm run stylelint"
- },
- "dependencies": {
- "@alilc/lowcode-datasource-engine": "latest",
- "universal-env": "^3.2.0",
- "intl-messageformat": "^9.3.6",
- "rax": "^1.1.0",
- "rax-document": "^0.1.6",
- "rax-view": "^1.0.0",
- "rax-table": "^1.0.0",
- "rax-text": "^1.0.0"
- },
- "devDependencies": {
- "@iceworks/spec": "^1.0.0",
- "rax-app": "^3.0.0",
- "eslint": "^6.8.0",
- "prettier": "^2.1.2",
- "stylelint": "^13.7.2"
- }
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo08-jsslot-with-multiple-children/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/rax-app/demo08-jsslot-with-multiple-children/expected/demo-project/src/i18n.js
deleted file mode 100644
index acf6cd388b..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo08-jsslot-with-multiple-children/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,75 +0,0 @@
-const i18nConfig = {
- 'zh-CN': {
- 'hello-world': '你好，世界！',
- },
- 'en-US': {
- 'hello-world': 'Hello world!',
- },
-};
-
-let locale = typeof navigator === 'object' && typeof navigator.language === 'string' ? navigator.language : 'zh-CN';
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === 'object' && (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === 'string' ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? '') : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg = i18nConfig[locale]?.[id] ?? i18nConfig[locale.replace('-', '_')]?.[id] ?? defaultMessage;
- if (msg == null) {
- console.warn('[i18n]: unknown message id: %o (locale=%o)', id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace('-', '_')];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || 'zh_CN'] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/rax-app/demo09-jsslot-with-conditional-children/expected/demo-project/package.json b/modules/code-generator/test-cases/rax-app/demo09-jsslot-with-conditional-children/expected/demo-project/package.json
deleted file mode 100644
index bf31a967ea..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo09-jsslot-with-conditional-children/expected/demo-project/package.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
- "name": "rax-demo-app",
- "private": true,
- "version": "1.0.0",
- "scripts": {
- "start": "rax-app start",
- "build": "rax-app build",
- "eslint": "eslint --ext .js,.jsx ./",
- "stylelint": "stylelint \"**/*.{css,scss,less}\"",
- "prettier": "prettier **/* --write",
- "lint": "npm run eslint && npm run stylelint"
- },
- "dependencies": {
- "@alilc/lowcode-datasource-engine": "latest",
- "universal-env": "^3.2.0",
- "intl-messageformat": "^9.3.6",
- "rax": "^1.1.0",
- "rax-document": "^0.1.6",
- "rax-view": "^1.0.0",
- "rax-table": "^1.0.0",
- "rax-text": "^1.0.0"
- },
- "devDependencies": {
- "@iceworks/spec": "^1.0.0",
- "rax-app": "^3.0.0",
- "eslint": "^6.8.0",
- "prettier": "^2.1.2",
- "stylelint": "^13.7.2"
- }
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo09-jsslot-with-conditional-children/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/rax-app/demo09-jsslot-with-conditional-children/expected/demo-project/src/i18n.js
deleted file mode 100644
index acf6cd388b..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo09-jsslot-with-conditional-children/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,75 +0,0 @@
-const i18nConfig = {
- 'zh-CN': {
- 'hello-world': '你好，世界！',
- },
- 'en-US': {
- 'hello-world': 'Hello world!',
- },
-};
-
-let locale = typeof navigator === 'object' && typeof navigator.language === 'string' ? navigator.language : 'zh-CN';
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === 'object' && (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === 'string' ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? '') : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg = i18nConfig[locale]?.[id] ?? i18nConfig[locale.replace('-', '_')]?.[id] ?? defaultMessage;
- if (msg == null) {
- console.warn('[i18n]: unknown message id: %o (locale=%o)', id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace('-', '_')];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || 'zh_CN'] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/rax-app/demo10-jsslot-with-loop-children/expected/demo-project/package.json b/modules/code-generator/test-cases/rax-app/demo10-jsslot-with-loop-children/expected/demo-project/package.json
deleted file mode 100644
index bf31a967ea..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo10-jsslot-with-loop-children/expected/demo-project/package.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
- "name": "rax-demo-app",
- "private": true,
- "version": "1.0.0",
- "scripts": {
- "start": "rax-app start",
- "build": "rax-app build",
- "eslint": "eslint --ext .js,.jsx ./",
- "stylelint": "stylelint \"**/*.{css,scss,less}\"",
- "prettier": "prettier **/* --write",
- "lint": "npm run eslint && npm run stylelint"
- },
- "dependencies": {
- "@alilc/lowcode-datasource-engine": "latest",
- "universal-env": "^3.2.0",
- "intl-messageformat": "^9.3.6",
- "rax": "^1.1.0",
- "rax-document": "^0.1.6",
- "rax-view": "^1.0.0",
- "rax-table": "^1.0.0",
- "rax-text": "^1.0.0"
- },
- "devDependencies": {
- "@iceworks/spec": "^1.0.0",
- "rax-app": "^3.0.0",
- "eslint": "^6.8.0",
- "prettier": "^2.1.2",
- "stylelint": "^13.7.2"
- }
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo10-jsslot-with-loop-children/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/rax-app/demo10-jsslot-with-loop-children/expected/demo-project/src/i18n.js
deleted file mode 100644
index acf6cd388b..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo10-jsslot-with-loop-children/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,75 +0,0 @@
-const i18nConfig = {
- 'zh-CN': {
- 'hello-world': '你好，世界！',
- },
- 'en-US': {
- 'hello-world': 'Hello world!',
- },
-};
-
-let locale = typeof navigator === 'object' && typeof navigator.language === 'string' ? navigator.language : 'zh-CN';
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === 'object' && (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === 'string' ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? '') : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg = i18nConfig[locale]?.[id] ?? i18nConfig[locale.replace('-', '_')]?.[id] ?? defaultMessage;
- if (msg == null) {
- console.warn('[i18n]: unknown message id: %o (locale=%o)', id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace('-', '_')];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || 'zh_CN'] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/rax-app/demo11-utils-name-alias/expected/demo-project/package.json b/modules/code-generator/test-cases/rax-app/demo11-utils-name-alias/expected/demo-project/package.json
deleted file mode 100644
index 60f0cb38a1..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo11-utils-name-alias/expected/demo-project/package.json
+++ /dev/null
@@ -1,33 +0,0 @@
-{
- "name": "rax-demo-app",
- "private": true,
- "version": "1.0.0",
- "scripts": {
- "start": "rax-app start",
- "build": "rax-app build",
- "eslint": "eslint --ext .js,.jsx ./",
- "stylelint": "stylelint \"**/*.{css,scss,less}\"",
- "prettier": "prettier **/* --write",
- "lint": "npm run eslint && npm run stylelint"
- },
- "dependencies": {
- "@alilc/lowcode-datasource-engine": "latest",
- "@alilc/lowcode-datasource-url-params-handler": "latest",
- "universal-env": "^3.2.0",
- "intl-messageformat": "^9.3.6",
- "rax": "^1.1.0",
- "rax-document": "^0.1.6",
- "@alilc/b6-page": "^0.1.0",
- "@alilc/b6-text": "^0.1.0",
- "@alilc/b6-compact-legao-builtin": "1.x",
- "antd": "3.x",
- "@alilc/b6-util-mocks": "1.x"
- },
- "devDependencies": {
- "@iceworks/spec": "^1.0.0",
- "rax-app": "^3.0.0",
- "eslint": "^6.8.0",
- "prettier": "^2.1.2",
- "stylelint": "^13.7.2"
- }
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo11-utils-name-alias/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/rax-app/demo11-utils-name-alias/expected/demo-project/src/i18n.js
deleted file mode 100644
index 2c28c064ea..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo11-utils-name-alias/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,68 +0,0 @@
-const i18nConfig = {};
-
-let locale = typeof navigator === 'object' && typeof navigator.language === 'string' ? navigator.language : 'zh-CN';
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === 'object' && (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === 'string' ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? '') : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg = i18nConfig[locale]?.[id] ?? i18nConfig[locale.replace('-', '_')]?.[id] ?? defaultMessage;
- if (msg == null) {
- console.warn('[i18n]: unknown message id: %o (locale=%o)', id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace('-', '_')];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || 'zh_CN'] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/rax-app/demo12-refs/expected/demo-project/package.json b/modules/code-generator/test-cases/rax-app/demo12-refs/expected/demo-project/package.json
deleted file mode 100644
index 38cfdd186a..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo12-refs/expected/demo-project/package.json
+++ /dev/null
@@ -1,29 +0,0 @@
-{
- "name": "rax-demo-app",
- "private": true,
- "version": "1.0.0",
- "scripts": {
- "start": "rax-app start",
- "build": "rax-app build",
- "eslint": "eslint --ext .js,.jsx ./",
- "stylelint": "stylelint \"**/*.{css,scss,less}\"",
- "prettier": "prettier **/* --write",
- "lint": "npm run eslint && npm run stylelint"
- },
- "dependencies": {
- "@alilc/lowcode-datasource-engine": "latest",
- "universal-env": "^3.2.0",
- "intl-messageformat": "^9.3.6",
- "rax": "^1.1.0",
- "rax-document": "^0.1.6",
- "rax-view": "^1.0.0",
- "rax-text": "^1.0.0"
- },
- "devDependencies": {
- "@iceworks/spec": "^1.0.0",
- "rax-app": "^3.0.0",
- "eslint": "^6.8.0",
- "prettier": "^2.1.2",
- "stylelint": "^13.7.2"
- }
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo12-refs/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/rax-app/demo12-refs/expected/demo-project/src/i18n.js
deleted file mode 100644
index acf6cd388b..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo12-refs/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,75 +0,0 @@
-const i18nConfig = {
- 'zh-CN': {
- 'hello-world': '你好，世界！',
- },
- 'en-US': {
- 'hello-world': 'Hello world!',
- },
-};
-
-let locale = typeof navigator === 'object' && typeof navigator.language === 'string' ? navigator.language : 'zh-CN';
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === 'object' && (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === 'string' ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? '') : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg = i18nConfig[locale]?.[id] ?? i18nConfig[locale.replace('-', '_')]?.[id] ?? defaultMessage;
- if (msg == null) {
- console.warn('[i18n]: unknown message id: %o (locale=%o)', id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace('-', '_')];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || 'zh_CN'] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/rax-app/demo12-refs/schema.json5 b/modules/code-generator/test-cases/rax-app/demo12-refs/schema.json5
deleted file mode 100644
index 4f5f5db7f2..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo12-refs/schema.json5
+++ /dev/null
@@ -1,74 +0,0 @@
-{
- // 这是一个关于国际化的 schema 示例
- // Schema 参见：https://yuque.antfin-inc.com/mo/spec/spec-materials#eNCJr
- version: '1.0.0',
- componentsMap: [
- {
- componentName: 'Page',
- package: 'rax-view',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'Page',
- },
- {
- componentName: 'Text',
- package: 'rax-text',
- version: '^1.0.0',
- destructuring: false,
- exportName: 'Text',
- },
- ],
- componentsTree: [
- {
- componentName: 'Page',
- props: {},
- lifeCycles: {},
- fileName: 'home',
- meta: {
- router: '/',
- },
- dataSource: {
- list: [],
- },
- children: [
- {
- componentName: 'Text',
- props: {
- ref: 'helloText',
- onClick: {
- type: 'JSFunction',
- value: "function () {\n this.setLocale(this.getLocale() === 'en-US' ? 'zh-CN' : 'en-US');\n}",
- },
- },
- children: [
- {
- type: 'JSExpression',
- value: 'this.i18n["hello-world"]',
- },
- ],
- },
- ],
- },
- ],
- i18n: {
- 'zh-CN': {
- 'hello-world': '你好，世界！',
- },
- 'en-US': {
- 'hello-world': 'Hello world!',
- },
- },
- config: {
- sdkVersion: '1.0.3',
- historyMode: 'hash',
- targetRootID: 'root',
- },
- meta: {
- name: 'Rax App Demo',
- git_group: 'demo-group',
- project_name: 'demo-project',
- description: '这是一个示例应用',
- spma: 'spmademo',
- creator: '张三',
- },
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo13-datasource-prop/expected/demo-project/package.json b/modules/code-generator/test-cases/rax-app/demo13-datasource-prop/expected/demo-project/package.json
deleted file mode 100644
index 3e59d29844..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo13-datasource-prop/expected/demo-project/package.json
+++ /dev/null
@@ -1,29 +0,0 @@
-{
- "name": "rax-demo-app",
- "private": true,
- "version": "1.0.0",
- "scripts": {
- "start": "rax-app start",
- "build": "rax-app build",
- "eslint": "eslint --ext .js,.jsx ./",
- "stylelint": "stylelint \"**/*.{css,scss,less}\"",
- "prettier": "prettier **/* --write",
- "lint": "npm run eslint && npm run stylelint"
- },
- "dependencies": {
- "@alilc/lowcode-datasource-engine": "latest",
- "@alilc/lowcode-datasource-http-handler": "latest",
- "universal-env": "^3.2.0",
- "intl-messageformat": "^9.3.6",
- "rax": "^1.1.0",
- "rax-document": "^0.1.6",
- "@alilc/lowcode-components": "^1.0.0"
- },
- "devDependencies": {
- "@iceworks/spec": "^1.0.0",
- "rax-app": "^3.0.0",
- "eslint": "^6.8.0",
- "prettier": "^2.1.2",
- "stylelint": "^13.7.2"
- }
-}
diff --git a/modules/code-generator/test-cases/rax-app/demo13-datasource-prop/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/rax-app/demo13-datasource-prop/expected/demo-project/src/i18n.js
deleted file mode 100644
index 2c28c064ea..0000000000
--- a/modules/code-generator/test-cases/rax-app/demo13-datasource-prop/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,68 +0,0 @@
-const i18nConfig = {};
-
-let locale = typeof navigator === 'object' && typeof navigator.language === 'string' ? navigator.language : 'zh-CN';
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === 'object' && (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === 'string' ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? '') : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg = i18nConfig[locale]?.[id] ?? i18nConfig[locale.replace('-', '_')]?.[id] ?? defaultMessage;
- if (msg == null) {
- console.warn('[i18n]: unknown message id: %o (locale=%o)', id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace('-', '_')];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || 'zh_CN'] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/react-app/demo1/expected/demo-project/package.json b/modules/code-generator/test-cases/react-app/demo1/expected/demo-project/package.json
deleted file mode 100644
index 767ec3898f..0000000000
--- a/modules/code-generator/test-cases/react-app/demo1/expected/demo-project/package.json
+++ /dev/null
@@ -1,43 +0,0 @@
-{
- "name": "icejs-demo-app",
- "version": "0.1.5",
- "description": "轻量级模板，使用 JavaScript，仅包含基础的 Layout。",
- "dependencies": {
- "moment": "^2.24.0",
- "react": "^16.4.1",
- "react-dom": "^16.4.1",
- "react-router": "^5.2.1",
- "@alifd/theme-design-pro": "^0.x",
- "intl-messageformat": "^9.3.6",
- "@ice/store": "^1.4.3",
- "@loadable/component": "^5.15.2",
- "@alilc/lowcode-datasource-engine": "latest",
- "@alilc/lowcode-datasource-url-params-handler": "latest",
- "@alilc/lowcode-datasource-fetch-handler": "latest",
- "@alifd/next": "1.19.18"
- },
- "devDependencies": {
- "@ice/spec": "^1.0.0",
- "build-plugin-fusion": "^0.1.0",
- "build-plugin-moment-locales": "^0.1.0",
- "eslint": "^6.0.1",
- "ice.js": "^1.0.0",
- "stylelint": "^13.2.0"
- },
- "scripts": {
- "start": "icejs start",
- "build": "icejs build",
- "lint": "npm run eslint && npm run stylelint",
- "eslint": "eslint --cache --ext .js,.jsx ./",
- "stylelint": "stylelint ./**/*.scss"
- },
- "ideMode": { "name": "ice-react" },
- "iceworks": { "type": "react", "adapter": "adapter-react-v3" },
- "engines": { "node": ">=8.0.0" },
- "repository": {
- "type": "git",
- "url": "http://gitlab.xxx.com/msd/leak-scan/tree/master"
- },
- "private": true,
- "originTemplate": "@alifd/scaffold-lite-js"
-}
diff --git a/modules/code-generator/test-cases/react-app/demo1/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/react-app/demo1/expected/demo-project/src/i18n.js
deleted file mode 100644
index 60e05915d9..0000000000
--- a/modules/code-generator/test-cases/react-app/demo1/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,77 +0,0 @@
-const i18nConfig = {};
-
-let locale =
- typeof navigator === "object" && typeof navigator.language === "string"
- ? navigator.language
- : "zh-CN";
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === "object" &&
- (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === "string"
- ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? "")
- : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg =
- i18nConfig[locale]?.[id] ??
- i18nConfig[locale.replace("-", "_")]?.[id] ??
- defaultMessage;
- if (msg == null) {
- console.warn("[i18n]: unknown message id: %o (locale=%o)", id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace("-", "_")];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || "zh_CN"] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/react-app/demo1/expected/demo-project/src/pages/Test/index.jsx b/modules/code-generator/test-cases/react-app/demo1/expected/demo-project/src/pages/Test/index.jsx
deleted file mode 100644
index 2f53ec4558..0000000000
--- a/modules/code-generator/test-cases/react-app/demo1/expected/demo-project/src/pages/Test/index.jsx
+++ /dev/null
@@ -1,191 +0,0 @@
-// 注意: 出码引擎注入的临时变量默认都以 "__$$" 开头，禁止在搭建的代码中直接访问。
-// 例外：react 框架的导出名和各种组件名除外。
-import React from "react";
-
-import { Form, Input, NumberPicker, Select, Button } from "@alifd/next";
-
-import { createUrlParamsHandler as __$$createUrlParamsRequestHandler } from "@alilc/lowcode-datasource-url-params-handler";
-
-import { createFetchHandler as __$$createFetchRequestHandler } from "@alilc/lowcode-datasource-fetch-handler";
-
-import { create as __$$createDataSourceEngine } from "@alilc/lowcode-datasource-engine/runtime";
-
-import utils, { RefsManager } from "../../utils";
-
-import * as __$$i18n from "../../i18n";
-
-import "./index.css";
-
-class Test$$Page extends React.Component {
- _context = this;
-
- _dataSourceConfig = this._defineDataSourceConfig();
- _dataSourceEngine = __$$createDataSourceEngine(this._dataSourceConfig, this, {
- runtimeConfig: true,
- requestHandlersMap: {
- urlParams: __$$createUrlParamsRequestHandler(window.location.search),
- fetch: __$$createFetchRequestHandler(),
- },
- });
-
- get dataSourceMap() {
- return this._dataSourceEngine.dataSourceMap || {};
- }
-
- reloadDataSource = async () => {
- await this._dataSourceEngine.reloadDataSource();
- };
-
- constructor(props, context) {
- super(props);
-
- this.utils = utils;
-
- this._refsManager = new RefsManager();
-
- __$$i18n._inject2(this);
-
- this.state = { text: "outter" };
- }
-
- $ = (refName) => {
- return this._refsManager.get(refName);
- };
-
- $$ = (refName) => {
- return this._refsManager.getAll(refName);
- };
-
- _defineDataSourceConfig() {
- const _this = this;
- return {
- list: [
- {
- id: "urlParams",
- type: "urlParams",
- isInit: function () {
- return undefined;
- },
- options: function () {
- return undefined;
- },
- },
- {
- id: "user",
- type: "fetch",
- options: function () {
- return {
- method: "GET",
- uri: "https://shs.xxx.com/mock/1458/demo/user",
- isSync: true,
- };
- },
- dataHandler: function (response) {
- if (!response.data.success) {
- throw new Error(response.data.message);
- }
-
- return response.data.data;
- },
- isInit: function () {
- return undefined;
- },
- },
- {
- id: "orders",
- type: "fetch",
- options: function () {
- return {
- method: "GET",
- uri: "https://shs.xxx.com/mock/1458/demo/orders",
- isSync: true,
- };
- },
- dataHandler: function (response) {
- if (!response.data.success) {
- throw new Error(response.data.message);
- }
-
- return response.data.data.result;
- },
- isInit: function () {
- return undefined;
- },
- },
- ],
- dataHandler: function (dataMap) {
- console.info("All datasources loaded:", dataMap);
- },
- };
- }
-
- componentDidMount() {
- this._dataSourceEngine.reloadDataSource();
-
- console.log("componentDidMount");
- }
-
- render() {
- const __$$context = this._context || this;
- const { state } = __$$context;
- return (
-
+
+ {siteConfig.title}
+欢迎光临 低代码引擎文档站
+{siteConfig.tagline}
+
+
+ 快速开始
+
+
+
+ Alibaba Fusion
+
+ © 2019-现在 Alibaba Fusion & ICE
+
+
+ {image && 
}
+ {text}
+
+
+ );
+}
+ `,
+ );
+
+ return [['src', 'layouts', 'BasicLayout', 'components', 'Logo'], file];
+}
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/template/files/src/layouts/BasicLayout/components/Logo/index.style.ts b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/src/layouts/BasicLayout/components/Logo/index.style.ts
new file mode 100644
index 0000000000..dfd00dd3e0
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/src/layouts/BasicLayout/components/Logo/index.style.ts
@@ -0,0 +1,31 @@
+import { ResultFile } from '@alilc/lowcode-types';
+import { createResultFile } from '../../../../../../../../../../../utils/resultHelper';
+
+export default function getFile(): [string[], ResultFile] {
+ const file = createResultFile(
+ 'index',
+ 'module.scss',
+ `
+.logo{
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: #FF7300;
+ font-weight: bold;
+ font-size: 14px;
+ line-height: 22px;
+
+ &:visited, &:link {
+ color: #FF7300;
+ }
+
+ img {
+ height: 24px;
+ margin-right: 10px;
+ }
+}
+ `,
+ );
+
+ return [['src', 'layouts', 'BasicLayout', 'components', 'Logo'], file];
+}
diff --git a/modules/code-generator/src/plugins/project/framework/icejs3/template/files/src/layouts/BasicLayout/components/PageNav/index.jsx.ts b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/src/layouts/BasicLayout/components/PageNav/index.jsx.ts
new file mode 100644
index 0000000000..1713057566
--- /dev/null
+++ b/modules/code-generator/src/plugins/project/framework/icejs3/template/files/src/layouts/BasicLayout/components/PageNav/index.jsx.ts
@@ -0,0 +1,79 @@
+import { ResultFile } from '@alilc/lowcode-types';
+import { createResultFile } from '../../../../../../../../../../../utils/resultHelper';
+
+export default function getFile(): [string[], ResultFile] {
+ const file = createResultFile(
+ 'index',
+ 'jsx',
+ `import React from 'react';
+import PropTypes from 'prop-types';
+import { Link, useLocation } from 'ice';
+import { Nav } from '@alifd/next';
+import { asideMenuConfig } from '../../menuConfig';
+
+const { SubNav } = Nav;
+const NavItem = Nav.Item;
+
+function getNavMenuItems(menusData) {
+ if (!menusData) {
+ return [];
+ }
+
+ return menusData
+ .filter(item => item.name && !item.hideInMenu)
+ .map((item, index) => getSubMenuOrItem(item, index));
+}
+
+function getSubMenuOrItem(item, index) {
+ if (item.children && item.children.some(child => child.name)) {
+ const childrenItems = getNavMenuItems(item.children);
+
+ if (childrenItems && childrenItems.length > 0) {
+ const subNav = (
+
-
-
- );
- }
-}
-
-export default Test$$Page;
-
-function __$$eval(expr) {
- try {
- return expr();
- } catch (error) {}
-}
-
-function __$$evalArray(expr) {
- const res = __$$eval(expr);
- return Array.isArray(res) ? res : [];
-}
-
-function __$$createChildContext(oldContext, ext) {
- const childContext = {
- ...oldContext,
- ...ext,
- };
- childContext.__proto__ = oldContext;
- return childContext;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo1/schema.json5 b/modules/code-generator/test-cases/react-app/demo1/schema.json5
deleted file mode 100644
index 5a1cfc4d9a..0000000000
--- a/modules/code-generator/test-cases/react-app/demo1/schema.json5
+++ /dev/null
@@ -1,276 +0,0 @@
-{
- "version": "1.0.0",
- "componentsMap": [
- {
- "componentName": "Button",
- "package": "@alifd/next",
- "version": "1.19.18",
- "destructuring": true,
- "exportName": "Button"
- },
- {
- "componentName": "Button.Group",
- "package": "@alifd/next",
- "version": "1.19.18",
- "destructuring": true,
- "exportName": "Button",
- "subName": "Group"
- },
- {
- "componentName": "Input",
- "package": "@alifd/next",
- "version": "1.19.18",
- "destructuring": true,
- "exportName": "Input"
- },
- {
- "componentName": "Form",
- "package": "@alifd/next",
- "version": "1.19.18",
- "destructuring": true,
- "exportName": "Form"
- },
- {
- "componentName": "Form.Item",
- "package": "@alifd/next",
- "version": "1.19.18",
- "destructuring": true,
- "exportName": "Form",
- "subName": "Item"
- },
- {
- "componentName": "NumberPicker",
- "package": "@alifd/next",
- "version": "1.19.18",
- "destructuring": true,
- "exportName": "NumberPicker"
- },
- {
- "componentName": "Select",
- "package": "@alifd/next",
- "version": "1.19.18",
- "destructuring": true,
- "exportName": "Select"
- }
- ],
- "componentsTree": [
- {
- "componentName": "Page",
- "id": "node$1",
- "meta": {
- "title": "测试",
- "router": "/"
- },
- "props": {
- "ref": "outterView",
- "autoLoading": true
- },
- "fileName": "test",
- "state": {
- "text": "outter"
- },
- "lifeCycles": {
- "componentDidMount": {
- "type": "JSExpression",
- "value": "function() { console.log('componentDidMount'); }"
- }
- },
- dataSource: {
- list: [
- {
- id: 'urlParams',
- type: 'urlParams',
- },
- // 示例数据源：https://shs.xxx.com/mock/1458/demo/user
- {
- id: 'user',
- type: 'fetch',
- options: {
- method: 'GET',
- uri: 'https://shs.xxx.com/mock/1458/demo/user',
- isSync: true,
- },
- dataHandler: {
- type: 'JSExpression',
- value: 'function (response) {\nif (!response.data.success){\n throw new Error(response.data.message);\n }\n return response.data.data;\n}',
- },
- },
- // 示例数据源：https://shs.xxx.com/mock/1458/demo/orders
- {
- id: 'orders',
- type: 'fetch',
- options: {
- method: 'GET',
- uri: "https://shs.xxx.com/mock/1458/demo/orders",
- isSync: true,
- },
- dataHandler: {
- type: 'JSExpression',
- value: 'function (response) {\nif (!response.data.success){\n throw new Error(response.data.message);\n }\n return response.data.data.result;\n}',
- },
- },
- ],
- dataHandler: {
- type: 'JSExpression',
- value: 'function (dataMap) {\n console.info("All datasources loaded:", dataMap);\n}',
- },
- },
- "children": [
- {
- "componentName": "Form",
- "id": "node$2",
- "props": {
- "labelCol": {
- "type": "JSExpression",
- "value": "this.state.colNum"
- },
- "style": {},
- "ref": "testForm"
- },
- "children": [
- {
- "componentName": "Form.Item",
- "id": "node$3",
- "props": {
- "label": "姓名：",
- "name": "name",
- "initValue": "李雷"
- },
- "children": [
- {
- "componentName": "Input",
- "id": "node$4",
- "props": {
- "placeholder": "请输入",
- "size": "medium",
- "style": {
- "width": 320
- }
- }
- }
- ]
- },
- {
- "componentName": "Form.Item",
- "id": "node$5",
- "props": {
- "label": "年龄：",
- "name": "age",
- "initValue": "22"
- },
- "children": [
- {
- "componentName": "NumberPicker",
- "id": "node$6",
- "props": {
- "size": "medium",
- "type": "normal"
- }
- }
- ]
- },
- {
- "componentName": "Form.Item",
- "id": "node$7",
- "props": {
- "label": "职业：",
- "name": "profession"
- },
- "children": [
- {
- "componentName": "Select",
- "id": "node$8",
- "props": {
- "dataSource": [
- {
- "label": "教师",
- "value": "t"
- },
- {
- "label": "医生",
- "value": "d"
- },
- {
- "label": "歌手",
- "value": "s"
- }
- ]
- }
- }
- ]
- },
- {
- "componentName": "Div",
- "id": "node$9",
- "props": {
- "style": {
- "textAlign": "center"
- }
- },
- "children": [
- {
- "componentName": "Button.Group",
- "id": "node$a",
- "props": {},
- "children": [
- {
- "componentName": "Button",
- "id": "node$b",
- "condition": {
- "type": "JSExpression",
- "value": "this.index >= 1"
- },
- "loop": ["a", "b", "c"],
- "props": {
- "type": "primary",
- "style": {
- "margin": "0 5px 0 5px"
- },
- },
- "children": [
- {
- "type": "JSExpression",
- "value": "this.item"
- }
- ]
- }
- ]
- }
- ]
- }
- ]
- }
- ]
- }
- ],
- "constants": {
- "ENV": "prod",
- "DOMAIN": "xxx.xxx.com"
- },
- "css": "body {font-size: 12px;} .table { width: 100px;}",
- "config": {
- "sdkVersion": "1.0.3",
- "historyMode": "hash",
- "targetRootID": "J_Container",
- "layout": {
- "componentName": "BasicLayout",
- "props": {
- "logo": "...",
- "name": "测试网站"
- }
- },
- "theme": {
- "package": "@alife/theme-fusion",
- "version": "^0.1.0",
- "primary": "#ff9966"
- }
- },
- "meta": {
- "name": "demo应用",
- "git_group": "appGroup",
- "project_name": "app_demo",
- "description": "这是一个测试应用",
- "spma": "spa23d",
- "creator": "月飞"
- }
-}
diff --git a/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/package.json b/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/package.json
deleted file mode 100644
index df2e306244..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/package.json
+++ /dev/null
@@ -1,46 +0,0 @@
-{
- "name": "icejs-demo-app",
- "version": "0.1.5",
- "description": "轻量级模板，使用 JavaScript，仅包含基础的 Layout。",
- "dependencies": {
- "moment": "^2.24.0",
- "react": "^16.4.1",
- "react-dom": "^16.4.1",
- "react-router": "^5.2.1",
- "@alifd/theme-design-pro": "^0.x",
- "intl-messageformat": "^9.3.6",
- "@ice/store": "^1.4.3",
- "@loadable/component": "^5.15.2",
- "@alilc/lowcode-datasource-engine": "latest",
- "@alilc/lowcode-datasource-url-params-handler": "latest",
- "@alilc/b6-page": "^0.1.0",
- "@alilc/b6-text": "^0.1.0",
- "@alilc/b6-compact-legao-builtin": "1.x",
- "antd": "3.x",
- "@alilc/b6-util-mocks": "1.x"
- },
- "devDependencies": {
- "@ice/spec": "^1.0.0",
- "build-plugin-fusion": "^0.1.0",
- "build-plugin-moment-locales": "^0.1.0",
- "eslint": "^6.0.1",
- "ice.js": "^1.0.0",
- "stylelint": "^13.2.0"
- },
- "scripts": {
- "start": "icejs start",
- "build": "icejs build",
- "lint": "npm run eslint && npm run stylelint",
- "eslint": "eslint --cache --ext .js,.jsx ./",
- "stylelint": "stylelint ./**/*.scss"
- },
- "ideMode": { "name": "ice-react" },
- "iceworks": { "type": "react", "adapter": "adapter-react-v3" },
- "engines": { "node": ">=8.0.0" },
- "repository": {
- "type": "git",
- "url": "http://gitlab.xxx.com/msd/leak-scan/tree/master"
- },
- "private": true,
- "originTemplate": "@alifd/scaffold-lite-js"
-}
diff --git a/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/app.js b/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/app.js
deleted file mode 100644
index fb01b106b4..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/app.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { createApp } from "ice";
-
-const appConfig = {
- app: {
- rootId: "app",
- },
- router: {
- type: "hash",
- },
-};
-createApp(appConfig);
diff --git a/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/global.scss b/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/global.scss
deleted file mode 100644
index cc339ce97b..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/global.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-// 引入默认全局样式
-@import "@alifd/next/reset.scss";
-
-body {
- -webkit-font-smoothing: antialiased;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/i18n.js
deleted file mode 100644
index 60e05915d9..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,77 +0,0 @@
-const i18nConfig = {};
-
-let locale =
- typeof navigator === "object" && typeof navigator.language === "string"
- ? navigator.language
- : "zh-CN";
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === "object" &&
- (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === "string"
- ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? "")
- : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg =
- i18nConfig[locale]?.[id] ??
- i18nConfig[locale.replace("-", "_")]?.[id] ??
- defaultMessage;
- if (msg == null) {
- console.warn("[i18n]: unknown message id: %o (locale=%o)", id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace("-", "_")];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || "zh_CN"] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/pages/Aaaa/index.jsx b/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/pages/Aaaa/index.jsx
deleted file mode 100644
index a4751b6f7f..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/pages/Aaaa/index.jsx
+++ /dev/null
@@ -1,112 +0,0 @@
-// 注意: 出码引擎注入的临时变量默认都以 "__$$" 开头，禁止在搭建的代码中直接访问。
-// 例外：react 框架的导出名和各种组件名除外。
-import React from "react";
-
-import { Page } from "@alilc/b6-page";
-
-import { Text } from "@alilc/b6-text";
-
-import { createUrlParamsHandler as __$$createUrlParamsRequestHandler } from "@alilc/lowcode-datasource-url-params-handler";
-
-import { create as __$$createDataSourceEngine } from "@alilc/lowcode-datasource-engine/runtime";
-
-import utils from "../../utils";
-
-import * as __$$i18n from "../../i18n";
-
-import "./index.css";
-
-class Aaaa$$Page extends React.Component {
- _context = this;
-
- _dataSourceConfig = this._defineDataSourceConfig();
- _dataSourceEngine = __$$createDataSourceEngine(this._dataSourceConfig, this, {
- runtimeConfig: true,
- requestHandlersMap: {
- urlParams: __$$createUrlParamsRequestHandler(window.location.search),
- },
- });
-
- get dataSourceMap() {
- return this._dataSourceEngine.dataSourceMap || {};
- }
-
- reloadDataSource = async () => {
- await this._dataSourceEngine.reloadDataSource();
- };
-
- constructor(props, context) {
- super(props);
-
- this.utils = utils;
-
- __$$i18n._inject2(this);
-
- this.state = {};
- }
-
- $ = () => null;
-
- $$ = () => [];
-
- _defineDataSourceConfig() {
- const _this = this;
- return {
- list: [
- {
- id: "urlParams",
- type: "urlParams",
- description: "URL参数",
- options: function () {
- return {
- uri: "",
- };
- },
- isInit: function () {
- return undefined;
- },
- },
- ],
- };
- }
-
- componentDidMount() {
- this._dataSourceEngine.reloadDataSource();
- }
-
- render() {
- const __$$context = this._context || this;
- const { state } = __$$context;
- return (
-
-
- );
- }
-}
-
-export default Aaaa$$Page;
-
-function __$$eval(expr) {
- try {
- return expr();
- } catch (error) {}
-}
-
-function __$$evalArray(expr) {
- const res = __$$eval(expr);
- return Array.isArray(res) ? res : [];
-}
-
-function __$$createChildContext(oldContext, ext) {
- const childContext = {
- ...oldContext,
- ...ext,
- };
- childContext.__proto__ = oldContext;
- return childContext;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/routes.js b/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/routes.js
deleted file mode 100644
index 00dbd626f4..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/routes.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import Aaaa from "@/pages/Aaaa";
-
-import BasicLayout from "@/layouts/BasicLayout";
-
-const routerConfig = [
- {
- path: "/",
- component: BasicLayout,
- children: [
- {
- path: "/aaaa",
- component: Aaaa,
- },
- ],
- },
-];
-
-export default routerConfig;
diff --git a/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/utils.js b/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/utils.js
deleted file mode 100644
index 8b08776e3f..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2-utils-name-alias/expected/demo-project/src/utils.js
+++ /dev/null
@@ -1,61 +0,0 @@
-import legaoBuiltin from "@alilc/b6-compact-legao-builtin";
-
-import { message, Modal as modal } from "antd";
-
-import { mocks } from "@alilc/b6-util-mocks";
-
-import { createRef } from "react";
-
-export class RefsManager {
- constructor() {
- this.refInsStore = {};
- }
-
- clearNullRefs() {
- Object.keys(this.refInsStore).forEach((refName) => {
- const filteredInsList = this.refInsStore[refName].filter(
- (insRef) => !!insRef.current
- );
- if (filteredInsList.length > 0) {
- this.refInsStore[refName] = filteredInsList;
- } else {
- delete this.refInsStore[refName];
- }
- });
- }
-
- get(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName][0].current;
- }
-
- return null;
- }
-
- getAll(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName].map((i) => i.current);
- }
-
- return [];
- }
-
- linkRef(refName) {
- const refIns = createRef();
- this.refInsStore[refName] = this.refInsStore[refName] || [];
- this.refInsStore[refName].push(refIns);
- return refIns;
- }
-}
-
-export default {
- legaoBuiltin,
-
- message,
-
- mocks,
-
- modal,
-};
diff --git a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/package.json b/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/package.json
deleted file mode 100644
index b3eeeae4e2..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/package.json
+++ /dev/null
@@ -1,41 +0,0 @@
-{
- "name": "icejs-demo-app",
- "version": "0.1.5",
- "description": "轻量级模板，使用 JavaScript，仅包含基础的 Layout。",
- "dependencies": {
- "moment": "^2.24.0",
- "react": "^16.4.1",
- "react-dom": "^16.4.1",
- "react-router": "^5.2.1",
- "@alifd/theme-design-pro": "^0.x",
- "intl-messageformat": "^9.3.6",
- "@ice/store": "^1.4.3",
- "@loadable/component": "^5.15.2",
- "@alilc/lowcode-datasource-engine": "latest",
- "@alifd/next": "1.19.18"
- },
- "devDependencies": {
- "@ice/spec": "^1.0.0",
- "build-plugin-fusion": "^0.1.0",
- "build-plugin-moment-locales": "^0.1.0",
- "eslint": "^6.0.1",
- "ice.js": "^1.0.0",
- "stylelint": "^13.2.0"
- },
- "scripts": {
- "start": "icejs start",
- "build": "icejs build",
- "lint": "npm run eslint && npm run stylelint",
- "eslint": "eslint --cache --ext .js,.jsx ./",
- "stylelint": "stylelint ./**/*.scss"
- },
- "ideMode": { "name": "ice-react" },
- "iceworks": { "type": "react", "adapter": "adapter-react-v3" },
- "engines": { "node": ">=8.0.0" },
- "repository": {
- "type": "git",
- "url": "http://gitlab.xxx.com/msd/leak-scan/tree/master"
- },
- "private": true,
- "originTemplate": "@alifd/scaffold-lite-js"
-}
diff --git a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/app.js b/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/app.js
deleted file mode 100644
index fb01b106b4..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/app.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { createApp } from "ice";
-
-const appConfig = {
- app: {
- rootId: "app",
- },
- router: {
- type: "hash",
- },
-};
-createApp(appConfig);
diff --git a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/constants.js b/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/constants.js
deleted file mode 100644
index c4a5859ee4..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/constants.js
+++ /dev/null
@@ -1,3 +0,0 @@
-const __$$constants = { ENV: "prod", DOMAIN: "xxx.xxx.com" };
-
-export default __$$constants;
diff --git a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/global.scss b/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/global.scss
deleted file mode 100644
index 2d97c56b09..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/global.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-// 引入默认全局样式
-@import "@alifd/next/reset.scss";
-
-body {
- -webkit-font-smoothing: antialiased;
-}
-
-body {
- font-size: 12px;
-}
-.table {
- width: 100px;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/i18n.js
deleted file mode 100644
index 3f0a822cee..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,86 +0,0 @@
-const i18nConfig = {
- "zh-CN": {
- "i18n-jwg27yo4": "你好",
- "i18n-jwg27yo3": "中国",
- },
- "en-US": {
- "i18n-jwg27yo4": "Hello",
- "i18n-jwg27yo3": "China",
- },
-};
-
-let locale =
- typeof navigator === "object" && typeof navigator.language === "string"
- ? navigator.language
- : "zh-CN";
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === "object" &&
- (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === "string"
- ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? "")
- : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg =
- i18nConfig[locale]?.[id] ??
- i18nConfig[locale.replace("-", "_")]?.[id] ??
- defaultMessage;
- if (msg == null) {
- console.warn("[i18n]: unknown message id: %o (locale=%o)", id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace("-", "_")];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || "zh_CN"] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/pages/Test/index.jsx b/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/pages/Test/index.jsx
deleted file mode 100644
index eda8c2fbe5..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/pages/Test/index.jsx
+++ /dev/null
@@ -1,113 +0,0 @@
-// 注意: 出码引擎注入的临时变量默认都以 "__$$" 开头，禁止在搭建的代码中直接访问。
-// 例外：react 框架的导出名和各种组件名除外。
-import React from "react";
-
-import { Form, Input, NumberPicker, Select, Button } from "@alifd/next";
-
-import utils, { RefsManager } from "../../utils";
-
-import * as __$$i18n from "../../i18n";
-
-import "./index.css";
-
-class Test$$Page extends React.Component {
- _context = this;
-
- constructor(props, context) {
- super(props);
-
- this.utils = utils;
-
- this._refsManager = new RefsManager();
-
- __$$i18n._inject2(this);
-
- this.state = { text: "outter" };
- }
-
- $ = (refName) => {
- return this._refsManager.get(refName);
- };
-
- $$ = (refName) => {
- return this._refsManager.getAll(refName);
- };
-
- componentDidMount() {
- console.log("componentDidMount");
- }
-
- render() {
- const __$$context = this._context || this;
- const { state } = __$$context;
- return (
-
-
-
- );
- }
-}
-
-export default Test$$Page;
-
-function __$$eval(expr) {
- try {
- return expr();
- } catch (error) {}
-}
-
-function __$$evalArray(expr) {
- const res = __$$eval(expr);
- return Array.isArray(res) ? res : [];
-}
-
-function __$$createChildContext(oldContext, ext) {
- const childContext = {
- ...oldContext,
- ...ext,
- };
- childContext.__proto__ = oldContext;
- return childContext;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/routes.js b/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/routes.js
deleted file mode 100644
index e6b7426d47..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/routes.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import Test from "@/pages/Test";
-
-import BasicLayout from "@/layouts/BasicLayout";
-
-const routerConfig = [
- {
- path: "/",
- component: BasicLayout,
- children: [
- {
- path: "/",
- component: Test,
- },
- ],
- },
-];
-
-export default routerConfig;
diff --git a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/utils.js b/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/utils.js
deleted file mode 100644
index 3d3ca9a81c..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2/expected/demo-project/src/utils.js
+++ /dev/null
@@ -1,47 +0,0 @@
-import { createRef } from "react";
-
-export class RefsManager {
- constructor() {
- this.refInsStore = {};
- }
-
- clearNullRefs() {
- Object.keys(this.refInsStore).forEach((refName) => {
- const filteredInsList = this.refInsStore[refName].filter(
- (insRef) => !!insRef.current
- );
- if (filteredInsList.length > 0) {
- this.refInsStore[refName] = filteredInsList;
- } else {
- delete this.refInsStore[refName];
- }
- });
- }
-
- get(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName][0].current;
- }
-
- return null;
- }
-
- getAll(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName].map((i) => i.current);
- }
-
- return [];
- }
-
- linkRef(refName) {
- const refIns = createRef();
- this.refInsStore[refName] = this.refInsStore[refName] || [];
- this.refInsStore[refName].push(refIns);
- return refIns;
- }
-}
-
-export default {};
diff --git a/modules/code-generator/test-cases/react-app/demo2/schema.json5 b/modules/code-generator/test-cases/react-app/demo2/schema.json5
deleted file mode 100644
index 8678b4e925..0000000000
--- a/modules/code-generator/test-cases/react-app/demo2/schema.json5
+++ /dev/null
@@ -1,256 +0,0 @@
-{
- "version": "1.0.0",
- "componentsMap": [
- {
- "componentName": "Button",
- "package": "@alifd/next",
- "version": "1.19.18",
- "destructuring": true,
- "exportName": "Button"
- },
- {
- "componentName": "Button.Group",
- "package": "@alifd/next",
- "version": "1.19.18",
- "destructuring": true,
- "exportName": "Button",
- "subName": "Group"
- },
- {
- "componentName": "Input",
- "package": "@alifd/next",
- "version": "1.19.18",
- "destructuring": true,
- "exportName": "Input"
- },
- {
- "componentName": "Form",
- "package": "@alifd/next",
- "version": "1.19.18",
- "destructuring": true,
- "exportName": "Form"
- },
- {
- "componentName": "Form.Item",
- "package": "@alifd/next",
- "version": "1.19.18",
- "destructuring": true,
- "exportName": "Form",
- "subName": "Item"
- },
- {
- "componentName": "NumberPicker",
- "package": "@alifd/next",
- "version": "1.19.18",
- "destructuring": true,
- "exportName": "NumberPicker"
- },
- {
- "componentName": "Select",
- "package": "@alifd/next",
- "version": "1.19.18",
- "destructuring": true,
- "exportName": "Select"
- }
- ],
- "componentsTree": [
- {
- "componentName": "Page",
- "id": "node$1",
- "meta": {
- "title": "测试",
- "router": "/"
- },
- "props": {
- "ref": "outterView",
- "autoLoading": true
- },
- "fileName": "test",
- "state": {
- "text": "outter"
- },
- "lifeCycles": {
- "componentDidMount": {
- "type": "JSExpression",
- "value": "function() { console.log('componentDidMount'); }"
- }
- },
- "children": [
- {
- "componentName": "Form",
- "id": "node$2",
- "props": {
- "labelCol": {
- "type": "JSExpression",
- "value": "this.state.colNum"
- },
- "style": {},
- "ref": "testForm"
- },
- "children": [
- {
- "componentName": "Form.Item",
- "id": "node$3",
- "props": {
- "label": {
- type: 'JSExpression',
- value: 'this.i18n("i18n-jwg27yo4")',
- },
- "name": "name",
- "initValue": "李雷"
- },
- "children": [
- {
- "componentName": "Input",
- "id": "node$4",
- "props": {
- "placeholder": "请输入",
- "size": "medium",
- "style": {
- "width": 320
- }
- }
- }
- ]
- },
- {
- "componentName": "Form.Item",
- "id": "node$5",
- "props": {
- "label": "年龄：",
- "name": "age",
- "initValue": "22"
- },
- "children": [
- {
- "componentName": "NumberPicker",
- "id": "node$6",
- "props": {
- "size": "medium",
- "type": "normal"
- }
- }
- ]
- },
- {
- "componentName": "Form.Item",
- "id": "node$7",
- "props": {
- "label": "职业：",
- "name": "profession"
- },
- "children": [
- {
- "componentName": "Select",
- "id": "node$8",
- "props": {
- "dataSource": [
- {
- "label": "教师",
- "value": "t"
- },
- {
- "label": "医生",
- "value": "d"
- },
- {
- "label": "歌手",
- "value": "s"
- }
- ]
- }
- }
- ]
- },
- {
- "componentName": "Div",
- "id": "node$9",
- "props": {
- "style": {
- "textAlign": "center"
- }
- },
- "children": [
- {
- "componentName": "Button.Group",
- "id": "node$a",
- "props": {},
- "children": [
- {
- "componentName": "Button",
- "id": "node$b",
- "props": {
- "type": "primary",
- "style": {
- "margin": "0 5px 0 5px"
- },
- "htmlType": "submit"
- },
- "children": [
- "提交"
- ]
- },
- {
- "componentName": "Button",
- "id": "node$d",
- "props": {
- "type": "normal",
- "style": {
- "margin": "0 5px 0 5px"
- },
- "htmlType": "reset"
- },
- "children": [
- "重置"
- ]
- }
- ]
- }
- ]
- }
- ]
- }
- ]
- }
- ],
- "constants": {
- "ENV": "prod",
- "DOMAIN": "xxx.xxx.com"
- },
- "i18n": {
- "zh-CN": {
- "i18n-jwg27yo4": "你好",
- "i18n-jwg27yo3": "中国"
- },
- "en-US": {
- "i18n-jwg27yo4": "Hello",
- "i18n-jwg27yo3": "China"
- }
- },
- "css": "body {font-size: 12px;} .table { width: 100px;}",
- "config": {
- "sdkVersion": "1.0.3",
- "historyMode": "hash",
- "targetRootID": "J_Container",
- "layout": {
- "componentName": "BasicLayout",
- "props": {
- "logo": "...",
- "name": "测试网站"
- }
- },
- "theme": {
- "package": "@alife/theme-fusion",
- "version": "^0.1.0",
- "primary": "#ff9966"
- }
- },
- "meta": {
- "name": "demo应用",
- "git_group": "appGroup",
- "project_name": "app_demo",
- "description": "这是一个测试应用",
- "spma": "spa23d",
- "creator": "月飞"
- }
-}
diff --git a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/package.json b/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/package.json
deleted file mode 100644
index b3eeeae4e2..0000000000
--- a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/package.json
+++ /dev/null
@@ -1,41 +0,0 @@
-{
- "name": "icejs-demo-app",
- "version": "0.1.5",
- "description": "轻量级模板，使用 JavaScript，仅包含基础的 Layout。",
- "dependencies": {
- "moment": "^2.24.0",
- "react": "^16.4.1",
- "react-dom": "^16.4.1",
- "react-router": "^5.2.1",
- "@alifd/theme-design-pro": "^0.x",
- "intl-messageformat": "^9.3.6",
- "@ice/store": "^1.4.3",
- "@loadable/component": "^5.15.2",
- "@alilc/lowcode-datasource-engine": "latest",
- "@alifd/next": "1.19.18"
- },
- "devDependencies": {
- "@ice/spec": "^1.0.0",
- "build-plugin-fusion": "^0.1.0",
- "build-plugin-moment-locales": "^0.1.0",
- "eslint": "^6.0.1",
- "ice.js": "^1.0.0",
- "stylelint": "^13.2.0"
- },
- "scripts": {
- "start": "icejs start",
- "build": "icejs build",
- "lint": "npm run eslint && npm run stylelint",
- "eslint": "eslint --cache --ext .js,.jsx ./",
- "stylelint": "stylelint ./**/*.scss"
- },
- "ideMode": { "name": "ice-react" },
- "iceworks": { "type": "react", "adapter": "adapter-react-v3" },
- "engines": { "node": ">=8.0.0" },
- "repository": {
- "type": "git",
- "url": "http://gitlab.xxx.com/msd/leak-scan/tree/master"
- },
- "private": true,
- "originTemplate": "@alifd/scaffold-lite-js"
-}
diff --git a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/app.js b/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/app.js
deleted file mode 100644
index fb01b106b4..0000000000
--- a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/app.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { createApp } from "ice";
-
-const appConfig = {
- app: {
- rootId: "app",
- },
- router: {
- type: "hash",
- },
-};
-createApp(appConfig);
diff --git a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/constants.js b/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/constants.js
deleted file mode 100644
index c4a5859ee4..0000000000
--- a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/constants.js
+++ /dev/null
@@ -1,3 +0,0 @@
-const __$$constants = { ENV: "prod", DOMAIN: "xxx.xxx.com" };
-
-export default __$$constants;
diff --git a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/global.scss b/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/global.scss
deleted file mode 100644
index 2d97c56b09..0000000000
--- a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/global.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-// 引入默认全局样式
-@import "@alifd/next/reset.scss";
-
-body {
- -webkit-font-smoothing: antialiased;
-}
-
-body {
- font-size: 12px;
-}
-.table {
- width: 100px;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/i18n.js
deleted file mode 100644
index 3f0a822cee..0000000000
--- a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,86 +0,0 @@
-const i18nConfig = {
- "zh-CN": {
- "i18n-jwg27yo4": "你好",
- "i18n-jwg27yo3": "中国",
- },
- "en-US": {
- "i18n-jwg27yo4": "Hello",
- "i18n-jwg27yo3": "China",
- },
-};
-
-let locale =
- typeof navigator === "object" && typeof navigator.language === "string"
- ? navigator.language
- : "zh-CN";
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === "object" &&
- (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === "string"
- ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? "")
- : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg =
- i18nConfig[locale]?.[id] ??
- i18nConfig[locale.replace("-", "_")]?.[id] ??
- defaultMessage;
- if (msg == null) {
- console.warn("[i18n]: unknown message id: %o (locale=%o)", id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace("-", "_")];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || "zh_CN"] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/pages/Test/index.jsx b/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/pages/Test/index.jsx
deleted file mode 100644
index de9b20393c..0000000000
--- a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/pages/Test/index.jsx
+++ /dev/null
@@ -1,87 +0,0 @@
-// 注意: 出码引擎注入的临时变量默认都以 "__$$" 开头，禁止在搭建的代码中直接访问。
-// 例外：react 框架的导出名和各种组件名除外。
-import React from "react";
-
-import Super, {
- Button,
- Input as CustomInput,
- Form,
- NumberPicker,
- Select,
- SearchTable as SearchTableExport,
-} from "@alifd/next";
-
-import SuperOther from "@alifd/next";
-
-import utils from "../../utils";
-
-import * as __$$i18n from "../../i18n";
-
-import "./index.css";
-
-const SuperSub = Super.Sub;
-
-const SelectOption = Select.Option;
-
-const SearchTable = SearchTableExport.default;
-
-class Test$$Page extends React.Component {
- _context = this;
-
- constructor(props, context) {
- super(props);
-
- this.utils = utils;
-
- __$$i18n._inject2(this);
-
- this.state = {};
- }
-
- $ = () => null;
-
- $$ = () => [];
-
- componentDidMount() {}
-
- render() {
- const __$$context = this._context || this;
- const { state } = __$$context;
- return (
-
- this.state.title)} />
-
- );
- }
-}
-
-export default Test$$Page;
-
-function __$$eval(expr) {
- try {
- return expr();
- } catch (error) {}
-}
-
-function __$$evalArray(expr) {
- const res = __$$eval(expr);
- return Array.isArray(res) ? res : [];
-}
-
-function __$$createChildContext(oldContext, ext) {
- const childContext = {
- ...oldContext,
- ...ext,
- };
- childContext.__proto__ = oldContext;
- return childContext;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/routes.js b/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/routes.js
deleted file mode 100644
index e6b7426d47..0000000000
--- a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/routes.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import Test from "@/pages/Test";
-
-import BasicLayout from "@/layouts/BasicLayout";
-
-const routerConfig = [
- {
- path: "/",
- component: BasicLayout,
- children: [
- {
- path: "/",
- component: Test,
- },
- ],
- },
-];
-
-export default routerConfig;
diff --git a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/utils.js b/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/utils.js
deleted file mode 100644
index 3d3ca9a81c..0000000000
--- a/modules/code-generator/test-cases/react-app/demo3/expected/demo-project/src/utils.js
+++ /dev/null
@@ -1,47 +0,0 @@
-import { createRef } from "react";
-
-export class RefsManager {
- constructor() {
- this.refInsStore = {};
- }
-
- clearNullRefs() {
- Object.keys(this.refInsStore).forEach((refName) => {
- const filteredInsList = this.refInsStore[refName].filter(
- (insRef) => !!insRef.current
- );
- if (filteredInsList.length > 0) {
- this.refInsStore[refName] = filteredInsList;
- } else {
- delete this.refInsStore[refName];
- }
- });
- }
-
- get(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName][0].current;
- }
-
- return null;
- }
-
- getAll(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName].map((i) => i.current);
- }
-
- return [];
- }
-
- linkRef(refName) {
- const refIns = createRef();
- this.refInsStore[refName] = this.refInsStore[refName] || [];
- this.refInsStore[refName].push(refIns);
- return refIns;
- }
-}
-
-export default {};
diff --git a/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/package.json b/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/package.json
deleted file mode 100644
index 51a11a8a9b..0000000000
--- a/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/package.json
+++ /dev/null
@@ -1,43 +0,0 @@
-{
- "name": "icejs-demo-app",
- "version": "0.1.5",
- "description": "轻量级模板，使用 JavaScript，仅包含基础的 Layout。",
- "dependencies": {
- "moment": "^2.24.0",
- "react": "^16.4.1",
- "react-dom": "^16.4.1",
- "react-router": "^5.2.1",
- "@alifd/theme-design-pro": "^0.x",
- "intl-messageformat": "^9.3.6",
- "@ice/store": "^1.4.3",
- "@loadable/component": "^5.15.2",
- "@alilc/lowcode-datasource-engine": "latest",
- "@alilc/lowcode-datasource-fetch-handler": "latest",
- "@alife/container": "latest",
- "@alife/mc-assets-1935": "0.1.9"
- },
- "devDependencies": {
- "@ice/spec": "^1.0.0",
- "build-plugin-fusion": "^0.1.0",
- "build-plugin-moment-locales": "^0.1.0",
- "eslint": "^6.0.1",
- "ice.js": "^1.0.0",
- "stylelint": "^13.2.0"
- },
- "scripts": {
- "start": "icejs start",
- "build": "icejs build",
- "lint": "npm run eslint && npm run stylelint",
- "eslint": "eslint --cache --ext .js,.jsx ./",
- "stylelint": "stylelint ./**/*.scss"
- },
- "ideMode": { "name": "ice-react" },
- "iceworks": { "type": "react", "adapter": "adapter-react-v3" },
- "engines": { "node": ">=8.0.0" },
- "repository": {
- "type": "git",
- "url": "http://gitlab.xxx.com/msd/leak-scan/tree/master"
- },
- "private": true,
- "originTemplate": "@alifd/scaffold-lite-js"
-}
diff --git a/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/app.js b/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/app.js
deleted file mode 100644
index fb01b106b4..0000000000
--- a/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/app.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { createApp } from "ice";
-
-const appConfig = {
- app: {
- rootId: "app",
- },
- router: {
- type: "hash",
- },
-};
-createApp(appConfig);
diff --git a/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/global.scss b/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/global.scss
deleted file mode 100644
index cc339ce97b..0000000000
--- a/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/global.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-// 引入默认全局样式
-@import "@alifd/next/reset.scss";
-
-body {
- -webkit-font-smoothing: antialiased;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/i18n.js
deleted file mode 100644
index 60e05915d9..0000000000
--- a/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,77 +0,0 @@
-const i18nConfig = {};
-
-let locale =
- typeof navigator === "object" && typeof navigator.language === "string"
- ? navigator.language
- : "zh-CN";
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === "object" &&
- (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === "string"
- ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? "")
- : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg =
- i18nConfig[locale]?.[id] ??
- i18nConfig[locale.replace("-", "_")]?.[id] ??
- defaultMessage;
- if (msg == null) {
- console.warn("[i18n]: unknown message id: %o (locale=%o)", id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace("-", "_")];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || "zh_CN"] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/pages/Test/index.jsx b/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/pages/Test/index.jsx
deleted file mode 100644
index b81e72ad79..0000000000
--- a/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/pages/Test/index.jsx
+++ /dev/null
@@ -1,286 +0,0 @@
-// 注意: 出码引擎注入的临时变量默认都以 "__$$" 开头，禁止在搭建的代码中直接访问。
-// 例外：react 框架的导出名和各种组件名除外。
-import React from "react";
-
-import {
- Page as NextPage,
- Block as NextBlock,
- P as NextP,
- Text as NextText,
-} from "@alife/container/lib/index.js";
-
-import { AliSearchTable as AliSearchTableExport } from "@alife/mc-assets-1935/build/lowcode/index.js";
-
-import { createFetchHandler as __$$createFetchRequestHandler } from "@alilc/lowcode-datasource-fetch-handler";
-
-import { create as __$$createDataSourceEngine } from "@alilc/lowcode-datasource-engine/runtime";
-
-import utils, { RefsManager } from "../../utils";
-
-import * as __$$i18n from "../../i18n";
-
-import "./index.css";
-
-const NextBlockCell = NextBlock.Cell;
-
-const AliSearchTable = AliSearchTableExport.default;
-
-class Test$$Page extends React.Component {
- _context = this;
-
- _dataSourceConfig = this._defineDataSourceConfig();
- _dataSourceEngine = __$$createDataSourceEngine(this._dataSourceConfig, this, {
- runtimeConfig: true,
- requestHandlersMap: { fetch: __$$createFetchRequestHandler() },
- });
-
- get dataSourceMap() {
- return this._dataSourceEngine.dataSourceMap || {};
- }
-
- reloadDataSource = async () => {
- await this._dataSourceEngine.reloadDataSource();
- };
-
- constructor(props, context) {
- super(props);
-
- this.utils = utils;
-
- this._refsManager = new RefsManager();
-
- __$$i18n._inject2(this);
-
- this.state = { text: "outter", isShowDialog: false };
- }
-
- $ = (refName) => {
- return this._refsManager.get(refName);
- };
-
- $$ = (refName) => {
- return this._refsManager.getAll(refName);
- };
-
- _defineDataSourceConfig() {
- const _this = this;
- return {
- list: [
- {
- type: "fetch",
- isInit: function () {
- return true;
- },
- options: function () {
- return {
- params: {},
- method: "GET",
- isCors: true,
- timeout: 5000,
- headers: {},
- uri: "https://mocks.xxx.com/mock/jjpin/user/list",
- };
- },
- id: "users",
- },
- ],
- };
- }
-
- componentWillUnmount() {
- console.log("will umount");
- }
-
- componentDidUpdate(prevProps, prevState, snapshot) {
- console.log(this.state);
- }
-
- testFunc() {
- console.log("test func");
- }
-
- onClick() {
- this.setState({
- isShowDialog: true,
- });
- }
-
- closeDialog() {
- this.setState({
- isShowDialog: false,
- });
- }
-
- onSearch(values) {
- console.log("search form:", values);
- console.log(this.dataSourceMap);
- this.dataSourceMap["users"].load(values);
- }
-
- onClear() {
- console.log("form reset");
- this.setState({
- isShowDialog: true,
- });
- }
-
- onPageChange(page, pageSize) {
- console.log(`page: ${page}, pageSize: ${pageSize}`);
- }
-
- componentDidMount() {
- this._dataSourceEngine.reloadDataSource();
-
- console.log("did mount");
- }
-
- render() {
- const __$$context = this._context || this;
- const { state } = __$$context;
- return (
-
-
- 员工列表
-
- }
- headerTest={[]}
- headerProps={{ background: "surface" }}
- footer={null}
- minHeight="100vh"
- >
-
-
-
- this.state.users.data)}
- rowKey="workid"
- columns={[
- { title: "花名", dataIndex: "cname" },
- { title: "user_id", dataIndex: "workid" },
- { title: "部门", dataIndex: "dep" },
- ]}
- searchItems={[
- { label: "姓名", name: "cname" },
- { label: "部门", name: "dep" },
- ]}
- onSearch={function () {
- return this.onSearch.apply(
- this,
- Array.prototype.slice.call(arguments).concat([])
- );
- }.bind(this)}
- onClear={function () {
- return this.onClear.apply(
- this,
- Array.prototype.slice.call(arguments).concat([])
- );
- }.bind(this)}
- pagination={{
- defaultPageSize: "",
- onPageChange: function () {
- return this.onPageChange.apply(
- this,
- Array.prototype.slice.call(arguments).concat([])
- );
- }.bind(this),
- showSizeChanger: true,
- }}
- />
-
-
-
-
-
-
-
-
-
- );
- }
-}
-
-export default Test$$Page;
-
-function __$$eval(expr) {
- try {
- return expr();
- } catch (error) {}
-}
-
-function __$$evalArray(expr) {
- const res = __$$eval(expr);
- return Array.isArray(res) ? res : [];
-}
-
-function __$$createChildContext(oldContext, ext) {
- const childContext = {
- ...oldContext,
- ...ext,
- };
- childContext.__proto__ = oldContext;
- return childContext;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/routes.js b/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/routes.js
deleted file mode 100644
index ce50d58b70..0000000000
--- a/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/routes.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import Test from "@/pages/Test";
-
-import BasicLayout from "@/layouts/BasicLayout";
-
-const routerConfig = [
- {
- path: "/",
- component: BasicLayout,
- children: [
- {
- path: "",
- component: Test,
- },
- ],
- },
-];
-
-export default routerConfig;
diff --git a/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/utils.js b/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/utils.js
deleted file mode 100644
index 3d3ca9a81c..0000000000
--- a/modules/code-generator/test-cases/react-app/demo4/expected/demo-project/src/utils.js
+++ /dev/null
@@ -1,47 +0,0 @@
-import { createRef } from "react";
-
-export class RefsManager {
- constructor() {
- this.refInsStore = {};
- }
-
- clearNullRefs() {
- Object.keys(this.refInsStore).forEach((refName) => {
- const filteredInsList = this.refInsStore[refName].filter(
- (insRef) => !!insRef.current
- );
- if (filteredInsList.length > 0) {
- this.refInsStore[refName] = filteredInsList;
- } else {
- delete this.refInsStore[refName];
- }
- });
- }
-
- get(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName][0].current;
- }
-
- return null;
- }
-
- getAll(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName].map((i) => i.current);
- }
-
- return [];
- }
-
- linkRef(refName) {
- const refIns = createRef();
- this.refInsStore[refName] = this.refInsStore[refName] || [];
- this.refInsStore[refName].push(refIns);
- return refIns;
- }
-}
-
-export default {};
diff --git a/modules/code-generator/test-cases/react-app/demo4/schema.json5 b/modules/code-generator/test-cases/react-app/demo4/schema.json5
deleted file mode 100644
index 0695b843ee..0000000000
--- a/modules/code-generator/test-cases/react-app/demo4/schema.json5
+++ /dev/null
@@ -1,353 +0,0 @@
-{
- "version": "1.0.0",
- "componentsMap": [
- {
- "package": "@alife/mc-assets-1935",
- "version": "0.1.9",
- "exportName": "AliSearchTable",
- "main": "build/lowcode/index.js",
- "subName": "default",
- "destructuring": true,
- "componentName": "AliSearchTable"
- },
- {
- "package": "@alife/container",
- "version": "latest",
- "exportName": "P",
- "main": "lib/index.js",
- "destructuring": true,
- "subName": "",
- "componentName": "NextP"
- },
- {
- "package": "@alife/container",
- "version": "latest",
- "exportName": "Block",
- "main": "lib/index.js",
- "destructuring": true,
- "subName": "Cell",
- "componentName": "NextBlockCell"
- },
- {
- "package": "@alife/container",
- "version": "latest",
- "exportName": "Block",
- "main": "lib/index.js",
- "destructuring": true,
- "subName": "",
- "componentName": "NextBlock"
- },
- {
- "package": "@alife/container",
- "version": "latest",
- "exportName": "Text",
- "main": "lib/index.js",
- "destructuring": true,
- "subName": "",
- "componentName": "NextText"
- },
- {
- "package": "@alife/container",
- "version": "latest",
- "exportName": "Page",
- "main": "lib/index.js",
- "destructuring": true,
- "subName": "",
- "componentName": "NextPage"
- }
- ],
- "componentsTree": [
- {
- "componentName": "Page",
- "id": "node_dockcviv8fo1",
- "props": {
- "ref": "outterView",
- "style": {
- "height": "100%"
- }
- },
- "fileName": "test",
- "dataSource": {
- "list": [
- {
- "type": "fetch",
- "isInit": true,
- "options": {
- "params": {},
- "method": "GET",
- "isCors": true,
- "timeout": 5000,
- "headers": {},
- "uri": "https://mocks.xxx.com/mock/jjpin/user/list"
- },
- "id": "users"
- }
- ]
- },
- "css": "body {\n font-size: 12px;\n}\n\n.botton {\n width: 100px;\n color: #ff00ff\n}",
- "lifeCycles": {
- "componentDidMount": {
- "type": "JSFunction",
- "value": "function() {\n console.log('did mount');\n }"
- },
- "componentWillUnmount": {
- "type": "JSFunction",
- "value": "function() {\n console.log('will umount');\n }"
- },
- "componentDidUpdate": {
- "type": "JSFunction",
- "value": "function(prevProps, prevState, snapshot) {\n console.log(this.state);\n }"
- }
- },
- "methods": {
- "testFunc": {
- "type": "JSFunction",
- "value": "function() {\n console.log('test func');\n }"
- },
- "onClick": {
- "type": "JSFunction",
- "value": "function() {\n this.setState({\n isShowDialog: true\n })\n }"
- },
- "closeDialog": {
- "type": "JSFunction",
- "value": "function() {\n this.setState({\n isShowDialog: false\n })\n }"
- },
- "onSearch": {
- "type": "JSFunction",
- "value": "function(values) {\n console.log('search form:', values)\n console.log(this.dataSourceMap);\n this.dataSourceMap['users'].load(values)\n }"
- },
- "onClear": {
- "type": "JSFunction",
- "value": "function() {\n console.log('form reset')\n this.setState({\n isShowDialog: true\n })\n }"
- },
- "onPageChange": {
- "type": "JSFunction",
- "value": "function(page, pageSize) {\n console.log(`page: ${page}, pageSize: ${pageSize}`)\n }"
- }
- },
- "state": {
- "text": "outter",
- "isShowDialog": false
- },
- "children": [
- {
- "componentName": "NextPage",
- "id": "node_ockkgjwi8z1",
- "props": {
- "columns": 12,
- "placeholderStyle": {
- "gridRowEnd": "span 1",
- "gridColumnEnd": "span 12"
- },
- "placeholder": "页面主体内容：拖拽Block布局组件到这里",
- "header": {
- "type": "JSSlot",
- "value": [
- {
- "componentName": "NextP",
- "id": "node_ockkgjwi8zn",
- "props": {
- "wrap": true,
- "type": "body2",
- "verAlign": "middle",
- "textSpacing": true,
- "align": "left",
- "flex": true
- },
- "children": [
- {
- "componentName": "NextText",
- "id": "node_ockkgjwi8zo",
- "props": {
- "type": "h5",
- "children": "员工列表"
- }
- }
- ]
- }
- ],
- "title": "header"
- },
- "headerTest": {
- "type": "JSSlot",
- "value": [],
- "title": "header"
- },
- "headerProps": {
- "background": "surface"
- },
- "footer": {
- "type": "JSSlot",
- "title": "footer"
- },
- "minHeight": "100vh"
- },
- "children": [
- {
- "componentName": "NextBlock",
- "id": "node_ockkgjwi8z2",
- "props": {
- "prefix": "next-",
- "placeholderStyle": {
- "height": "100%"
- },
- "noPadding": false,
- "noBorder": false,
- "background": "surface",
- "colSpan": 12,
- "rowSpan": 1,
- "childTotalColumns": "1fr"
- },
- "title": "分区",
- "children": [
- {
- "componentName": "NextBlockCell",
- "id": "node_ockkgjwi8z3",
- "props": {
- "title": "",
- "primaryKey": "732",
- "prefix": "next-",
- "placeholderStyle": {
- "height": "100%"
- },
- "colSpan": 1,
- "rowSpan": 1
- },
- "children": [
- {
- "componentName": "NextP",
- "id": "node_ockkgjwi8zu",
- "props": {
- "wrap": true,
- "type": "body2",
- "textSpacing": true,
- "verAlign": "center",
- "align": "flex-start",
- "flex": true
- },
- "children": [
- {
- "componentName": "AliSearchTable",
- "id": "node_ockkgjwi8zv",
- "props": {
- "dataSource": {
- "type": "JSExpression",
- "value": "this.state.users.data"
- },
- "rowKey": "workid",
- "columns": [
- {
- "title": "花名",
- "dataIndex": "cname"
- },
- {
- "title": "user_id",
- "dataIndex": "workid"
- },
- {
- "title": "部门",
- "dataIndex": "dep"
- }
- ],
- "searchItems": [
- {
- "label": "姓名",
- "name": "cname"
- },
- {
- "label": "部门",
- "name": "dep"
- }
- ],
- "onSearch": {
- "type": "JSFunction",
- "value": "function(){ return this.onSearch.apply(this,Array.prototype.slice.call(arguments).concat([])) }"
- },
- "onClear": {
- "type": "JSFunction",
- "value": "function(){ return this.onClear.apply(this,Array.prototype.slice.call(arguments).concat([])) }"
- },
- "pagination": {
- "defaultPageSize": "",
- "onPageChange": {
- "type": "JSFunction",
- "value": "function(){ return this.onPageChange.apply(this,Array.prototype.slice.call(arguments).concat([])) }"
- },
- "showSizeChanger": true
- }
- }
- }
- ]
- }
- ]
- }
- ]
- }
- ]
- },
- {
- "componentName": "NextPage",
- "id": "node_ockm4jxd6313",
- "props": {
- "columns": 12,
- "headerDivider": true,
- "placeholderStyle": {
- "gridRowEnd": "span 1",
- "gridColumnEnd": "span 12"
- },
- "placeholder": "页面主体内容：拖拽Block布局组件到这里",
- "header": {
- "type": "JSSlot",
- "title": "header"
- },
- "headerProps": {
- "background": "surface"
- },
- "footer": {
- "type": "JSSlot",
- "title": "footer"
- },
- "minHeight": "100vh"
- },
- "title": "页面",
- "children": [
- {
- "componentName": "NextBlock",
- "id": "node_ockm4jxd6314",
- "props": {
- "prefix": "next-",
- "placeholderStyle": {
- "height": "100%"
- },
- "noPadding": false,
- "noBorder": false,
- "background": "surface",
- "colSpan": 12,
- "rowSpan": 1,
- "childTotalColumns": 1
- },
- "title": "区块",
- "children": [
- {
- "componentName": "NextBlockCell",
- "id": "node_ockm4jxd6315",
- "props": {
- "title": "",
- "primaryKey": "472",
- "prefix": "next-",
- "placeholderStyle": {
- "height": "100%"
- },
- "colSpan": 1,
- "rowSpan": 1
- }
- }
- ]
- }
- ]
- }
- ]
- }
- ],
- "i18n": {}
-}
diff --git a/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/package.json b/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/package.json
deleted file mode 100644
index 747fc287cf..0000000000
--- a/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/package.json
+++ /dev/null
@@ -1,44 +0,0 @@
-{
- "name": "icejs-demo-app",
- "version": "0.1.5",
- "description": "轻量级模板，使用 JavaScript，仅包含基础的 Layout。",
- "dependencies": {
- "moment": "^2.24.0",
- "react": "^16.4.1",
- "react-dom": "^16.4.1",
- "react-router": "^5.2.1",
- "@alifd/theme-design-pro": "^0.x",
- "intl-messageformat": "^9.3.6",
- "@ice/store": "^1.4.3",
- "@loadable/component": "^5.15.2",
- "@alilc/lowcode-datasource-engine": "latest",
- "undefined": "*",
- "@alife/container": "0.3.7",
- "@alilc/antd-lowcode": "0.5.4",
- "@alife/mc-assets-1935": "0.1.16"
- },
- "devDependencies": {
- "@ice/spec": "^1.0.0",
- "build-plugin-fusion": "^0.1.0",
- "build-plugin-moment-locales": "^0.1.0",
- "eslint": "^6.0.1",
- "ice.js": "^1.0.0",
- "stylelint": "^13.2.0"
- },
- "scripts": {
- "start": "icejs start",
- "build": "icejs build",
- "lint": "npm run eslint && npm run stylelint",
- "eslint": "eslint --cache --ext .js,.jsx ./",
- "stylelint": "stylelint ./**/*.scss"
- },
- "ideMode": { "name": "ice-react" },
- "iceworks": { "type": "react", "adapter": "adapter-react-v3" },
- "engines": { "node": ">=8.0.0" },
- "repository": {
- "type": "git",
- "url": "http://gitlab.xxx.com/msd/leak-scan/tree/master"
- },
- "private": true,
- "originTemplate": "@alifd/scaffold-lite-js"
-}
diff --git a/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/app.js b/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/app.js
deleted file mode 100644
index fb01b106b4..0000000000
--- a/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/app.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { createApp } from "ice";
-
-const appConfig = {
- app: {
- rootId: "app",
- },
- router: {
- type: "hash",
- },
-};
-createApp(appConfig);
diff --git a/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/global.scss b/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/global.scss
deleted file mode 100644
index cc339ce97b..0000000000
--- a/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/global.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-// 引入默认全局样式
-@import "@alifd/next/reset.scss";
-
-body {
- -webkit-font-smoothing: antialiased;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/i18n.js
deleted file mode 100644
index 60e05915d9..0000000000
--- a/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,77 +0,0 @@
-const i18nConfig = {};
-
-let locale =
- typeof navigator === "object" && typeof navigator.language === "string"
- ? navigator.language
- : "zh-CN";
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === "object" &&
- (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === "string"
- ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? "")
- : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg =
- i18nConfig[locale]?.[id] ??
- i18nConfig[locale.replace("-", "_")]?.[id] ??
- defaultMessage;
- if (msg == null) {
- console.warn("[i18n]: unknown message id: %o (locale=%o)", id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace("-", "_")];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || "zh_CN"] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/pages/Test/index.jsx b/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/pages/Test/index.jsx
deleted file mode 100644
index 430f8aad97..0000000000
--- a/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/pages/Test/index.jsx
+++ /dev/null
@@ -1,383 +0,0 @@
-// 注意: 出码引擎注入的临时变量默认都以 "__$$" 开头，禁止在搭建的代码中直接访问。
-// 例外：react 框架的导出名和各种组件名除外。
-import React from "react";
-
-import {
- Page as NextPage,
- Block as NextBlock,
- P as NextP,
-} from "@alife/container/lib/index.js";
-
-import {
- Card,
- Space,
- Typography,
- Select,
- Button,
- Modal,
- Form,
- InputNumber,
- Input,
-} from "@alilc/antd-lowcode/dist/antd-lowcode.esm.js";
-
-import { AliAutoSearchTable } from "@alife/mc-assets-1935/build/lowcode/index.js";
-
-import utils, { RefsManager } from "../../utils";
-
-import * as __$$i18n from "../../i18n";
-
-import "./index.css";
-
-const NextBlockCell = NextBlock.Cell;
-
-const AliAutoSearchTableDefault = AliAutoSearchTable.default;
-
-class Test$$Page extends React.Component {
- _context = this;
-
- constructor(props, context) {
- super(props);
-
- this.utils = utils;
-
- this._refsManager = new RefsManager();
-
- __$$i18n._inject2(this);
-
- this.state = {
- name: "nongzhou",
- gateways: [],
- selectedGateway: null,
- records: [],
- modalVisible: false,
- };
- }
-
- $ = (refName) => {
- return this._refsManager.get(refName);
- };
-
- $$ = (refName) => {
- return this._refsManager.getAll(refName);
- };
-
- componentWillUnmount() {
- /* ... */
- }
-
- componentDidUpdate() {
- /* ... */
- }
-
- onChange() {
- /* ... */
- }
-
- getActions() {
- /* ... */
- }
-
- onCreateOrder() {
- /* ... */
- }
-
- onCancelModal() {
- /* ... */
- }
-
- onConfirmCreateOrder() {
- /* ... */
- }
-
- componentDidMount() {}
-
- render() {
- const __$$context = this._context || this;
- const { state } = __$$context;
- return (
-
-
-
-
-
-
-
- 所在网关：
-
-
- this.state.modalVisible)}
- footer=""
- __events={{
- eventDataList: [
- {
- type: "componentEvent",
- name: "onCancel",
- relatedEventName: "onCancelModal",
- },
- ],
- eventList: [
- { name: "onCancel", disabled: true },
- { name: "onOk", disabled: false },
- ],
- }}
- onCancel={function () {
- this.onCancelModal.apply(
- this,
- Array.prototype.slice.call(arguments).concat([])
- );
- }.bind(this)}
- zIndex={2000}
- >
-
-
- this.state.records)}
- columns={[
- {
- title: "发布名称",
- dataIndex: "order_name",
- key: "name",
- },
- {
- title: "类型",
- dataIndex: "order_type_desc",
- key: "age",
- },
- {
- title: "发布状态",
- dataIndex: "order_status_desc",
- key: "address",
- },
- { title: "发布人", dataIndex: "creator_name" },
- { title: "当前批次/总批次", dataIndex: "cur_batch_no" },
- {
- title: "发布机器/总机器",
- dataIndex: "pubblish_ip_finish_num",
- },
- { title: "发布时间", dataIndex: "publish_id" },
- ]}
- actions={__$$eval(() => this.actions || [])}
- getActions={function () {
- return this.getActions.apply(
- this,
- Array.prototype.slice.call(arguments).concat([])
- );
- }.bind(this)}
- />
-
-
-
-
-
-
- );
- }
-}
-
-export default Test$$Page;
-
-function __$$eval(expr) {
- try {
- return expr();
- } catch (error) {}
-}
-
-function __$$evalArray(expr) {
- const res = __$$eval(expr);
- return Array.isArray(res) ? res : [];
-}
-
-function __$$createChildContext(oldContext, ext) {
- const childContext = {
- ...oldContext,
- ...ext,
- };
- childContext.__proto__ = oldContext;
- return childContext;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/routes.js b/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/routes.js
deleted file mode 100644
index ce50d58b70..0000000000
--- a/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/routes.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import Test from "@/pages/Test";
-
-import BasicLayout from "@/layouts/BasicLayout";
-
-const routerConfig = [
- {
- path: "/",
- component: BasicLayout,
- children: [
- {
- path: "",
- component: Test,
- },
- ],
- },
-];
-
-export default routerConfig;
diff --git a/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/utils.js b/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/utils.js
deleted file mode 100644
index 3d3ca9a81c..0000000000
--- a/modules/code-generator/test-cases/react-app/demo5/expected/demo-project/src/utils.js
+++ /dev/null
@@ -1,47 +0,0 @@
-import { createRef } from "react";
-
-export class RefsManager {
- constructor() {
- this.refInsStore = {};
- }
-
- clearNullRefs() {
- Object.keys(this.refInsStore).forEach((refName) => {
- const filteredInsList = this.refInsStore[refName].filter(
- (insRef) => !!insRef.current
- );
- if (filteredInsList.length > 0) {
- this.refInsStore[refName] = filteredInsList;
- } else {
- delete this.refInsStore[refName];
- }
- });
- }
-
- get(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName][0].current;
- }
-
- return null;
- }
-
- getAll(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName].map((i) => i.current);
- }
-
- return [];
- }
-
- linkRef(refName) {
- const refIns = createRef();
- this.refInsStore[refName] = this.refInsStore[refName] || [];
- this.refInsStore[refName].push(refIns);
- return refIns;
- }
-}
-
-export default {};
diff --git a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/package.json b/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/package.json
deleted file mode 100644
index 767ec3898f..0000000000
--- a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/package.json
+++ /dev/null
@@ -1,43 +0,0 @@
-{
- "name": "icejs-demo-app",
- "version": "0.1.5",
- "description": "轻量级模板，使用 JavaScript，仅包含基础的 Layout。",
- "dependencies": {
- "moment": "^2.24.0",
- "react": "^16.4.1",
- "react-dom": "^16.4.1",
- "react-router": "^5.2.1",
- "@alifd/theme-design-pro": "^0.x",
- "intl-messageformat": "^9.3.6",
- "@ice/store": "^1.4.3",
- "@loadable/component": "^5.15.2",
- "@alilc/lowcode-datasource-engine": "latest",
- "@alilc/lowcode-datasource-url-params-handler": "latest",
- "@alilc/lowcode-datasource-fetch-handler": "latest",
- "@alifd/next": "1.19.18"
- },
- "devDependencies": {
- "@ice/spec": "^1.0.0",
- "build-plugin-fusion": "^0.1.0",
- "build-plugin-moment-locales": "^0.1.0",
- "eslint": "^6.0.1",
- "ice.js": "^1.0.0",
- "stylelint": "^13.2.0"
- },
- "scripts": {
- "start": "icejs start",
- "build": "icejs build",
- "lint": "npm run eslint && npm run stylelint",
- "eslint": "eslint --cache --ext .js,.jsx ./",
- "stylelint": "stylelint ./**/*.scss"
- },
- "ideMode": { "name": "ice-react" },
- "iceworks": { "type": "react", "adapter": "adapter-react-v3" },
- "engines": { "node": ">=8.0.0" },
- "repository": {
- "type": "git",
- "url": "http://gitlab.xxx.com/msd/leak-scan/tree/master"
- },
- "private": true,
- "originTemplate": "@alifd/scaffold-lite-js"
-}
diff --git a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/app.js b/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/app.js
deleted file mode 100644
index fb01b106b4..0000000000
--- a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/app.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { createApp } from "ice";
-
-const appConfig = {
- app: {
- rootId: "app",
- },
- router: {
- type: "hash",
- },
-};
-createApp(appConfig);
diff --git a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/constants.js b/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/constants.js
deleted file mode 100644
index c4a5859ee4..0000000000
--- a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/constants.js
+++ /dev/null
@@ -1,3 +0,0 @@
-const __$$constants = { ENV: "prod", DOMAIN: "xxx.xxx.com" };
-
-export default __$$constants;
diff --git a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/global.scss b/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/global.scss
deleted file mode 100644
index 2d97c56b09..0000000000
--- a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/global.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-// 引入默认全局样式
-@import "@alifd/next/reset.scss";
-
-body {
- -webkit-font-smoothing: antialiased;
-}
-
-body {
- font-size: 12px;
-}
-.table {
- width: 100px;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/i18n.js
deleted file mode 100644
index 60e05915d9..0000000000
--- a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,77 +0,0 @@
-const i18nConfig = {};
-
-let locale =
- typeof navigator === "object" && typeof navigator.language === "string"
- ? navigator.language
- : "zh-CN";
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === "object" &&
- (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === "string"
- ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? "")
- : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg =
- i18nConfig[locale]?.[id] ??
- i18nConfig[locale.replace("-", "_")]?.[id] ??
- defaultMessage;
- if (msg == null) {
- console.warn("[i18n]: unknown message id: %o (locale=%o)", id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace("-", "_")];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || "zh_CN"] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/pages/Test/index.jsx b/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/pages/Test/index.jsx
deleted file mode 100644
index d3b1bd37e6..0000000000
--- a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/pages/Test/index.jsx
+++ /dev/null
@@ -1,191 +0,0 @@
-// 注意: 出码引擎注入的临时变量默认都以 "__$$" 开头，禁止在搭建的代码中直接访问。
-// 例外：react 框架的导出名和各种组件名除外。
-import React from "react";
-
-import { Form, Input, NumberPicker, Select, Button } from "@alifd/next";
-
-import { createUrlParamsHandler as __$$createUrlParamsRequestHandler } from "@alilc/lowcode-datasource-url-params-handler";
-
-import { createFetchHandler as __$$createFetchRequestHandler } from "@alilc/lowcode-datasource-fetch-handler";
-
-import { create as __$$createDataSourceEngine } from "@alilc/lowcode-datasource-engine/runtime";
-
-import utils, { RefsManager } from "../../utils";
-
-import * as __$$i18n from "../../i18n";
-
-import "./index.css";
-
-class Test$$Page extends React.Component {
- _context = this;
-
- _dataSourceConfig = this._defineDataSourceConfig();
- _dataSourceEngine = __$$createDataSourceEngine(this._dataSourceConfig, this, {
- runtimeConfig: true,
- requestHandlersMap: {
- urlParams: __$$createUrlParamsRequestHandler(window.location.search),
- fetch: __$$createFetchRequestHandler(),
- },
- });
-
- get dataSourceMap() {
- return this._dataSourceEngine.dataSourceMap || {};
- }
-
- reloadDataSource = async () => {
- await this._dataSourceEngine.reloadDataSource();
- };
-
- constructor(props, context) {
- super(props);
-
- this.utils = utils;
-
- this._refsManager = new RefsManager();
-
- __$$i18n._inject2(this);
-
- this.state = { text: "outter" };
- }
-
- $ = (refName) => {
- return this._refsManager.get(refName);
- };
-
- $$ = (refName) => {
- return this._refsManager.getAll(refName);
- };
-
- _defineDataSourceConfig() {
- const _this = this;
- return {
- list: [
- {
- id: "urlParams",
- type: "urlParams",
- isInit: function () {
- return undefined;
- },
- options: function () {
- return undefined;
- },
- },
- {
- id: "user",
- type: "fetch",
- options: function () {
- return {
- method: "GET",
- uri: "https://shs.xxx.com/mock/1458/demo/user",
- isSync: true,
- };
- },
- dataHandler: function (response) {
- if (!response.data.success) {
- throw new Error(response.data.message);
- }
-
- return response.data.data;
- },
- isInit: function () {
- return undefined;
- },
- },
- {
- id: "orders",
- type: "fetch",
- options: function () {
- return {
- method: "GET",
- uri: "https://shs.xxx.com/mock/1458/demo/orders",
- isSync: true,
- };
- },
- dataHandler: function (response) {
- if (!response.data.success) {
- throw new Error(response.data.message);
- }
-
- return response.data.data.result;
- },
- isInit: function () {
- return undefined;
- },
- },
- ],
- dataHandler: function (dataMap) {
- console.info("All datasources loaded:", dataMap);
- },
- };
- }
-
- componentDidMount() {
- this._dataSourceEngine.reloadDataSource();
-
- console.log("componentDidMount");
- }
-
- render() {
- const __$$context = this._context || this;
- const { state } = __$$context;
- return (
-
-
-
- );
- }
-}
-
-export default Test$$Page;
-
-function __$$eval(expr) {
- try {
- return expr();
- } catch (error) {}
-}
-
-function __$$evalArray(expr) {
- const res = __$$eval(expr);
- return Array.isArray(res) ? res : [];
-}
-
-function __$$createChildContext(oldContext, ext) {
- const childContext = {
- ...oldContext,
- ...ext,
- };
- childContext.__proto__ = oldContext;
- return childContext;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/routes.js b/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/routes.js
deleted file mode 100644
index e6b7426d47..0000000000
--- a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/routes.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import Test from "@/pages/Test";
-
-import BasicLayout from "@/layouts/BasicLayout";
-
-const routerConfig = [
- {
- path: "/",
- component: BasicLayout,
- children: [
- {
- path: "/",
- component: Test,
- },
- ],
- },
-];
-
-export default routerConfig;
diff --git a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/utils.js b/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/utils.js
deleted file mode 100644
index 3d3ca9a81c..0000000000
--- a/modules/code-generator/test-cases/react-app/demo6-literal-condition/expected/demo-project/src/utils.js
+++ /dev/null
@@ -1,47 +0,0 @@
-import { createRef } from "react";
-
-export class RefsManager {
- constructor() {
- this.refInsStore = {};
- }
-
- clearNullRefs() {
- Object.keys(this.refInsStore).forEach((refName) => {
- const filteredInsList = this.refInsStore[refName].filter(
- (insRef) => !!insRef.current
- );
- if (filteredInsList.length > 0) {
- this.refInsStore[refName] = filteredInsList;
- } else {
- delete this.refInsStore[refName];
- }
- });
- }
-
- get(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName][0].current;
- }
-
- return null;
- }
-
- getAll(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName].map((i) => i.current);
- }
-
- return [];
- }
-
- linkRef(refName) {
- const refIns = createRef();
- this.refInsStore[refName] = this.refInsStore[refName] || [];
- this.refInsStore[refName].push(refIns);
- return refIns;
- }
-}
-
-export default {};
diff --git a/modules/code-generator/test-cases/react-app/demo6-literal-condition/schema.json5 b/modules/code-generator/test-cases/react-app/demo6-literal-condition/schema.json5
deleted file mode 100644
index 6d3a601373..0000000000
--- a/modules/code-generator/test-cases/react-app/demo6-literal-condition/schema.json5
+++ /dev/null
@@ -1,273 +0,0 @@
-{
- version: '1.0.0',
- componentsMap: [
- {
- componentName: 'Button',
- package: '@alifd/next',
- version: '1.19.18',
- destructuring: true,
- exportName: 'Button',
- },
- {
- componentName: 'Button.Group',
- package: '@alifd/next',
- version: '1.19.18',
- destructuring: true,
- exportName: 'Button',
- subName: 'Group',
- },
- {
- componentName: 'Input',
- package: '@alifd/next',
- version: '1.19.18',
- destructuring: true,
- exportName: 'Input',
- },
- {
- componentName: 'Form',
- package: '@alifd/next',
- version: '1.19.18',
- destructuring: true,
- exportName: 'Form',
- },
- {
- componentName: 'Form.Item',
- package: '@alifd/next',
- version: '1.19.18',
- destructuring: true,
- exportName: 'Form',
- subName: 'Item',
- },
- {
- componentName: 'NumberPicker',
- package: '@alifd/next',
- version: '1.19.18',
- destructuring: true,
- exportName: 'NumberPicker',
- },
- {
- componentName: 'Select',
- package: '@alifd/next',
- version: '1.19.18',
- destructuring: true,
- exportName: 'Select',
- },
- ],
- componentsTree: [
- {
- componentName: 'Page',
- id: 'node$1',
- meta: {
- title: '测试',
- router: '/',
- },
- props: {
- ref: 'outterView',
- autoLoading: true,
- },
- fileName: 'test',
- state: {
- text: 'outter',
- },
- lifeCycles: {
- componentDidMount: {
- type: 'JSExpression',
- value: "function() { console.log('componentDidMount'); }",
- },
- },
- dataSource: {
- list: [
- {
- id: 'urlParams',
- type: 'urlParams',
- },
- // 示例数据源：https://shs.xxx.com/mock/1458/demo/user
- {
- id: 'user',
- type: 'fetch',
- options: {
- method: 'GET',
- uri: 'https://shs.xxx.com/mock/1458/demo/user',
- isSync: true,
- },
- dataHandler: {
- type: 'JSExpression',
- value: 'function (response) {\nif (!response.data.success){\n throw new Error(response.data.message);\n }\n return response.data.data;\n}',
- },
- },
- // 示例数据源：https://shs.xxx.com/mock/1458/demo/orders
- {
- id: 'orders',
- type: 'fetch',
- options: {
- method: 'GET',
- uri: 'https://shs.xxx.com/mock/1458/demo/orders',
- isSync: true,
- },
- dataHandler: {
- type: 'JSExpression',
- value: 'function (response) {\nif (!response.data.success){\n throw new Error(response.data.message);\n }\n return response.data.data.result;\n}',
- },
- },
- ],
- dataHandler: {
- type: 'JSExpression',
- value: 'function (dataMap) {\n console.info("All datasources loaded:", dataMap);\n}',
- },
- },
- children: [
- {
- componentName: 'Form',
- id: 'node$2',
- props: {
- labelCol: {
- type: 'JSExpression',
- value: 'this.state.colNum',
- },
- style: {},
- ref: 'testForm',
- },
- children: [
- {
- componentName: 'Form.Item',
- id: 'node$3',
- props: {
- label: '姓名：',
- name: 'name',
- initValue: '李雷',
- },
- children: [
- {
- componentName: 'Input',
- id: 'node$4',
- props: {
- placeholder: '请输入',
- size: 'medium',
- style: {
- width: 320,
- },
- },
- },
- ],
- },
- {
- componentName: 'Form.Item',
- id: 'node$5',
- props: {
- label: '年龄：',
- name: 'age',
- initValue: '22',
- },
- children: [
- {
- componentName: 'NumberPicker',
- id: 'node$6',
- props: {
- size: 'medium',
- type: 'normal',
- },
- },
- ],
- },
- {
- componentName: 'Form.Item',
- id: 'node$7',
- props: {
- label: '职业：',
- name: 'profession',
- },
- children: [
- {
- componentName: 'Select',
- id: 'node$8',
- props: {
- dataSource: [
- {
- label: '教师',
- value: 't',
- },
- {
- label: '医生',
- value: 'd',
- },
- {
- label: '歌手',
- value: 's',
- },
- ],
- },
- },
- ],
- },
- {
- componentName: 'Div',
- id: 'node$9',
- props: {
- style: {
- textAlign: 'center',
- },
- },
- children: [
- {
- componentName: 'Button.Group',
- id: 'node$a',
- props: {},
- children: [
- {
- componentName: 'Button',
- id: 'node$b',
- condition: false,
- loop: ['a', 'b', 'c'],
- props: {
- type: 'primary',
- style: {
- margin: '0 5px 0 5px',
- },
- },
- children: [
- {
- type: 'JSExpression',
- value: 'this.item',
- },
- ],
- },
- ],
- },
- ],
- },
- ],
- },
- ],
- },
- ],
- constants: {
- ENV: 'prod',
- DOMAIN: 'xxx.xxx.com',
- },
- css: 'body {font-size: 12px;} .table { width: 100px;}',
- config: {
- sdkVersion: '1.0.3',
- historyMode: 'hash',
- targetRootID: 'J_Container',
- layout: {
- componentName: 'BasicLayout',
- props: {
- logo: '...',
- name: '测试网站',
- },
- },
- theme: {
- package: '@alife/theme-fusion',
- version: '^0.1.0',
- primary: '#ff9966',
- },
- },
- meta: {
- name: 'demo应用',
- git_group: 'appGroup',
- project_name: 'app_demo',
- description: '这是一个测试应用',
- spma: 'spa23d',
- creator: '月飞',
- },
-}
diff --git a/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/package.json b/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/package.json
deleted file mode 100644
index bb42d509d6..0000000000
--- a/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/package.json
+++ /dev/null
@@ -1,43 +0,0 @@
-{
- "name": "icejs-demo-app",
- "version": "0.1.5",
- "description": "轻量级模板，使用 JavaScript，仅包含基础的 Layout。",
- "dependencies": {
- "moment": "^2.24.0",
- "react": "^16.4.1",
- "react-dom": "^16.4.1",
- "react-router": "^5.2.1",
- "@alifd/theme-design-pro": "^0.x",
- "intl-messageformat": "^9.3.6",
- "@ice/store": "^1.4.3",
- "@loadable/component": "^5.15.2",
- "@alilc/lowcode-datasource-engine": "latest",
- "undefined": "*",
- "@alilc/antd-lowcode": "0.8.0",
- "@alife/container": "0.3.7"
- },
- "devDependencies": {
- "@ice/spec": "^1.0.0",
- "build-plugin-fusion": "^0.1.0",
- "build-plugin-moment-locales": "^0.1.0",
- "eslint": "^6.0.1",
- "ice.js": "^1.0.0",
- "stylelint": "^13.2.0"
- },
- "scripts": {
- "start": "icejs start",
- "build": "icejs build",
- "lint": "npm run eslint && npm run stylelint",
- "eslint": "eslint --cache --ext .js,.jsx ./",
- "stylelint": "stylelint ./**/*.scss"
- },
- "ideMode": { "name": "ice-react" },
- "iceworks": { "type": "react", "adapter": "adapter-react-v3" },
- "engines": { "node": ">=8.0.0" },
- "repository": {
- "type": "git",
- "url": "http://gitlab.xxx.com/msd/leak-scan/tree/master"
- },
- "private": true,
- "originTemplate": "@alifd/scaffold-lite-js"
-}
diff --git a/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/app.js b/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/app.js
deleted file mode 100644
index fb01b106b4..0000000000
--- a/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/app.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { createApp } from "ice";
-
-const appConfig = {
- app: {
- rootId: "app",
- },
- router: {
- type: "hash",
- },
-};
-createApp(appConfig);
diff --git a/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/global.scss b/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/global.scss
deleted file mode 100644
index cc339ce97b..0000000000
--- a/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/global.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-// 引入默认全局样式
-@import "@alifd/next/reset.scss";
-
-body {
- -webkit-font-smoothing: antialiased;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/i18n.js
deleted file mode 100644
index 60e05915d9..0000000000
--- a/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,77 +0,0 @@
-const i18nConfig = {};
-
-let locale =
- typeof navigator === "object" && typeof navigator.language === "string"
- ? navigator.language
- : "zh-CN";
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === "object" &&
- (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === "string"
- ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? "")
- : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg =
- i18nConfig[locale]?.[id] ??
- i18nConfig[locale.replace("-", "_")]?.[id] ??
- defaultMessage;
- if (msg == null) {
- console.warn("[i18n]: unknown message id: %o (locale=%o)", id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace("-", "_")];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || "zh_CN"] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/pages/Test/index.jsx b/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/pages/Test/index.jsx
deleted file mode 100644
index 79fe13a04b..0000000000
--- a/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/pages/Test/index.jsx
+++ /dev/null
@@ -1,1065 +0,0 @@
-// 注意: 出码引擎注入的临时变量默认都以 "__$$" 开头，禁止在搭建的代码中直接访问。
-// 例外：react 框架的导出名和各种组件名除外。
-import React from "react";
-
-import {
- Modal,
- Steps,
- Form,
- Input,
- Checkbox,
- Select,
- DatePicker,
- InputNumber,
- Button,
-} from "@alilc/antd-lowcode/dist/antd-lowcode.esm.js";
-
-import {
- Text as NextText,
- Page as NextPage,
- Block as NextBlock,
- P as NextP,
-} from "@alife/container/lib/index.js";
-
-import utils, { RefsManager } from "../../utils";
-
-import * as __$$i18n from "../../i18n";
-
-import "./index.css";
-
-const NextBlockCell = NextBlock.Cell;
-
-class Test$$Page extends React.Component {
- _context = this;
-
- constructor(props, context) {
- super(props);
-
- this.utils = utils;
-
- this._refsManager = new RefsManager();
-
- __$$i18n._inject2(this);
-
- this.state = {
- books: [],
- currentStep: 0,
- isModifyDialogVisible: false,
- isModifyStatus: false,
- secondCommitText: "完成并提交",
- thirdAuditText: "审核中",
- thirdButtonText: "修改",
- customerProjectInfo: {
- id: null,
- systemProjectName: null,
- projectVersionTypeArray: null,
- projectVersionType: null,
- versionLine: 2,
- expectedTime: null,
- expectedNum: null,
- projectModal: null,
- displayWidth: null,
- displayHeight: null,
- displayInch: null,
- displayDpi: null,
- mainSoc: null,
- cpuCoreNum: null,
- instructions: null,
- osVersion: null,
- status: null,
- },
- versionLinesArray: [
- { label: "AmapAuto 485", value: 1 },
- { label: "AmapAuto 505", value: 2 },
- ],
- projectModalsArray: [
- { label: "车机", value: 1 },
- { label: "车镜", value: 2 },
- { label: "记录仪", value: 3 },
- { label: "其他", value: 4 },
- ],
- osVersionsArray: [
- { label: "安卓5", value: 1 },
- { label: "安卓6", value: 2 },
- { label: "安卓7", value: 3 },
- { label: "安卓8", value: 4 },
- { label: "安卓9", value: 5 },
- { label: "安卓10", value: 6 },
- ],
- instructionsArray: [
- { label: "ARM64-V8", value: "ARM64-V8" },
- { label: "ARM32-V7", value: "ARM32-V7" },
- { label: "X86", value: "X86" },
- { label: "X64", value: "X64" },
- ],
- };
- }
-
- $ = (refName) => {
- return this._refsManager.get(refName);
- };
-
- $$ = (refName) => {
- return this._refsManager.getAll(refName);
- };
-
- componentDidUpdate(prevProps, prevState, snapshot) {}
-
- componentWillUnmount() {}
-
- __jp__init() {
- /*...*/
- }
-
- __jp__initRouter() {
- /*...*/
- }
-
- __jp__initDataSource() {
- /*...*/
- }
-
- __jp__initEnv() {
- /*...*/
- }
-
- __jp__initUtils() {
- /*...*/
- }
-
- onFinishFirst() {
- /*...*/
- }
-
- onClickPreSecond() {
- /*...*/
- }
-
- onFinishSecond() {
- /*...*/
- }
-
- onClickModifyThird() {
- /*...*/
- }
-
- onOkModifyDialogThird() {
- //第三步 修改 对话框 确定
- this.setState({
- currentStep: 0,
- isModifyDialogVisible: false,
- });
- }
-
- onCancelModifyDialogThird() {
- //第三步 修改 对话框 取消
- this.setState({
- isModifyDialogVisible: false,
- });
- }
-
- onFinishFailed() {}
-
- onClickPreThird() {
- // 第三步 上一步
- this.setState({
- currentStep: 1,
- });
- }
-
- onClickFirstBack() {
- // 第一步 返回按钮
- this.$router.push("/myProjectList");
- }
-
- onClickSecondBack() {
- // 第二步 返回按钮
- this.$router.push("/myProjectList");
- }
-
- onClickThirdBack() {
- // 第三步 返回按钮
- this.$router.push("/myProjectList");
- }
-
- onValuesChange(_, values) {
- this.setState({
- customerProjectInfo: { ...this.state.customerProjectInfo, ...values },
- });
- }
-
- componentDidMount() {}
-
- render() {
- const __$$context = this._context || this;
- const { state } = __$$context;
- return (
-
- this.state.isModifyDialogVisible)}
- okText="确认"
- okType=""
- forceRender={false}
- cancelText="取消"
- zIndex={2000}
- destroyOnClose={false}
- confirmLoading={false}
- __events={{
- eventDataList: [
- {
- type: "componentEvent",
- name: "onOk",
- relatedEventName: "onOkModifyDialogThird",
- },
- {
- type: "componentEvent",
- name: "onCancel",
- relatedEventName: "onCancelModifyDialogThird",
- },
- ],
- eventList: [
- { name: "onCancel", disabled: true },
- { name: "onOk", disabled: true },
- ],
- }}
- onOk={function () {
- this.onOkModifyDialogThird.apply(
- this,
- Array.prototype.slice.call(arguments).concat([])
- );
- }.bind(this)}
- onCancel={function () {
- this.onCancelModifyDialogThird.apply(
- this,
- Array.prototype.slice.call(arguments).concat([])
- );
- }.bind(this)}
- >
-
- 修改将撤回此前填写的信息
-
-
-
-
-
-
- this.state.currentStep)}>
-
-
- {!!__$$eval(() => this.state.currentStep === 0) && (
-
-
-
- )}
- {!!__$$eval(() => this.state.currentStep === 1) && (
-
-
-
- )}
- {!!__$$eval(() => this.state.currentStep === 2) && (
-
-
-
- )}
-
-
-
-
- );
- }
-}
-
-export default Test$$Page;
-
-function __$$eval(expr) {
- try {
- return expr();
- } catch (error) {}
-}
-
-function __$$evalArray(expr) {
- const res = __$$eval(expr);
- return Array.isArray(res) ? res : [];
-}
-
-function __$$createChildContext(oldContext, ext) {
- const childContext = {
- ...oldContext,
- ...ext,
- };
- childContext.__proto__ = oldContext;
- return childContext;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/routes.js b/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/routes.js
deleted file mode 100644
index ce50d58b70..0000000000
--- a/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/routes.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import Test from "@/pages/Test";
-
-import BasicLayout from "@/layouts/BasicLayout";
-
-const routerConfig = [
- {
- path: "/",
- component: BasicLayout,
- children: [
- {
- path: "",
- component: Test,
- },
- ],
- },
-];
-
-export default routerConfig;
diff --git a/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/utils.js b/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/utils.js
deleted file mode 100644
index 3d3ca9a81c..0000000000
--- a/modules/code-generator/test-cases/react-app/demo7-literal-condition2/expected/demo-project/src/utils.js
+++ /dev/null
@@ -1,47 +0,0 @@
-import { createRef } from "react";
-
-export class RefsManager {
- constructor() {
- this.refInsStore = {};
- }
-
- clearNullRefs() {
- Object.keys(this.refInsStore).forEach((refName) => {
- const filteredInsList = this.refInsStore[refName].filter(
- (insRef) => !!insRef.current
- );
- if (filteredInsList.length > 0) {
- this.refInsStore[refName] = filteredInsList;
- } else {
- delete this.refInsStore[refName];
- }
- });
- }
-
- get(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName][0].current;
- }
-
- return null;
- }
-
- getAll(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName].map((i) => i.current);
- }
-
- return [];
- }
-
- linkRef(refName) {
- const refIns = createRef();
- this.refInsStore[refName] = this.refInsStore[refName] || [];
- this.refInsStore[refName].push(refIns);
- return refIns;
- }
-}
-
-export default {};
diff --git a/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/package.json b/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/package.json
deleted file mode 100644
index 97a6334be2..0000000000
--- a/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/package.json
+++ /dev/null
@@ -1,42 +0,0 @@
-{
- "name": "icejs-demo-app",
- "version": "0.1.5",
- "description": "轻量级模板，使用 JavaScript，仅包含基础的 Layout。",
- "dependencies": {
- "moment": "^2.24.0",
- "react": "^16.4.1",
- "react-dom": "^16.4.1",
- "react-router": "^5.2.1",
- "@alifd/theme-design-pro": "^0.x",
- "intl-messageformat": "^9.3.6",
- "@ice/store": "^1.4.3",
- "@loadable/component": "^5.15.2",
- "@alilc/lowcode-datasource-engine": "latest",
- "@alilc/lowcode-datasource-http-handler": "latest",
- "@alilc/lowcode-components": "^1.0.0"
- },
- "devDependencies": {
- "@ice/spec": "^1.0.0",
- "build-plugin-fusion": "^0.1.0",
- "build-plugin-moment-locales": "^0.1.0",
- "eslint": "^6.0.1",
- "ice.js": "^1.0.0",
- "stylelint": "^13.2.0"
- },
- "scripts": {
- "start": "icejs start",
- "build": "icejs build",
- "lint": "npm run eslint && npm run stylelint",
- "eslint": "eslint --cache --ext .js,.jsx ./",
- "stylelint": "stylelint ./**/*.scss"
- },
- "ideMode": { "name": "ice-react" },
- "iceworks": { "type": "react", "adapter": "adapter-react-v3" },
- "engines": { "node": ">=8.0.0" },
- "repository": {
- "type": "git",
- "url": "http://gitlab.xxx.com/msd/leak-scan/tree/master"
- },
- "private": true,
- "originTemplate": "@alifd/scaffold-lite-js"
-}
diff --git a/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/app.js b/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/app.js
deleted file mode 100644
index fb01b106b4..0000000000
--- a/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/app.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { createApp } from "ice";
-
-const appConfig = {
- app: {
- rootId: "app",
- },
- router: {
- type: "hash",
- },
-};
-createApp(appConfig);
diff --git a/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/global.scss b/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/global.scss
deleted file mode 100644
index cc339ce97b..0000000000
--- a/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/global.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-// 引入默认全局样式
-@import "@alifd/next/reset.scss";
-
-body {
- -webkit-font-smoothing: antialiased;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/i18n.js b/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/i18n.js
deleted file mode 100644
index 60e05915d9..0000000000
--- a/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/i18n.js
+++ /dev/null
@@ -1,77 +0,0 @@
-const i18nConfig = {};
-
-let locale =
- typeof navigator === "object" && typeof navigator.language === "string"
- ? navigator.language
- : "zh-CN";
-
-const getLocale = () => locale;
-
-const setLocale = (target) => {
- locale = target;
-};
-
-const isEmptyVariables = (variables) =>
- (Array.isArray(variables) && variables.length === 0) ||
- (typeof variables === "object" &&
- (!variables || Object.keys(variables).length === 0));
-
-// 按低代码规范里面的要求进行变量替换
-const format = (msg, variables) =>
- typeof msg === "string"
- ? msg.replace(/\$\{(\w+)\}/g, (match, key) => variables?.[key] ?? "")
- : msg;
-
-const i18nFormat = ({ id, defaultMessage, fallback }, variables) => {
- const msg =
- i18nConfig[locale]?.[id] ??
- i18nConfig[locale.replace("-", "_")]?.[id] ??
- defaultMessage;
- if (msg == null) {
- console.warn("[i18n]: unknown message id: %o (locale=%o)", id, locale);
- return fallback === undefined ? `${id}` : fallback;
- }
-
- return format(msg, variables);
-};
-
-const i18n = (id, params) => {
- return i18nFormat({ id }, params);
-};
-
-// 将国际化的一些方法注入到目标对象&上下文中
-const _inject2 = (target) => {
- target.i18n = i18n;
- target.getLocale = getLocale;
- target.setLocale = (locale) => {
- setLocale(locale);
- target.forceUpdate();
- };
- target._i18nText = (t) => {
- // 优先取直接传过来的语料
- const localMsg = t[locale] ?? t[String(locale).replace("-", "_")];
- if (localMsg != null) {
- return format(localMsg, t.params);
- }
-
- // 其次用项目级别的
- const projectMsg = i18nFormat({ id: t.key, fallback: null }, t.params);
- if (projectMsg != null) {
- return projectMsg;
- }
-
- // 兜底用 use 指定的或默认语言的
- return format(t[t.use || "zh_CN"] ?? t.en_US, t.params);
- };
-
- // 注入到上下文中去
- if (target._context && target._context !== target) {
- Object.assign(target._context, {
- i18n,
- getLocale,
- setLocale: target.setLocale,
- });
- }
-};
-
-export { getLocale, setLocale, i18n, i18nFormat, _inject2 };
diff --git a/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/pages/Example/index.jsx b/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/pages/Example/index.jsx
deleted file mode 100644
index 06bc59021f..0000000000
--- a/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/pages/Example/index.jsx
+++ /dev/null
@@ -1,110 +0,0 @@
-// 注意: 出码引擎注入的临时变量默认都以 "__$$" 开头，禁止在搭建的代码中直接访问。
-// 例外：react 框架的导出名和各种组件名除外。
-import React from "react";
-
-import { Page, Table } from "@alilc/lowcode-components";
-
-import { createHttpHandler as __$$createHttpRequestHandler } from "@alilc/lowcode-datasource-http-handler";
-
-import { create as __$$createDataSourceEngine } from "@alilc/lowcode-datasource-engine/runtime";
-
-import utils from "../../utils";
-
-import * as __$$i18n from "../../i18n";
-
-import "./index.css";
-
-class Example$$Page extends React.Component {
- _context = this;
-
- _dataSourceConfig = this._defineDataSourceConfig();
- _dataSourceEngine = __$$createDataSourceEngine(this._dataSourceConfig, this, {
- runtimeConfig: true,
- requestHandlersMap: { http: __$$createHttpRequestHandler() },
- });
-
- get dataSourceMap() {
- return this._dataSourceEngine.dataSourceMap || {};
- }
-
- reloadDataSource = async () => {
- await this._dataSourceEngine.reloadDataSource();
- };
-
- constructor(props, context) {
- super(props);
-
- this.utils = utils;
-
- __$$i18n._inject2(this);
-
- this.state = {};
- }
-
- $ = () => null;
-
- $$ = () => [];
-
- _defineDataSourceConfig() {
- const _this = this;
- return {
- list: [
- {
- id: "userList",
- type: "http",
- description: "用户列表",
- options: function () {
- return {
- uri: "https://api.example.com/user/list",
- };
- },
- isInit: function () {
- return undefined;
- },
- },
- ],
- };
- }
-
- componentDidMount() {
- this._dataSourceEngine.reloadDataSource();
- }
-
- render() {
- const __$$context = this._context || this;
- const { state } = __$$context;
- return (
-
- this.dataSourceMap["userList"])}
- columns={[
- { dataIndex: "name", title: "姓名" },
- { dataIndex: "age", title: "年龄" },
- ]}
- />
-
- );
- }
-}
-
-export default Example$$Page;
-
-function __$$eval(expr) {
- try {
- return expr();
- } catch (error) {}
-}
-
-function __$$evalArray(expr) {
- const res = __$$eval(expr);
- return Array.isArray(res) ? res : [];
-}
-
-function __$$createChildContext(oldContext, ext) {
- const childContext = {
- ...oldContext,
- ...ext,
- };
- childContext.__proto__ = oldContext;
- return childContext;
-}
diff --git a/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/routes.js b/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/routes.js
deleted file mode 100644
index a381684b71..0000000000
--- a/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/routes.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import Example from "@/pages/Example";
-
-import BasicLayout from "@/layouts/BasicLayout";
-
-const routerConfig = [
- {
- path: "/",
- component: BasicLayout,
- children: [
- {
- path: "",
- component: Example,
- },
- ],
- },
-];
-
-export default routerConfig;
diff --git a/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/utils.js b/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/utils.js
deleted file mode 100644
index 3d3ca9a81c..0000000000
--- a/modules/code-generator/test-cases/react-app/demo8-datasource-prop/expected/demo-project/src/utils.js
+++ /dev/null
@@ -1,47 +0,0 @@
-import { createRef } from "react";
-
-export class RefsManager {
- constructor() {
- this.refInsStore = {};
- }
-
- clearNullRefs() {
- Object.keys(this.refInsStore).forEach((refName) => {
- const filteredInsList = this.refInsStore[refName].filter(
- (insRef) => !!insRef.current
- );
- if (filteredInsList.length > 0) {
- this.refInsStore[refName] = filteredInsList;
- } else {
- delete this.refInsStore[refName];
- }
- });
- }
-
- get(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName][0].current;
- }
-
- return null;
- }
-
- getAll(refName) {
- this.clearNullRefs();
- if (this.refInsStore[refName] && this.refInsStore[refName].length > 0) {
- return this.refInsStore[refName].map((i) => i.current);
- }
-
- return [];
- }
-
- linkRef(refName) {
- const refIns = createRef();
- this.refInsStore[refName] = this.refInsStore[refName] || [];
- this.refInsStore[refName].push(refIns);
- return refIns;
- }
-}
-
-export default {};
diff --git a/modules/code-generator/test-cases/react-app/demo9-datasource-engine/expected/demo-project/package.json b/modules/code-generator/test-cases/react-app/demo9-datasource-engine/expected/demo-project/package.json
deleted file mode 100644
index 60b0e37f11..0000000000
--- a/modules/code-generator/test-cases/react-app/demo9-datasource-engine/expected/demo-project/package.json
+++ /dev/null
@@ -1,42 +0,0 @@
-{
- "name": "icejs-demo-app",
- "version": "0.1.5",
- "description": "轻量级模板，使用 JavaScript，仅包含基础的 Layout。",
- "dependencies": {
- "moment": "^2.24.0",
- "react": "^16.4.1",
- "react-dom": "^16.4.1",
- "react-router": "^5.2.1",
- "@alifd/theme-design-pro": "^0.x",
- "intl-messageformat": "^9.3.6",
- "@ice/store": "^1.4.3",
- "@loadable/component": "^5.15.2",
- "@alilc/lowcode-datasource-engine": "latest",
- "@alilc/lowcode-datasource-jsonp-handler": "latest",
- "@alifd/next": "1.19.18"
- },
- "devDependencies": {
- "@ice/spec": "^1.0.0",
- "build-plugin-fusion": "^0.1.0",
- "build-plugin-moment-locales": "^0.1.0",
- "eslint": "^6.0.1",
- "ice.js": "^1.0.0",
- "stylelint": "^13.2.0"
- },
- "scripts": {
- "start": "icejs start",
- "build": "icejs build",
- "lint": "npm run eslint && npm run stylelint",
- "eslint": "eslint --cache --ext .js,.jsx ./",
- "stylelint": "stylelint ./**/*.scss"
- },
- "ideMode": { "name": "ice-react" },
- "iceworks": { "type": "react", "adapter": "adapter-react-v3" },
- "engines": { "node": ">=8.0.0" },
- "repository": {
- "type": "git",
- "url": "http://gitlab.xxx.com/msd/leak-scan/tree/master"
- },
- "private": true,
- "originTemplate": "@alifd/scaffold-lite-js"
-}
diff --git a/modules/code-generator/test-cases/react-app/demo9-datasource-engine/expected/demo-project/src/app.js b/modules/code-generator/test-cases/react-app/demo9-datasource-engine/expected/demo-project/src/app.js
deleted file mode 100644
index fb01b106b4..0000000000
--- a/modules/code-generator/test-cases/react-app/demo9-datasource-engine/expected/demo-project/src/app.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { createApp } from "ice";
-
-const appConfig = {
- app: {
- rootId: "app",
- },
- router: {
- type: "hash",
- },
-};
-createApp(appConfig);
diff --git a/modules/code-generator/test-cases/react-app/demo9-datasource-engine/expected/demo-project/src/components/Index/index.jsx b/modules/code-generator/test-cases/react-app/demo9-datasource-engine/expected/demo-project/src/components/Index/index.jsx
deleted file mode 100644
index 47bca5a63e..0000000000
--- a/modules/code-generator/test-cases/react-app/demo9-datasource-engine/expected/demo-project/src/components/Index/index.jsx
+++ /dev/null
@@ -1,120 +0,0 @@
-// 注意: 出码引擎注入的临时变量默认都以 "__$$" 开头，禁止在搭建的代码中直接访问。
-// 例外：react 框架的导出名和各种组件名除外。
-import React from "react";
-
-import { Switch } from "@alifd/next";
-
-import { createJsonpHandler as __$$createJsonpRequestHandler } from "@alilc/lowcode-datasource-jsonp-handler";
-
-import { create as __$$createDataSourceEngine } from "@alilc/lowcode-datasource-engine/runtime";
-
-import utils from "../../utils";
-
-import * as __$$i18n from "../../i18n";
-
-import "./index.css";
-
-class Index$$Page extends React.Component {
- _context = this;
-
- _dataSourceConfig = this._defineDataSourceConfig();
- _dataSourceEngine = __$$createDataSourceEngine(this._dataSourceConfig, this, {
- runtimeConfig: true,
- requestHandlersMap: { jsonp: __$$createJsonpRequestHandler() },
- });
-
- get dataSourceMap() {
- return this._dataSourceEngine.dataSourceMap || {};
- }
-
- reloadDataSource = async () => {
- await this._dataSourceEngine.reloadDataSource();
- };
-
- constructor(props, context) {
- super(props);
-
- this.utils = utils;
-
- __$$i18n._inject2(this);
-
- this.state = {};
- }
-
- $ = () => null;
-
- $$ = () => [];
-
- _defineDataSourceConfig() {
- const _this = this;
- return {
- list: [
- {
- id: "todos",
- isInit: function () {
- return true;
- },
- type: "jsonp",
- options: function () {
- return {
- method: "GET",
- uri: "https://a0ee9135-6a7f-4c0f-a215-f0f247ad907d.mock.pstmn.io",
- };
- },
- dataHandler: function dataHandler(data) {
- return data.data;
- },
- },
- ],
- };
- }
-
- componentDidMount() {
- this._dataSourceEngine.reloadDataSource();
- }
-
- render() {
- const __$$context = this._context || this;
- const { state } = __$$context;
- return (
-