feat:增加skeleton

packages/editor-framework/README.md

@@ -1 +1 @@
-编辑器框架
+## todo

packages/editor-framework/package.json

@@ -1,7 +1,7 @@
 {
-  "name": "editor-framework",
+  "name": "@ali/lowcode-engine-editor",
   "version": "0.0.1",
-  "description": "alibaba lowcode editor framework",
+  "description": "alibaba lowcode editor core",
   "files": [
     "demo/",
     "es/",

packages/editor-skeleton/.editorconfig

@@ -0,0 +1,12 @@
+# http://editorconfig.org
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

packages/editor-skeleton/.eslintignore

@@ -0,0 +1,11 @@
+# 忽略目录
+build/
+tests/
+demo/
+
+# node 覆盖率文件
+coverage/
+
+# 忽略文件
+**/*-min.js
+**/*.min.js

packages/editor-skeleton/.eslintrc.js

@@ -0,0 +1,7 @@
+const { eslint, deepmerge } = require('@ice/spec');
+
+module.exports = deepmerge(eslint, {
+  rules: {
+    "global-require": 0,
+  },
+});

packages/editor-skeleton/.gitignore

@@ -0,0 +1,20 @@
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+
+# production
+/build
+/dist
+
+# misc
+.idea/
+.happypack
+.DS_Store
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# ignore d.ts auto generated by css-modules-typescript-loader
+*.module.scss.d.ts

packages/editor-skeleton/.stylelintignore

@@ -0,0 +1,7 @@
+# 忽略目录
+build/
+tests/
+demo/
+
+# node 覆盖率文件
+coverage/

packages/editor-skeleton/.stylelintrc.js

@@ -0,0 +1,3 @@
+const { stylelint } = require('@ice/spec');
+
+module.exports = stylelint;

packages/editor-skeleton/README.md

@@ -0,0 +1 @@
+## todo

packages/editor-skeleton/abc.json

@@ -0,0 +1,4 @@
+{
+  "type": "ice-scripts",
+  "builder": "@ali/builder-ice-scripts"
+}

packages/editor-skeleton/ice.config.js

@@ -0,0 +1,30 @@
+const path = require('path');
+
+module.exports = {
+  entry: 'src/index.tsx',
+  publicPath: './',
+  alias: {
+    '@': path.resolve(__dirname, './src'),
+  },
+  plugins: [
+    ['ice-plugin-fusion', {
+      themePackage: '@icedesign/theme',
+    }],
+    ['ice-plugin-moment-locales', {
+      locales: ['zh-cn'],
+    }],
+  ],
+  chainWebpack: (config) => {
+    // 修改对应 css module的 loader，默认修改 scss-module 同理可以修改 css-module 和 less-module 规则
+    ['scss-module'].forEach((rule) => {
+      if (config.module.rules.get(rule)) {
+        config.module.rule(rule).use('ts-css-module-loader')
+          .loader(require.resolve('css-modules-typescript-loader'))
+          .options({ modules: true, sass: true });
+        // 指定应用loader的位置
+        config.module.rule(rule).use('ts-css-module-loader').before('css-loader');
+      }
+    });
+  },
+};
+

packages/editor-skeleton/jsconfig.json

@@ -0,0 +1,9 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "jsx": "react",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  }
+}

packages/editor-skeleton/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "@ali/lowcode-engine-skeleton",
+  "version": "0.0.1",
+  "description": "alibaba lowcode editor skeleton",
+  "author": "xiayang.xy",
+  "dependencies": {
+    "@alifd/next": "^1.x",
+    "@icedesign/theme": "^1.x",
+    "@types/react": "^16.8.3",
+    "@types/react-dom": "^16.8.2",
+    "moment": "^2.23.0",
+    "prop-types": "^15.5.8",
+    "react": "^16.4.1",
+    "react-dom": "^16.4.1",
+    "react-router-dom": "^5.0.1"
+  },
+  "devDependencies": {
+    "@ice/spec": "^0.1.1",
+    "css-modules-typescript-loader": "^2.0.4",
+    "eslint": "^6.0.1",
+    "ice-plugin-fusion": "^0.1.4",
+    "ice-plugin-moment-locales": "^0.1.0",
+    "ice-scripts": "^2.0.0",
+    "stylelint": "^10.1.0"
+  },
+  "scripts": {
+    "start": "ice-scripts dev",
+    "build": "ice-scripts build",
+    "lint": "npm run eslint && npm run stylelint",
+    "eslint": "eslint --cache --ext .js,.jsx ./",
+    "stylelint": "stylelint ./**/*.scss"
+  },
+  "engines": {
+    "node": ">=8.0.0"
+  },
+  "iceworks": {
+    "type": "react",
+    "adapter": "adapter-react-v3"
+  },
+  "ideMode": {
+    "name": "ice-react"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ice-lab/react-materials/tree/master/scaffolds/ice-ts"
+  }
+}

packages/editor-skeleton/public/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta http-equiv="x-ua-compatible" content="ie=edge,chrome=1" />
+    <meta name="viewport" content="width=device-width" />
+    <title>ICE TypeScript Starter</title>
+  </head>
+
+  <body>
+    <div id="ice-container"></div>
+  </body>
+</html>

packages/editor-skeleton/src/components/Greeting/index.tsx

@@ -0,0 +1,15 @@
+import React from 'react';
+
+export interface Props {
+  name: string;
+}
+
+const Greeting = ({ name }: Props) => {
+  return (
+    <div style={{ textAlign: 'center', fontSize: '40px', fontWeight: 'bold' }}>
+      Hello, {name}
+    </div>
+  );
+};
+
+export default Greeting;

packages/editor-skeleton/src/components/Guide/index.module.scss

@@ -0,0 +1,11 @@
+.item {
+  height: 34px;
+  line-height: 34px;
+}
+.title {
+  text-align: center;
+}
+.container {
+  width: 470px;
+  margin: 40px auto;
+}

packages/editor-skeleton/src/components/Guide/index.tsx

@@ -0,0 +1,71 @@
+import React from 'react';
+import { Button } from '@alifd/next';
+import styles from './index.module.scss';
+
+const Guide = () => {
+  return (
+    <div className={styles.container}>
+      <h2 className={styles.title}>使用指南</h2>
+      <ul>
+        <li className={styles.item}>
+          1. 该模板适用于从 0 到 1 开始搭建项目，内置引导页面，路由和菜单展示。
+        </li>
+        <li className={styles.item}>2. 菜单配置: menuConfig.js。</li>
+        <li className={styles.item}>3. 路由配置: routerConfig.js。</li>
+        <li className={styles.item}>
+          4. 通过 GUI 工具{' '}
+          <a
+            href="https://alibaba.github.io/ice/iceworks"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            Iceworks
+          </a>{' '}
+          创建页面，会同步的更新菜单和路由配置。
+        </li>
+        <li className={styles.item}>
+          5. 基于{' '}
+          <a
+            href="https://alibaba.github.io/ice/block"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            物料
+          </a>{' '}
+          生成的页面将会添加在 pages 目录。
+        </li>
+        <li className={styles.item}>
+          6. 让前端工程变的轻松便捷，
+          <a
+            href="https://alibaba.github.io/ice/docs/iceworks"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            下载 iceworks
+          </a>{' '}
+          。
+        </li>
+      </ul>
+      <div style={{ textAlign: 'center', marginTop: '40px' }}>
+        <a
+          href="https://alibaba.github.io/ice/docs/iceworks"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          <Button type="secondary" style={{ marginRight: '20px' }}>
+            快速开始{' '}
+          </Button>
+        </a>
+        <a
+          href="https://www.tslang.cn/docs/home.html"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          <Button type="primary">学习 TypeScript</Button>
+        </a>
+      </div>
+    </div>
+  );
+};
+
+export default Guide;

packages/editor-skeleton/src/config/menu.ts

@@ -0,0 +1,5 @@
+// 菜单配置
+
+const asideMenuConfig = [];
+
+export { asideMenuConfig };

packages/editor-skeleton/src/config/routes.ts

@@ -0,0 +1,21 @@
+import Dashboard from '@/pages/Dashboard';
+import BasicLayout from '@/layouts/BasicLayout';
+
+const routerConfig = [
+  {
+    path: '/',
+    component: BasicLayout,
+    children: [
+      {
+        path: '/dashboard',
+        component: Dashboard,
+      },
+      {
+        path: '/',
+        redirect: '/dashboard',
+      }
+    ],
+  },
+];
+
+export default routerConfig;

packages/editor-skeleton/src/global.scss

@@ -0,0 +1,6 @@
+// 引入默认全局样式
+@import '@alifd/next/reset.scss';
+
+body {
+  -webkit-font-smoothing: antialiased;
+}

packages/editor-skeleton/src/index.tsx

@@ -0,0 +1,13 @@
+import ReactDOM from 'react-dom';
+
+import './global.scss';
+
+import router from './router';
+
+const ICE_CONTAINER = document.getElementById('ice-container');
+
+if (!ICE_CONTAINER) {
+  throw new Error('当前页面不存在 <div id="ice-container"></div> 节点.');
+}
+
+ReactDOM.render(router(), ICE_CONTAINER);

packages/editor-skeleton/src/layouts/BasicLayout/index.tsx

@@ -0,0 +1,9 @@
+import React from 'react';
+
+export default function BasicLayout({ children }) {
+  return (
+    <div style={{ paddingTop: '100px' }}>
+      {children}
+    </div>
+  );
+}

packages/editor-skeleton/src/pages/Dashboard/index.tsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import Guide from '@/components/Guide';
+import Greeting from '@/components/Greeting';
+
+export default function Dashboard() {
+  return (
+    <div>
+      <Greeting name="TypeScript" />
+      <Guide />
+    </div>
+  );
+}

packages/editor-skeleton/src/router.tsx

@@ -0,0 +1,73 @@
+import React from 'react';
+import { HashRouter as Router, Switch, Route, Redirect } from 'react-router-dom';
+import path from 'path';
+import routes from '@/config/routes';
+
+const RouteItem = (props) => {
+  const { redirect, path: routePath, component, key } = props;
+  if (redirect) {
+    return (
+      <Redirect
+        exact
+        key={key}
+        from={routePath}
+        to={redirect}
+      />
+    );
+  }
+  return (
+    <Route
+      key={key}
+      component={component}
+      path={routePath}
+    />
+  );
+};
+
+const router = () => {
+  return (
+    <Router>
+      <Switch>
+        {routes.map((route, id) => {
+          const { component: RouteComponent, children, ...others } = route;
+          return (
+            <Route
+              key={id}
+              {...others}
+              component={(props) => {
+                return (
+                  children ? (
+                    <RouteComponent key={id} {...props}>
+                      <Switch>
+                        {children.map((routeChild, idx) => {
+                          const { redirect, path: childPath, component } = routeChild;
+                          return RouteItem({
+                            key: `${id}-${idx}`,
+                            redirect,
+                            path: childPath && path.join(route.path, childPath),
+                            component,
+                          });
+                        })}
+                      </Switch>
+                    </RouteComponent>
+                  ) : (
+                    <>
+                      {
+                        RouteItem({
+                          key: id,
+                          ...route,
+                        })
+                      }
+                    </>
+                  )
+                );
+              }}
+            />
+          );
+        })}
+      </Switch>
+    </Router>
+  );
+};
+
+export default router;

packages/editor-skeleton/tests/index.js

@@ -0,0 +1 @@
+// test file

packages/editor-skeleton/tsconfig.json

@@ -0,0 +1,31 @@
+{
+  "compileOnSave": false,
+  "buildOnSave": false,
+  "compilerOptions": {
+    "baseUrl": ".",
+    "outDir": "build",
+    "module": "esnext",
+    "target": "es6",
+    "jsx": "react",
+    "moduleResolution": "node",
+    "allowSyntheticDefaultImports": true,
+    "lib": ["es6", "dom"],
+    "sourceMap": true,
+    "allowJs": true,
+    "rootDir": "src",
+    "forceConsistentCasingInFileNames": true,
+    "noImplicitReturns": true,
+    "noImplicitThis": true,
+    "noImplicitAny": false,
+    "importHelpers": true,
+    "strictNullChecks": true,
+    "suppressImplicitAnyIndexErrors": true,
+    "noUnusedLocals": true,
+    "skipLibCheck": true,
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "include": ["src/*"],
+  "exclude": ["node_modules", "build", "public"]
+}