让示例可以跑起来

This commit is contained in:
liaoxuezhi 2022-06-01 21:35:49 +08:00
parent 7a83562589
commit dcfef5ddb6
27 changed files with 249 additions and 166 deletions

View File

@ -11,8 +11,8 @@ import {
Select,
InputBox
} from 'amis';
import {eachTree, mapTree} from 'amis/lib/utils/helper';
import 'amis/lib/locale/en-US';
import {eachTree, mapTree} from 'amis-core';
import 'amis-ui/lib/locale/en-US';
import {withRouter} from 'react-router';
import DocSearch from './DocSearch';
import Doc from './Doc';

View File

@ -1,7 +1,7 @@
import React from 'react';
import {Switch} from 'react-router-dom';
import {flattenTree, filterTree, mapTree} from 'amis/lib/utils/helper';
import {flattenTree, filterTree, mapTree} from 'amis-core';
import {navigations2route} from './App';
import DocNavCN from './DocNavCN';

View File

@ -7,7 +7,7 @@ import example from './EChartsEditor/Example';
import {lazyData} from './LazyData';
import React from 'react';
import Spinner from 'amis/lib/components/Spinner';
import {Spinner} from 'amis-ui';
const LazyComponent = lazyData(
async () =>

View File

@ -1,7 +1,7 @@
import React from 'react';
import Editor from 'amis/editor/Editor';
import Switch from 'amis/components/Switch';
import Button from 'amis/components/Button';
import {Editor} from 'amis-ui';
import {Switch} from 'amis-ui';
import {Button} from 'amis-ui';
import schema from './Form/Test';
import Portal from 'react-overlays/Portal';

View File

@ -117,9 +117,6 @@ import Tab1Schema from './Tabs/Tab1';
import Tab2Schema from './Tabs/Tab2';
import Tab3Schema from './Tabs/Tab3';
import TestComponent from './Test';
import {normalizeLink} from 'amis/utils/normalizeLink';
import {Switch} from 'react-router-dom';
import {navigations2route} from './App';

View File

@ -1,5 +1,5 @@
import React from 'react';
import {FormItem, Renderer} from 'amis';
import {FormItem, Renderer} from 'amis-core';
@FormItem({
type: 'my-custom'

View File

@ -1,5 +1,5 @@
import React from 'react';
import TitleBar from 'amis/components/TitleBar';
import {TitleBar} from 'amis-ui';
import {render} from 'amis';
const Schema = {

View File

@ -3,12 +3,9 @@ import React from 'react';
import {findDOMNode} from 'react-dom';
import {createRoot} from 'react-dom/client';
import {getTheme, render} from 'amis';
import axios from 'axios';
import TitleBar from 'amis/lib/components/TitleBar';
import LazyComponent from 'amis/lib/components/LazyComponent';
import Overlay from 'amis/lib/components/Overlay';
import PopOver from 'amis/lib/components/PopOver';
import NestedLinks from 'amis/lib/components/AsideNav';
import {LazyComponent} from 'amis-core';
import {Overlay} from 'amis-ui';
import {PopOver} from 'amis-ui';
import classnames from 'classnames';
import {Link} from 'react-router-dom';
import Play from './Play';

View File

@ -1,15 +1,15 @@
import React from 'react';
import {toast, render, makeTranslator} from 'amis';
import {normalizeLink} from 'amis/lib/utils/normalizeLink';
import {isMobile} from 'amis/lib/utils/helper';
import attachmentAdpator from 'amis/lib/utils/attachmentAdpator';
import {alert, confirm} from 'amis/lib/components/Alert';
import {normalizeLink} from 'amis-core';
import {isMobile} from 'amis-core';
import {attachmentAdpator} from 'amis-core';
import {alert, confirm} from 'amis-ui';
import axios from 'axios';
import JSON5 from 'json5';
import CodeEditor from 'amis/lib/components/Editor';
import {Editor as CodeEditor} from 'amis-ui';
import copy from 'copy-to-clipboard';
import {matchPath} from 'react-router-dom';
import Drawer from 'amis/lib/components/Drawer';
import {Drawer} from 'amis-ui';
const DEFAULT_CONTENT = `{
"$schema": "/schemas/page.json#",

View File

@ -3,16 +3,14 @@ import {render, toast, Button, LazyComponent, Drawer} from 'amis';
import axios from 'axios';
import Portal from 'react-overlays/Portal';
import {toast} from 'amis';
import {normalizeLink} from 'amis/lib/utils/normalizeLink';
import {normalizeLink} from 'amis-core';
import {withRouter} from 'react-router';
import {matchPath} from 'react-router-dom';
import copy from 'copy-to-clipboard';
import {qsparse} from 'amis/lib/utils/helper';
import {qsparse} from 'amis-core';
function loadEditor() {
return new Promise(resolve =>
require(['amis/lib/components/Editor'], component =>
resolve(component.default))
require(['amis-ui'], component => resolve(component.Editor))
);
}

View File

@ -4,7 +4,7 @@ import {createRoot} from 'react-dom/client';
import axios from 'axios';
import {match} from 'path-to-regexp';
import copy from 'copy-to-clipboard';
import {normalizeLink} from 'amis/lib/utils/normalizeLink';
import {normalizeLink} from 'amis-core';
import qs from 'qs';
import {
@ -17,11 +17,11 @@ import {
makeTranslator
} from 'amis';
import 'amis/lib/locale/en-US';
import 'amis-ui/lib/locale/en-US';
import 'history';
import attachmentAdpator from 'amis/lib/utils/attachmentAdpator';
import {attachmentAdpator} from 'amis-core';
import type {ToastLevel, ToastConf} from 'amis/lib/components/Toast';
import type {ToastLevel, ToastConf} from 'amis-ui/lib/components/Toast';
export function embed(
container: string | HTMLElement,

View File

@ -1,21 +1,16 @@
<!DOCTYPE html>
<html lang="zh">
<head>
<head>
<meta charset="UTF-8" />
<title>amis - 低代码前端框架</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="image/x-icon" rel="shortcut icon" href="./static/favicon.png" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1"
/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<link rel="stylesheet" href="./static/iconfont.css" />
<link rel="stylesheet" href="@fortawesome/fontawesome-free/css/all.css" />
<link
rel="stylesheet"
href="@fortawesome/fontawesome-free/css/v4-shims.css"
/>
<link rel="stylesheet" href="@fortawesome/fontawesome-free/css/v4-shims.css" />
<link rel="stylesheet" href="prismjs/themes/prism.css" />
<!--DEPENDENCIES_INJECT_PLACEHOLDER-->
<link rel="stylesheet" href="./doc.css" />
@ -46,52 +41,52 @@
document.write(
`<link rel="stylesheet" title="ang" ${
theme !== 'ang' ? 'disabled' : ''
} href="${__uri('amis/scss/themes/ang.scss')}" />`
} href="${__uri('amis-ui/lib/themes/ang.css')}" />`
);
document.write(
`<link rel="stylesheet" title="cxd" ${
theme !== 'cxd' ? 'disabled' : ''
} href="${__uri('amis/scss/themes/cxd.scss')}" />`
} href="${__uri('amis-ui/lib/themes/cxd.css')}" />`
);
document.write(
`<link rel="stylesheet" title="dark" ${
theme !== 'dark' ? 'disabled' : ''
} href="${__uri('amis/scss/themes/dark.scss')}" />`
} href="${__uri('amis-ui/lib/themes/dark.css')}" />`
);
document.write(
`<link rel="stylesheet" title="antd" ${
theme !== 'antd' ? 'disabled' : ''
} href="${__uri('amis/scss/themes/antd.scss')}" />`
} href="${__uri('amis-ui/lib/themes/antd.css')}" />`
);
} else {
document.write(
`<link rel="stylesheet" title="ang" ${
theme !== 'ang' ? 'disabled' : ''
} href="${__uri('amis/scss/themes/ang-ie11.scss')}" />`
} href="${__uri('amis-ui/lib/themes/ang-ie11.css')}" />`
);
document.write(
`<link rel="stylesheet" title="cxd" ${
theme !== 'cxd' ? 'disabled' : ''
} href="${__uri('amis/scss/themes/cxd-ie11.scss')}" />`
} href="${__uri('amis-ui/lib/themes/cxd-ie11.css')}" />`
);
document.write(
`<link rel="stylesheet" title="dark" ${
theme !== 'dark' ? 'disabled' : ''
} href="${__uri('amis/scss/themes/dark-ie11.scss')}" />`
} href="${__uri('amis-ui/lib/themes/dark-ie11.css')}" />`
);
document.write(
`<link rel="stylesheet" title="antd" ${
theme !== 'antd' ? 'disabled' : ''
} href="${__uri('amis/scss/themes/antd-ie11.scss')}" />`
} href="${__uri('amis-ui/lib/themes/antd-ie11.css')}" />`
);
}
</script>
<!--ignore-->
<link rel="stylesheet" href="amis/scss/helper.scss" />
<link rel="stylesheet" href="amis-ui/lib/helper.css" />
<!--ignore-->
</head>
</head>
<body>
<body>
<div id="root" class="app-wrapper"></div>
<script src="./mod.js"></script>
<script type="text/javascript">
@ -116,5 +111,6 @@
app.bootstrap(document.getElementById('root'), initialState);
});
</script>
</body>
</body>
</html>

View File

@ -9,7 +9,7 @@ import {createRoot} from 'react-dom/client';
import axios from 'axios';
import copy from 'copy-to-clipboard';
import {toast} from 'amis';
import 'amis/lib/locale/en-US';
import 'amis-ui/lib/locale/en-US';
import {render as renderAmis} from 'amis';

View File

@ -1,6 +1,6 @@
@import 'node_modules/amis/scss/mixins';
@import 'node_modules/amis/scss/functions';
@import 'node_modules/amis/scss/variables';
@import 'node_modules/amis-ui/scss/mixins';
@import 'node_modules/amis-ui/scss/functions';
@import 'node_modules/amis-ui/scss/variables';
body {
background-color: #fff !important;

View File

@ -9,5 +9,21 @@
"stop": "fis3 server stop",
"dev": "fis3 release -cwd ./public",
"deploy-gh-page": "sh ./deploy-gh-pages.sh"
},
"devDependencies": {
"fis-optimizer-terser": "^1.0.1",
"fis-parser-sass": "^1.1.1",
"fis-parser-svgr": "^1.0.0",
"fis3": "^3.4.41",
"fis3-deploy-skip-packed": "0.0.5",
"fis3-hook-commonjs": "^0.1.31",
"fis3-hook-node_modules": "^2.3.1",
"fis3-hook-relative": "^2.0.3",
"fis3-packager-deps-pack": "^0.1.2",
"fis3-parser-typescript": "^1.4.0",
"fis3-postpackager-loader": "^2.1.12",
"fis3-prepackager-stand-alone-pack": "^1.0.0",
"fis3-preprocessor-js-require-css": "^0.1.3",
"fis3-preprocessor-js-require-file": "^0.1.3"
}
}

View File

@ -55,7 +55,9 @@
"react-dom": "^18.0.0",
"react-json-view": "1.21.3",
"react-visibility-sensor": "5.1.1",
"tslib": "^2.3.1"
"tslib": "^2.3.1",
"markdown-it": "^12.0.6",
"markdown-it-html5-media": "^0.7.1"
},
"jest": {
"testEnvironment": "jsdom",

View File

@ -146,6 +146,7 @@ export function renderChild(
return (
<SchemaRenderer
render={renderChild as any}
{...props}
schema={schema}
propKey={schema.key}

View File

@ -71,10 +71,6 @@ import {
import {Schema} from './types';
import ScopedRootRenderer, {RootRenderProps} from './Root';
import {envOverwrite} from './envOverwrite';
import {wrapFetcher} from './utils/api';
import {autobind, promisify} from './utils/helper';
import {enableDebug} from './utils/debug';
import {replaceText} from './utils/replaceText';
import {EnvContext, RendererEnv} from './env';
import React from 'react';
import {
@ -90,6 +86,7 @@ import {
} from 'amis-formula';
import LazyComponent from './components/LazyComponent';
import {FormHorizontal, FormRenderer} from './renderers/Form';
import {enableDebug, promisify, replaceText, wrapFetcher} from './utils/index';
export {
clearStoresCache,
@ -135,7 +132,6 @@ export {
localeable,
LocaleProps,
TranslateFn,
autobind,
ClassNamesFn,
// amis-formula 相关
parse,

View File

@ -36,7 +36,9 @@ const themes: {
[propName: string]: ThemeConfig;
} = {
default: {},
cxd: {}
cxd: {
classPrefix: 'cxd-'
}
};
export function theme(name: string, config: Partial<ThemeConfig>) {

View File

@ -5,7 +5,7 @@
* @returns
*/
export default function attachmentAdpator(response: any, __: Function) {
export function attachmentAdpator(response: any, __: Function) {
if (response && response.headers && response.headers['content-disposition']) {
const disposition = response.headers['content-disposition'];
let filename = '';
@ -88,3 +88,5 @@ export default function attachmentAdpator(response: any, __: Function) {
return response;
}
export default attachmentAdpator;

View File

@ -162,7 +162,7 @@ export function findIndex(
return -1;
}
export function hasOwnProperty(
export function hasOwnPropertyInPath(
data: {[propName: string]: any},
key: string
): boolean {

View File

@ -1,32 +1,54 @@
export * from './helper';
export * from './resize-sensor';
export * from './api';
export * from './tpl';
export * from './tpl-builtin';
export * from './DataScope';
export * from './DataSchema';
export * from './normalizeOptions';
export * from './validations';
export * from './icon';
export * from './style';
export * from './RootClose';
export * from './dom';
export * from './attachmentAdpator';
export * from './autobind';
export * from './ColorScale';
export * from './columnsSplit';
export * from './highlight';
export * from './dataMapping';
export * from './DataSchema';
export * from './DataScope';
export * from './date';
export * from './debug';
export * from './dom';
export * from './errors';
export * from './escapeHtml';
export * from './filter-schema';
export * from './SimpleMap';
export * from './optionValueCompare';
export * from './filter';
export * from './formatDuration';
export * from './formula';
export * from './getVariable';
export * from './grammar';
export * from './handleAction';
export * from './helper';
export * from './highlight';
export * from './icon';
export * from './image';
export * from './isPureVariable';
export * from './json-schema-2-amis-schema';
export * from './keyToPath';
export * from './makeSorter';
export * from './markdown';
export * from './normalizeLink';
export * from './normalizeOptions';
export * from './object';
export * from './offset';
export * from './offsetParent';
export * from './ColorScale';
export * from './optionValueCompare';
export * from './position';
export * from './prettyBytes';
export * from './renderer-event';
export * from './handleAction';
export * from './replaceText';
export * from './resize-sensor';
export * from './resolveVariable';
export * from './resolveVariableAndFilter';
export * from './RootClose';
export * from './scrollPosition';
export * from './formula';
export * from './grammar';
import './debug';
export * from './SimpleMap';
export * from './string2regExp';
export * from './style';
export * from './tokenize';
export * from './tpl-builtin';
export * from './tpl';
export * from './validations';
import animation from './Animation';
import markdownRender from './markdown';

View File

@ -6,13 +6,15 @@ import markdownIt from 'markdown-it';
// @ts-ignore
import {html5Media} from 'markdown-it-html5-media';
const markdown = markdownIt();
const doMarkdown = markdownIt();
markdown.use(html5Media);
doMarkdown.use(html5Media);
export default function (content: string, options?: markdownIt.Options) {
export function markdown(content: string, options?: markdownIt.Options) {
if (options) {
markdown.set(options);
doMarkdown.set(options);
}
return markdown.render(content);
return doMarkdown.render(content);
}
export default markdown;

View File

@ -14,10 +14,7 @@ const nodeName = (node: Element) =>
* @param node the element
* @param offsetParent the offset parent
*/
export default function position(
node: HTMLElement,
offsetParent?: HTMLElement
) {
export function position(node: HTMLElement, offsetParent?: HTMLElement) {
let parentOffset = {top: 0, left: 0};
let offset;
// Fixed elements are offset from window (parentOffset = {top:0, left: 0},
@ -53,3 +50,5 @@ export default function position(
left: offset.left - parentOffset.left - (parseInt(marginLeft, 10) || 0)
};
}
export default position;

View File

@ -59,17 +59,23 @@
"@rollup/plugin-typescript": "^8.3.2",
"@svgr/rollup": "^6.2.1",
"@testing-library/jest-dom": "^5.16.4",
"@types/babel__core": "^7.1.19",
"@types/jest": "^27.0.2",
"@types/react": "^17.0.39",
"@types/react-dom": "^17.0.11",
"autoprefixer": "^10.4.7",
"jest": "^27.2.1",
"moment-timezone": "^0.5.34",
"postcss-import": "^14.1.0",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"rimraf": "^3.0.2",
"rollup": "^2.73.0",
"rollup-plugin-auto-external": "^2.0.0",
"rollup-plugin-license": "^2.7.0",
"rollup-plugin-postcss": "^4.0.2",
"rollup-plugin-scss": "^3.0.0",
"sass": "^1.52.1",
"typescript": "^4.6.4"
}
}

View File

@ -5,6 +5,11 @@ import resolve from '@rollup/plugin-node-resolve';
import typescript from '@rollup/plugin-typescript';
import license from 'rollup-plugin-license';
import autoExternal from 'rollup-plugin-auto-external';
import sass from 'sass';
import postcss from 'rollup-plugin-postcss';
import postcssImport from 'postcss-import';
import autoprefixer from 'autoprefixer';
import {
name,
version,
@ -41,7 +46,14 @@ const input = [
export default [
{
input,
input: input.concat([
'./scss/themes/antd.scss',
'./scss/themes/ang.scss',
'./scss/themes/cxd.scss',
'./scss/themes/dark.scss',
'./scss/themes/default.scss',
'./scss/helper.scss'
]),
output: [
{
@ -55,24 +67,42 @@ export default [
],
external,
plugins: getPlugins('cjs')
},
{
input,
output: [
{
...settings,
dir: path.dirname(module),
format: 'esm',
exports: 'named',
preserveModulesRoot: './src',
preserveModules: true // Keep directory structure and files
}
],
external,
plugins: getPlugins('esm')
.concat(
['antd', 'ang', 'cxd', 'dark', 'default'].map(theme =>
postcss({
include: `**/${theme}.scss`,
// process: processSass,
extract: path.resolve(`lib/themes/${theme}.css`),
plugins: [postcssImport(), autoprefixer()]
})
)
)
.concat(
postcss({
include: `**/helper.scss`,
// process: processSass,
extract: path.resolve(`lib/helper.css`),
plugins: [postcssImport(), autoprefixer()]
})
)
}
// {
// input,
// output: [
// {
// ...settings,
// dir: path.dirname(module),
// format: 'esm',
// exports: 'named',
// preserveModulesRoot: './src',
// preserveModules: true // Keep directory structure and files
// }
// ],
// external,
// plugins: getPlugins('esm')
// }
];
function transpileDynamicImportForCJS(options) {
@ -135,3 +165,20 @@ function getPlugins(format = 'esm') {
})
];
}
function processSass(context, payload) {
return new Promise((resolve, reject) => {
sass.render(
{
file: context
},
function (err, result) {
if (!err) {
resolve(result);
} else {
reject(err);
}
}
);
});
}

View File

@ -1,8 +1,8 @@
@import url('../node_modules/codemirror/lib/codemirror.css?__inline');
@import url('../node_modules/froala-editor/css/froala_style.min.css?__inline');
@import url('../node_modules/froala-editor/css/froala_editor.pkgd.min.css?__inline');
@import url('../node_modules/tinymce/skins/ui/oxide/skin.css?__inline');
@import url('../node_modules/video-react/dist/video-react.css?__inline');
@import url('../node_modules/cropperjs/dist/cropper.css?__inline');
@import url('codemirror/lib/codemirror.css');
@import url('froala-editor/css/froala_style.min.css');
@import url('froala-editor/css/froala_editor.pkgd.min.css');
@import url('tinymce/skins/ui/oxide/skin.css');
@import url('video-react/dist/video-react.css');
@import url('cropperjs/dist/cropper.css');
@import './components/react-datetime';