From 904bd3d4a28a2512dcbbeab57b7c5fbdc7feafbc Mon Sep 17 00:00:00 2001 From: "wuyue.xht" Date: Sun, 29 Mar 2020 17:28:52 +0800 Subject: [PATCH 1/4] chore: remove public identider --- packages/runtime/src/boot.ts | 12 ++++++------ packages/runtime/src/lazyComponent.tsx | 4 ++-- packages/runtime/src/provider.ts | 21 +++++++++++---------- 3 files changed, 19 insertions(+), 18 deletions(-) diff --git a/packages/runtime/src/boot.ts b/packages/runtime/src/boot.ts index 2598b18fe..6b99987e1 100644 --- a/packages/runtime/src/boot.ts +++ b/packages/runtime/src/boot.ts @@ -7,36 +7,36 @@ class Trunk { private layouts: { [key: string]: TComponent } = {}; private loading: TComponent | null = null; - public registerRenderer(renderer: TComponent): any { + registerRenderer(renderer: TComponent): any { this.renderer = renderer; } - public registerLayout(componentName: string, Layout: TComponent): any { + registerLayout(componentName: string, Layout: TComponent): any { if (!componentName || !Layout) { return; } this.layouts[componentName] = Layout; } - public registerLoading(component: TComponent) { + registerLoading(component: TComponent) { if (!component) { return; } this.loading = component; } - public getLayout(componentName: string) { + getLayout(componentName: string) { if (!componentName) { return; } return this.layouts[componentName]; } - public getRenderer(): TComponent | null { + getRenderer(): TComponent | null { return this.renderer; } - public getLoading(): TComponent | null { + getLoading(): TComponent | null { return this.loading; } } diff --git a/packages/runtime/src/lazyComponent.tsx b/packages/runtime/src/lazyComponent.tsx index 9acd799ce..b75bf8162 100644 --- a/packages/runtime/src/lazyComponent.tsx +++ b/packages/runtime/src/lazyComponent.tsx @@ -18,7 +18,7 @@ export default class LazyComponent extends Component { }; } - public async componentDidMount() { + async componentDidMount() { const { getPageData } = this.props; if (getPageData && !this.state.schema) { const schema = await getPageData(); @@ -26,7 +26,7 @@ export default class LazyComponent extends Component { } } - public render() { + render() { const { getPageData, ...restProps } = this.props; const { schema } = this.state; const Renderer = Boot.getRenderer(); diff --git a/packages/runtime/src/provider.ts b/packages/runtime/src/provider.ts index b0535d89d..1af619faf 100644 --- a/packages/runtime/src/provider.ts +++ b/packages/runtime/src/provider.ts @@ -24,17 +24,18 @@ export interface IAppConfig { } export default abstract class Provider { - public globalComponents: any = {}; - public globalUtils: any = {}; - public routerConfig: { [key: string]: string } = {}; - public layout: { componentName: string; props: any } | null = null; + globalComponents: any = {}; + globalUtils: any = {}; + routerConfig: { [key: string]: string } = {}; + layout: { componentName: string; props: any } | null = null; + componentsMap: any = null; private lazyElementsMap: { [key: string]: any } = {}; constructor() { this.init(); } - public create(appkey: string): Promise { + create(appkey: string): Promise { return new Promise(async (resolve, reject) => { try { const config = await this.getAppData(appkey); @@ -49,21 +50,21 @@ export default abstract class Provider { }); } - public async init() { + async init() { console.log('init'); } - public async getAppData(appkey: string, restOptions?: any): Promise { + async getAppData(appkey: string, restOptions?: any): Promise { console.log('getAppData'); return {}; } - public async getPageData(pageId: string, restOptions?: any): Promise { + async getPageData(pageId: string, restOptions?: any): Promise { console.log('getPageData'); return; } - public getLazyComponent(pageId: string, props: any): ReactElement | null { + getLazyComponent(pageId: string, props: any): ReactElement | null { if (!pageId) { return null; } @@ -82,7 +83,7 @@ export default abstract class Provider { } } - public createApp() { + createApp() { console.log('createApp'); return; } From 56c16ffa5c39c2d01abd9cfa90fea49a4539da1d Mon Sep 17 00:00:00 2001 From: "wuyue.xht" Date: Sun, 29 Mar 2020 22:31:42 +0800 Subject: [PATCH 2/4] feat: complet preview --- packages/demo/build.json | 3 +- packages/demo/package.json | 7 +- packages/demo/public/preview.html | 20 +++ .../src/{ => designer}/config/components.js | 0 .../src/{ => designer}/config/constants.js | 0 .../src/{ => designer}/config/skeleton.js | 0 .../demo/src/{ => designer}/config/theme.scss | 0 .../demo/src/{ => designer}/config/utils.js | 0 packages/demo/src/index.jsx | 8 +- packages/demo/src/preview.js | 22 ++++ packages/demo/src/preview/config/app.js | 21 ++++ .../demo/src/preview/config/components.js | 12 ++ .../demo/src/preview/config/componentsMap.js | 53 ++++++++ packages/demo/src/preview/config/utils.js | 1 + .../src/preview/layouts/BasicLayout/index.js | 27 ++++ .../preview/layouts/BasicLayout/index.less | 24 ++++ .../preview/plugins/loading/deep/index.less | 11 ++ .../preview/plugins/loading/deep/index.tsx | 3 + .../preview/plugins/loading/fusion/index.less | 9 ++ .../preview/plugins/loading/fusion/index.tsx | 4 + packages/demo/src/preview/plugins/provider.ts | 117 ++++++++++++++++++ packages/demo/src/preview/plugins/utils.js | 74 +++++++++++ packages/runtime/index.d.ts | 34 +++-- 23 files changed, 423 insertions(+), 27 deletions(-) create mode 100644 packages/demo/public/preview.html rename packages/demo/src/{ => designer}/config/components.js (100%) rename packages/demo/src/{ => designer}/config/constants.js (100%) rename packages/demo/src/{ => designer}/config/skeleton.js (100%) rename packages/demo/src/{ => designer}/config/theme.scss (100%) rename packages/demo/src/{ => designer}/config/utils.js (100%) create mode 100644 packages/demo/src/preview/config/app.js create mode 100644 packages/demo/src/preview/config/components.js create mode 100644 packages/demo/src/preview/config/componentsMap.js create mode 100644 packages/demo/src/preview/config/utils.js create mode 100644 packages/demo/src/preview/layouts/BasicLayout/index.js create mode 100644 packages/demo/src/preview/layouts/BasicLayout/index.less create mode 100644 packages/demo/src/preview/plugins/loading/deep/index.less create mode 100644 packages/demo/src/preview/plugins/loading/deep/index.tsx create mode 100644 packages/demo/src/preview/plugins/loading/fusion/index.less create mode 100644 packages/demo/src/preview/plugins/loading/fusion/index.tsx create mode 100644 packages/demo/src/preview/plugins/provider.ts create mode 100644 packages/demo/src/preview/plugins/utils.js diff --git a/packages/demo/build.json b/packages/demo/build.json index 623ad7a36..02e5fccff 100644 --- a/packages/demo/build.json +++ b/packages/demo/build.json @@ -1,7 +1,8 @@ { "entry": { "index": "src/index.jsx", - "react-simulator-renderer": "../react-simulator-renderer/src/index.js" + "react-simulator-renderer": "../react-simulator-renderer/src/index.js", + "preview": "src/preview.js" }, "vendor": false, "devServer": { diff --git a/packages/demo/package.json b/packages/demo/package.json index 2efe9ba32..b35294f08 100644 --- a/packages/demo/package.json +++ b/packages/demo/package.json @@ -10,11 +10,14 @@ "@ali/lowcode-editor-skeleton": "^0.8.0", "@ali/lowcode-plugin-components-pane": "^0.8.0", "@ali/lowcode-plugin-designer": "^0.8.0", - "@ali/lowcode-plugin-logo": "^0.8.0", - "@ali/lowcode-plugin-save": "^0.8.0", + "@ali/lowcode-plugin-sample-logo": "^0.8.0", + "@ali/lowcode-plugin-sample-save": "^0.8.0", "@ali/lowcode-plugin-undo-redo": "^0.8.0", + "@ali/lowcode-runtime": "^0.8.0", + "@ali/lowcode-react-renderer": "^0.8.0", "@alife/theme-lowcode-dark": "^0.1.0", "@alife/theme-lowcode-light": "^0.1.0", + "@alifd/next": "^1.19.21", "react": "^16.8.1", "react-dom": "^16.8.1" }, diff --git a/packages/demo/public/preview.html b/packages/demo/public/preview.html new file mode 100644 index 000000000..34c8cf86c --- /dev/null +++ b/packages/demo/public/preview.html @@ -0,0 +1,20 @@ + + + + + + + LowCodeEngine DEMO + + + + + + + + + + + + + diff --git a/packages/demo/src/config/components.js b/packages/demo/src/designer/config/components.js similarity index 100% rename from packages/demo/src/config/components.js rename to packages/demo/src/designer/config/components.js diff --git a/packages/demo/src/config/constants.js b/packages/demo/src/designer/config/constants.js similarity index 100% rename from packages/demo/src/config/constants.js rename to packages/demo/src/designer/config/constants.js diff --git a/packages/demo/src/config/skeleton.js b/packages/demo/src/designer/config/skeleton.js similarity index 100% rename from packages/demo/src/config/skeleton.js rename to packages/demo/src/designer/config/skeleton.js diff --git a/packages/demo/src/config/theme.scss b/packages/demo/src/designer/config/theme.scss similarity index 100% rename from packages/demo/src/config/theme.scss rename to packages/demo/src/designer/config/theme.scss diff --git a/packages/demo/src/config/utils.js b/packages/demo/src/designer/config/utils.js similarity index 100% rename from packages/demo/src/config/utils.js rename to packages/demo/src/designer/config/utils.js diff --git a/packages/demo/src/index.jsx b/packages/demo/src/index.jsx index f666fe2c5..342bb86fb 100644 --- a/packages/demo/src/index.jsx +++ b/packages/demo/src/index.jsx @@ -2,12 +2,12 @@ import React from 'react'; import ReactDOM from 'react-dom'; import Skeleton from '@ali/lowcode-editor-skeleton'; import { registerSetters } from '@ali/lowcode-setters'; -import config from './config/skeleton'; -import components from './config/components'; -import utils from './config/utils'; +import config from './designer/config/skeleton'; +import components from './designer/config/components'; +import utils from './designer/config/utils'; import './global.scss'; -import './config/theme.scss'; +import './designer/config/theme.scss'; registerSetters(); diff --git a/packages/demo/src/preview.js b/packages/demo/src/preview.js index e69de29bb..3ed2c2eca 100644 --- a/packages/demo/src/preview.js +++ b/packages/demo/src/preview.js @@ -0,0 +1,22 @@ +import { run, Boot } from '@ali/lowcode-runtime'; +import Renderer from '@ali/lowcode-react-renderer'; +import FusionLoading from './preview/plugins/loading/fusion'; +import BasicLayout from './preview/layouts/BasicLayout'; +import provider from './preview/plugins/provider'; + +// 注册渲染模块 +Boot.registerRenderer(Renderer); + +// 注册布局组件，可注册多个 +Boot.registerLayout('BasicLayout', BasicLayout); + +// 注册页面 loading +Boot.registerLoading(FusionLoading); + +const appProvider = provider.create('lowcode_demo'); // 入参为应用唯一标识 + +// 异步加载应用配置 +appProvider.then(({ App, config }) => { + // 启动应用 + run(App, config); +}); diff --git a/packages/demo/src/preview/config/app.js b/packages/demo/src/preview/config/app.js new file mode 100644 index 000000000..c1ad5b57c --- /dev/null +++ b/packages/demo/src/preview/config/app.js @@ -0,0 +1,21 @@ +export default { + sdkVersion: '1.0.3', + historyMode: 'hash', // 浏览器路由：brower 哈希路由：hash + constainerId: 'app', + layout: { + componentName: 'BasicLayout', + props: { + name: '低代码引擎预览 demo', + logo: { + src: 'https://img.alicdn.com/tfs/TB1kAfWyrY1gK0jSZTEXXXDQVXa-75-33.png', + width: 40, + height: 20, + }, + }, + }, + theme: { + package: '@alife/theme-fusion', + version: '^0.1.0', + }, + compDependencies: [], +}; diff --git a/packages/demo/src/preview/config/components.js b/packages/demo/src/preview/config/components.js new file mode 100644 index 000000000..91aef7993 --- /dev/null +++ b/packages/demo/src/preview/config/components.js @@ -0,0 +1,12 @@ +/** + * 内置组件 + */ +import Engine from '@ali/iceluna-sdk/lib/engine'; +import Page from '@ali/iceluna-sdk/lib/engine/pageEngine' +import Div from '@ali/iceluna-comp-div'; + +export default { + Engine, + Page, + Div, +} diff --git a/packages/demo/src/preview/config/componentsMap.js b/packages/demo/src/preview/config/componentsMap.js new file mode 100644 index 000000000..a9bb73edb --- /dev/null +++ b/packages/demo/src/preview/config/componentsMap.js @@ -0,0 +1,53 @@ +export default { + Button: { + package: '@alifd/next', + version: '1.19.18', + destructuring: true, + exportName: 'Button', + }, + 'Button.Group': { + package: '@alifd/next', + version: '1.19.18', + destructuring: true, + exportName: 'Button', + subName: 'Group', + }, + Input: { + package: '@alifd/next', + version: '1.19.18', + destructuring: true, + exportName: 'Input', + }, + Form: { + package: '@alifd/next', + version: '1.19.18', + destructuring: true, + exportName: 'Form', + }, + 'Form.Item': { + package: '@alifd/next', + version: '1.19.18', + destructuring: true, + exportName: 'Form', + subName: 'Item', + }, + NumberPicker: { + package: '@alifd/next', + version: '1.19.18', + destructuring: true, + exportName: 'NumberPicker', + }, + Select: { + package: '@alifd/next', + version: '1.19.18', + destructuring: true, + exportName: 'Select', + }, + 'Select.Option': { + package: '@alifd/next', + version: '1.19.18', + destructuring: true, + exportName: 'Select', + subName: 'Option', + }, +}; diff --git a/packages/demo/src/preview/config/utils.js b/packages/demo/src/preview/config/utils.js new file mode 100644 index 000000000..ff8b4c563 --- /dev/null +++ b/packages/demo/src/preview/config/utils.js @@ -0,0 +1 @@ +export default {}; diff --git a/packages/demo/src/preview/layouts/BasicLayout/index.js b/packages/demo/src/preview/layouts/BasicLayout/index.js new file mode 100644 index 000000000..6a51fdc75 --- /dev/null +++ b/packages/demo/src/preview/layouts/BasicLayout/index.js @@ -0,0 +1,27 @@ +import { Search, Icon, Shell } from '@alifd/next'; +import './index.less'; + +// eslint-disable-next-line react/prop-types +export default ({ name, children, logo }) => ( + + + logo + {name} + + + + + + + 用户头像 + MyName + + + {children} + + + Alibaba Fusion + @ 2019 Alibaba Piecework 版权所有 + + +); diff --git a/packages/demo/src/preview/layouts/BasicLayout/index.less b/packages/demo/src/preview/layouts/BasicLayout/index.less new file mode 100644 index 000000000..000abd1c8 --- /dev/null +++ b/packages/demo/src/preview/layouts/BasicLayout/index.less @@ -0,0 +1,24 @@ +@header-height: 52px; + +.avatar { + width: 24px; + height: 24px; + border-radius: 50%; + vertical-align: middle; +} + +.basic-shell { + min-height: 100vh; + .next-shell-header { + height: @header-height; + } + .next-shell-main { + flex: 1; + display: flex; + flex-flow: column; + min-height: calc(100% - @header-height); + .next-shell-sub-main { + flex: 1; + } + } +} diff --git a/packages/demo/src/preview/plugins/loading/deep/index.less b/packages/demo/src/preview/plugins/loading/deep/index.less new file mode 100644 index 000000000..2b59ea5ef --- /dev/null +++ b/packages/demo/src/preview/plugins/loading/deep/index.less @@ -0,0 +1,11 @@ +.recore-loading { + width: 48px; + height: 48px; + background: url(https://g.alicdn.com/uxcore/pic/loading.svg) center no-repeat; + background-size: contain; + position: fixed; + top: 50%; + left: 50%; + margin-top: -24px; + margin-left: -24px; +} diff --git a/packages/demo/src/preview/plugins/loading/deep/index.tsx b/packages/demo/src/preview/plugins/loading/deep/index.tsx new file mode 100644 index 000000000..02b2fc692 --- /dev/null +++ b/packages/demo/src/preview/plugins/loading/deep/index.tsx @@ -0,0 +1,3 @@ +import './index.less'; + +export default () =>
; diff --git a/packages/demo/src/preview/plugins/loading/fusion/index.less b/packages/demo/src/preview/plugins/loading/fusion/index.less new file mode 100644 index 000000000..0e53165cb --- /dev/null +++ b/packages/demo/src/preview/plugins/loading/fusion/index.less @@ -0,0 +1,9 @@ +.fusion-loading { + width: 48px; + height: 48px; + position: fixed; + top: 50%; + left: 50%; + margin-top: -24px; + margin-left: -24px; +} diff --git a/packages/demo/src/preview/plugins/loading/fusion/index.tsx b/packages/demo/src/preview/plugins/loading/fusion/index.tsx new file mode 100644 index 000000000..e61bfd9f0 --- /dev/null +++ b/packages/demo/src/preview/plugins/loading/fusion/index.tsx @@ -0,0 +1,4 @@ +import { Loading } from '@alifd/next'; +import './index.less'; + +export default () => ; diff --git a/packages/demo/src/preview/plugins/provider.ts b/packages/demo/src/preview/plugins/provider.ts new file mode 100644 index 000000000..d654af45e --- /dev/null +++ b/packages/demo/src/preview/plugins/provider.ts @@ -0,0 +1,117 @@ +import { createElement } from 'react'; +import { Provider, Boot, Router, navigator } from '@ali/lowcode-runtime'; +import appConfig from '../config/app'; +import builtInComps from '../config/components'; +import componentsMap from '../config/componentsMap'; +import util from '../config/utils'; +import { buildComponents } from './utils'; + +// 定制加载应用配置的逻辑 +class PreviewProvider extends Provider { + // 定制获取、处理应用配置（组件、插件、路由模式、布局等）的逻辑 + async getAppData(appkey: string, restOptions?: any): Promise { + const { historyMode, layout, constainerId } = appConfig; + const appSchemaStr: any = localStorage.getItem('lce-dev-store'); + const appSchema = JSON.parse(appSchemaStr || ''); + const history = { + mode: historyMode || 'hash', + basement: '/', + }; + this.layout = layout; + const routes: any = {}; + appSchema.componentsTree.forEach((page: any, idx: number) => { + if (!page.fileName) { + return; + } + const pageId = page.fileName; + routes[pageId] = `/${pageId}`; + }); + this.routerConfig = routes; + this.componentsMap = componentsMap; + this.globalComponents = { ...builtInComps, ...buildComponents({ '@alifd/next': 'Next' }, componentsMap) }; + this.globalUtils = util; + return { + history, + globalComponents: this.globalComponents, + globalUtils: this.globalUtils, + constainerId, + }; + } + + // 定制获取、处理页面 schema 的逻辑 + async getPageData(pageId: string, restOptions?: any) { + const appSchemaStr = localStorage.getItem('lce-dev-store'); + const appSchema = JSON.parse(appSchemaStr || ''); + const idx = appSchema.componentsTree.findIndex( + (page: any, idx: number) => (page.fileName || `page${idx}`) === pageId, + ); + const schema = appSchema.componentsTree[idx]; + return schema; + } + + // 定制构造根组件的逻辑，如切换路由机制 + createApp() { + if (!this.routerConfig) { + return; + } + const routes: Array<{ path: string; children: any; exact: boolean; keepAlive: boolean }> = []; + let homePageId = ''; + Object.keys(this.routerConfig).forEach((pageId: string, idx: number) => { + if (!pageId) { + return; + } + const path = this.routerConfig[pageId]; + if (idx === 0 || path === '/') { + homePageId = pageId; + } + routes.push({ + path, + children: (props: any) => this.getLazyComponent(pageId, props), + exact: true, + keepAlive: true, + }); + }); + if (homePageId) { + routes.push({ + path: '**', + children: (props: any) => this.getLazyComponent(homePageId, { ...props }), + exact: true, + keepAlive: true, + }); + } + const RouterView = (props: any) => { + return createElement(Router as any, { + routes, + components: this.globalComponents, + utils: this.globalUtils, + componentsMap: this.componentsMap, + ...props, + }); + }; + let App; + if (!this.layout || !(this.layout as any).componentName) { + App = (props: any) => createElement(RouterView, { ...props }); + return App; + } + const { componentName: layoutName, props: layoutProps } = this.layout as any; + const Layout = Boot.getLayout(layoutName); + if (Layout) { + App = (props: any) => + createElement( + Layout, + { + ...layoutProps, + onNavChange: ({ selectedKey }: any) => { + navigator.goto(`/${selectedKey}`); + }, + }, + RouterView({ props }), + ); + } else { + App = (props: any) => createElement(RouterView, props); + } + return App; + } +} + +export default new PreviewProvider(); diff --git a/packages/demo/src/preview/plugins/utils.js b/packages/demo/src/preview/plugins/utils.js new file mode 100644 index 000000000..b65d4864e --- /dev/null +++ b/packages/demo/src/preview/plugins/utils.js @@ -0,0 +1,74 @@ +function isESModule(obj) { + return obj && obj.__esModule; +} + +function getSubComponent(library, paths) { + const l = paths.length; + if (l < 1 || !library) { + return library; + } + let i = 0; + let component; + while (i < l) { + const key = paths[i]; + let ex; + try { + component = library[key]; + } catch (e) { + ex = e; + component = null; + } + if (i === 0 && component == null && key === 'default') { + if (ex) { + return l === 1 ? library : null; + } + component = library; + } else if (component == null) { + return null; + } + library = component; + i++; + } + return component; +} + +function accessLibrary(library) { + if (typeof library !== 'string') { + return library; + } + + return window[library]; +} + +function findComponent(libraryMap, componentName, npm) { + if (!npm) { + return accessLibrary(componentName); + } + // libraryName the key access to global + // export { exportName } from xxx exportName === global.libraryName.exportName + // export exportName from xxx exportName === global.libraryName.default || global.libraryName + // export { exportName as componentName } from package + // if exportName == null exportName === componentName; + // const componentName = exportName.subName, if exportName empty subName donot use + const exportName = npm.exportName || npm.componentName || componentName; + const libraryName = libraryMap[npm.package] || exportName; + const library = accessLibrary(libraryName); + const paths = npm.exportName && npm.subName ? npm.subName.split('.') : []; + if (npm.destructuring) { + paths.unshift(exportName); + } else if (isESModule(library)) { + paths.unshift('default'); + } + return getSubComponent(library, paths); +} + +export function buildComponents(libraryMap, componentsMap) { + const components = {}; + Object.keys(componentsMap).forEach((componentName) => { + const component = findComponent(libraryMap, componentName, componentsMap[componentName]); + if (component) { + components[componentName] = component; + } + }); + return components; +} diff --git a/packages/runtime/index.d.ts b/packages/runtime/index.d.ts index 5988aa400..6e3013290 100644 --- a/packages/runtime/index.d.ts +++ b/packages/runtime/index.d.ts @@ -1,25 +1,19 @@ import { ReactType } from 'react'; +type HistoryMode = 'browser' | 'hash'; -export as namespace LowCodeEngineRuntime; -export = LowCodeEngineRuntime; +interface ComponentsMap { + [key: string]: ReactType; +} -declare module LowCodeEngineRuntime { - type HistoryMode = 'browser' | 'hash'; +interface UtilsMap { + [key: string]: any; +} - interface ComponentsMap { - [key: string]: ReactType; - } +export interface AppConfig { + history?: HistoryMode; + globalComponents?: ComponentsMap; + globalUtils?: UtilsMap; + containerId?: string; +} - interface UtilsMap { - [key: string]: any; - } - - interface AppConfig { - history?: HistoryMode; - globalComponents?: ComponentsMap; - globalUtils?: UtilsMap; - containerId?: string; - } - - function runApp(Component: any, config?: AppConfig | (() => AppConfig), exposeModule?: boolean): any; -} \ No newline at end of file +export function run(Component: any, config?: AppConfig | (() => AppConfig)): any; From 2e4526667d563dccb85b9e3c60d862500f308915 Mon Sep 17 00:00:00 2001 From: "wuyue.xht" Date: Sun, 29 Mar 2020 23:01:55 +0800 Subject: [PATCH 3/4] fix: remove abstract identifer --- packages/runtime/src/provider.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/runtime/src/provider.ts b/packages/runtime/src/provider.ts index 1af619faf..9949e10c3 100644 --- a/packages/runtime/src/provider.ts +++ b/packages/runtime/src/provider.ts @@ -23,7 +23,7 @@ export interface IAppConfig { containerId?: string; } -export default abstract class Provider { +export default class Provider { globalComponents: any = {}; globalUtils: any = {}; routerConfig: { [key: string]: string } = {}; From 00ee9c2af4b2247a3f39c664b5aaaf311a3f5539 Mon Sep 17 00:00:00 2001 From: "wuyue.xht" Date: Sun, 29 Mar 2020 23:08:03 +0800 Subject: [PATCH 4/4] chore: optimize --- packages/demo/src/preview.js | 10 +++++----- packages/demo/src/preview/plugins/provider.ts | 7 ++----- packages/runtime/src/index.ts | 4 ++-- packages/runtime/src/lazyComponent.tsx | 6 +++--- 4 files changed, 12 insertions(+), 15 deletions(-) diff --git a/packages/demo/src/preview.js b/packages/demo/src/preview.js index 3ed2c2eca..a7d32c15e 100644 --- a/packages/demo/src/preview.js +++ b/packages/demo/src/preview.js @@ -1,17 +1,17 @@ -import { run, Boot } from '@ali/lowcode-runtime'; +import { boot, run } from '@ali/lowcode-runtime'; import Renderer from '@ali/lowcode-react-renderer'; import FusionLoading from './preview/plugins/loading/fusion'; import BasicLayout from './preview/layouts/BasicLayout'; import provider from './preview/plugins/provider'; // 注册渲染模块 -Boot.registerRenderer(Renderer); +boot.registerRenderer(Renderer); // 注册布局组件，可注册多个 -Boot.registerLayout('BasicLayout', BasicLayout); +boot.registerLayout('BasicLayout', BasicLayout); -// 注册页面 loading -Boot.registerLoading(FusionLoading); +// 注册页面 Loading +boot.registerLoading(FusionLoading); const appProvider = provider.create('lowcode_demo'); // 入参为应用唯一标识 diff --git a/packages/demo/src/preview/plugins/provider.ts b/packages/demo/src/preview/plugins/provider.ts index d654af45e..fc56ece03 100644 --- a/packages/demo/src/preview/plugins/provider.ts +++ b/packages/demo/src/preview/plugins/provider.ts @@ -1,5 +1,5 @@ import { createElement } from 'react'; -import { Provider, Boot, Router, navigator } from '@ali/lowcode-runtime'; +import { Provider, boot, Router } from '@ali/lowcode-runtime'; import appConfig from '../config/app'; import builtInComps from '../config/components'; import componentsMap from '../config/componentsMap'; @@ -94,16 +94,13 @@ class PreviewProvider extends Provider { return App; } const { componentName: layoutName, props: layoutProps } = this.layout as any; - const Layout = Boot.getLayout(layoutName); + const Layout = boot.getLayout(layoutName); if (Layout) { App = (props: any) => createElement( Layout, { ...layoutProps, - onNavChange: ({ selectedKey }: any) => { - navigator.goto(`/${selectedKey}`); - }, }, RouterView({ props }), ); diff --git a/packages/runtime/src/index.ts b/packages/runtime/src/index.ts index 37abfe968..dc637c4be 100644 --- a/packages/runtime/src/index.ts +++ b/packages/runtime/src/index.ts @@ -1,5 +1,5 @@ import { navigator, Router, runApp as run } from '@ali/recore'; -import Boot from './boot'; +import boot from './boot'; import Provider from './provider'; -export { run, Router, Boot, Provider, navigator }; +export { run, Router, boot, Provider, navigator }; diff --git a/packages/runtime/src/lazyComponent.tsx b/packages/runtime/src/lazyComponent.tsx index b75bf8162..18a582241 100644 --- a/packages/runtime/src/lazyComponent.tsx +++ b/packages/runtime/src/lazyComponent.tsx @@ -1,5 +1,5 @@ import { Component, createElement } from 'react'; -import Boot from './boot'; +import boot from './boot'; interface IProps { getPageData: () => any; @@ -29,8 +29,8 @@ export default class LazyComponent extends Component { render() { const { getPageData, ...restProps } = this.props; const { schema } = this.state; - const Renderer = Boot.getRenderer(); - const Loading = Boot.getLoading(); + const Renderer = boot.getRenderer(); + const Loading = boot.getLoading(); if (!Renderer || !schema) { if (!Loading) { return null;