fb-gener

generator_ice/.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

generator_ice/.eslintignore

@@ -0,0 +1,15 @@
+# 忽略目录
+build/
+tests/
+demo/
+.ice/
+
+# node 覆盖率文件
+coverage/
+
+# 忽略文件
+**/*-min.js
+**/*.min.js
+
+package-lock.json
+yarn.lock

generator_ice/.eslintrc.js

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

generator_ice/.gitignore

@@ -0,0 +1,23 @@
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+node_modules/
+
+# production
+build/
+dist/
+tmp/
+lib/
+
+# misc
+.idea/
+.happypack
+.DS_Store
+*.swp
+*.dia~
+.ice
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+index.module.scss.d.ts

generator_ice/.prettierignore

@@ -0,0 +1,9 @@
+build/
+tests/
+demo/
+.ice/
+coverage/
+**/*-min.js
+**/*.min.js
+package-lock.json
+yarn.lock

generator_ice/.prettierrc.js

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

generator_ice/.stylelintignore

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

generator_ice/.stylelintrc.js

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

generator_ice/README.md

@@ -0,0 +1,61 @@
+
+## Scaffold Lite - JS
+
+> 轻量级模板，使用 JavaScript，仅包含基础的 Layout。
+
+## 使用
+
+```bash
+# 安装依赖
+$ npm install
+
+# 启动服务
+$ npm start  # visit http://localhost:3333
+```
+
+[More docs](https://ice.work/docs/guide/about).
+
+## 目录
+
+```md
+├── build/                         # 构建产物
+├── mock/                          # 本地模拟数据
+│   ├── index.[j,t]s
+├── public/
+│   ├── index.html                 # 应用入口 HTML
+│   └── favicon.png                # Favicon
+├── src/                           # 源码路径
+│   ├── components/                # 自定义业务组件
+│   │   └── Guide/
+│   │       ├── index.[j,t]sx
+│   │       ├── index.module.scss
+│   ├── layouts/                   # 布局组件
+│   │   └── BasicLayout/
+│   │       ├── index.[j,t]sx
+│   │       └── index.module.scss
+│   ├── pages/                     # 页面
+│   │   └── Home/                  # home 页面，约定路由转成小写
+│   │       ├── components/        # 页面级自定义业务组件
+│   │       ├── models.[j,t]sx     # 页面级数据状态
+│   │       ├── index.[j,t]sx      # 页面入口
+│   │       └── index.module.scss  # 页面样式文件
+│   ├── configs/                   # [可选] 配置文件
+│   │   └── menu.[j,t]s            # [可选] 菜单配置
+│   ├── models/                    # [可选] 应用级数据状态
+│   │   └── user.[j,t]s
+│   ├── utils/                     # [可选] 工具库
+│   ├── global.scss                # 全局样式
+│   ├── routes.[j,t]s              # 路由配置
+│   └── app.[j,t]s[x]              # 应用入口脚本
+├── build.json                     # 工程配置
+├── README.md
+├── package.json
+├── .editorconfig
+├── .eslintignore
+├── .eslintrc.[j,t]s
+├── .gitignore
+├── .stylelintignore
+├── .stylelintrc.[j,t]s
+├── .gitignore
+└── [j,t]sconfig.json
+```

generator_ice/build.json

@@ -0,0 +1,18 @@
+{
+  "plugins": [
+    [
+      "build-plugin-fusion",
+      {
+        "themePackage": "@alifd/theme-design-pro"
+      }
+    ],
+    [
+      "build-plugin-moment-locales",
+      {
+        "locales": [
+          "zh-cn"
+        ]
+      }
+    ]
+  ]
+}

generator_ice/jsconfig.json

@@ -0,0 +1,11 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "jsx": "react",
+    "paths": {
+      "@/*": ["./src/*"],
+      "ice": [".ice/index.ts"],
+      "ice/*": [".ice/pages/*"]
+    }
+  }
+}

generator_ice/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "@alifd/scaffold-lite-js",
+  "version": "0.1.6",
+  "description": "轻量级模板，使用 JavaScript，仅包含基础的 Layout。",
+  "dependencies": {
+    "@alifd/next": "^1.19.4",
+    "moment": "^2.24.0",
+    "react": "^16.4.1",
+    "react-dom": "^16.4.1",
+    "@alifd/theme-design-pro": "^0.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": "https://github.com/alibaba-fusion/materials/tree/master/scaffolds/scaffold-lite-js"
+  },
+  "private": true,
+  "originTemplate": "@alifd/scaffold-lite-js"
+}

generator_ice/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>Scaffold Lite - JS</title>
+  </head>
+
+  <body>
+    <div id="ice-container"></div>
+  </body>
+</html>

generator_ice/src/app.js

@@ -0,0 +1,8 @@
+import { createApp } from 'ice';
+
+const appConfig = {
+  app: {
+    rootId: 'ice-container',
+  },
+};
+createApp(appConfig);

generator_ice/src/global.scss

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

generator_ice/src/layouts/BasicLayout/components/Footer/index.jsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import styles from './index.module.scss';
+
+export default function Footer() {
+  return (
+    <p className={styles.footer}>
+      <span className={styles.logo}>Alibaba Fusion</span>
+      <br />
+      <span className={styles.copyright}>© 2019-现在 Alibaba Fusion & ICE</span>
+    </p>
+  );
+}

generator_ice/src/layouts/BasicLayout/components/Footer/index.module.scss

@@ -0,0 +1,13 @@
+.footer {
+  line-height: 20px;
+  text-align: center;
+}
+
+.logo {
+  font-weight: bold;
+  font-size: 16px;
+}
+
+.copyright {
+  font-size: 12px;
+}

generator_ice/src/layouts/BasicLayout/components/Logo/index.jsx

@@ -0,0 +1,14 @@
+import React from 'react';
+import { Link } from 'ice';
+import styles from './index.module.scss';
+
+export default function Logo({ image, text, url }) {
+  return (
+    <div className="logo">
+      <Link to={url || '/'} className={styles.logo}>
+        {image && <img src={image} alt="logo" />}
+        <span>{text}</span>
+      </Link>
+    </div>
+  );
+}

generator_ice/src/layouts/BasicLayout/components/Logo/index.module.scss

@@ -0,0 +1,18 @@
+.logo{
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: $color-text1-1;
+  font-weight: bold;
+  font-size: 14px;
+  line-height: 22px;
+
+  &:visited, &:link {
+    color: $color-text1-1;
+  }
+
+  img {
+    height: 24px;
+    margin-right: 10px;
+  }
+}

generator_ice/src/layouts/BasicLayout/components/PageNav/index.jsx

@@ -0,0 +1,68 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Link, withRouter } 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 = (
+        <SubNav key={index} icon={item.icon} label={item.name}>
+          {childrenItems}
+        </SubNav>
+      );
+      return subNav;
+    }
+
+    return null;
+  }
+
+  const navItem = (
+    <NavItem key={item.path} icon={item.icon}>
+      <Link to={item.path}>{item.name}</Link>
+    </NavItem>
+  );
+  return navItem;
+}
+
+const Navigation = (props, context) => {
+  const { location } = props;
+  const { pathname } = location;
+  const { isCollapse } = context;
+  return (
+    <Nav
+      type="primary"
+      selectedKeys={[pathname]}
+      defaultSelectedKeys={[pathname]}
+      embeddable
+      openMode="single"
+      iconOnly={isCollapse}
+      hasArrow={false}
+      mode={isCollapse ? 'popup' : 'inline'}
+    >
+      {getNavMenuItems(asideMenuConfig)}
+    </Nav>
+  );
+};
+
+Navigation.contextTypes = {
+  isCollapse: PropTypes.bool,
+};
+const PageNav = withRouter(Navigation);
+export default PageNav;

generator_ice/src/layouts/BasicLayout/index.jsx

@@ -0,0 +1,79 @@
+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 (
+    <ConfigProvider device={device}>
+      <Shell
+        type="dark"
+        style={{
+          minHeight: '100vh',
+        }}
+      >
+        <Shell.Branding>
+          <Logo
+            image="https://img.alicdn.com/tfs/TB1.ZBecq67gK0jSZFHXXa9jVXa-904-826.png"
+            text="Logo"
+          />
+        </Shell.Branding>
+        <Shell.Navigation
+          direction="hoz"
+          style={{
+            marginRight: 10,
+          }}
+        ></Shell.Navigation>
+        <Shell.Action></Shell.Action>
+        <Shell.Navigation>
+          <PageNav />
+        </Shell.Navigation>
+
+        <Shell.Content>{children}</Shell.Content>
+        <Shell.Footer>
+          <Footer />
+        </Shell.Footer>
+      </Shell>
+    </ConfigProvider>
+  );
+}

generator_ice/src/layouts/BasicLayout/menuConfig.js

@@ -0,0 +1,9 @@
+const headerMenuConfig = [];
+const asideMenuConfig = [
+  {
+    name: 'Dashboard',
+    path: '/',
+    icon: 'smile',
+  },
+];
+export { headerMenuConfig, asideMenuConfig };

generator_ice/src/pages/Dashboard/components/Guide/index.jsx

@@ -0,0 +1,33 @@
+import * as React from 'react';
+import { Button } from '@alifd/next';
+import styles from './index.module.scss';
+
+const Guide = () => (
+  <div className={styles.container}>
+    <h2 className={styles.title}>Welcome to icejs!</h2>
+
+    <p className={styles.description}>This is a awesome project, enjoy it!</p>
+
+    <div className={styles.action}>
+      <a
+        href="https://ice.work/docs/guide/about"
+        target="_blank"
+        rel="noopener noreferrer"
+        style={{
+          marginRight: 20,
+        }}
+      >
+        <Button type="primary" size="large">
+          使用文档
+        </Button>
+      </a>
+      <a href="https://github.com/ice-lab/icejs" target="_blank" rel="noopener noreferrer">
+        <Button type="secondary" size="large">
+          GitHub
+        </Button>
+      </a>
+    </div>
+  </div>
+);
+
+export default Guide;

generator_ice/src/pages/Dashboard/components/Guide/index.module.scss

@@ -0,0 +1,19 @@
+.container {
+  min-height: 600px;
+  overflow: hidden;
+  text-align: center;
+  background-color: $color-white;
+}
+
+.title {
+  font-size: 40px;
+  text-align: center;
+}
+
+.description {
+  margin-top: 40px;
+}
+
+.action {
+  margin-top: 40px;
+}

generator_ice/src/pages/Dashboard/index.jsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import { ResponsiveGrid } from '@alifd/next';
+import Guide from './components/Guide';
+
+const { Cell } = ResponsiveGrid;
+
+const Dashboard = () => (
+  <ResponsiveGrid gap={20}>
+    <Cell colSpan={12}>
+      <Guide />
+    </Cell>
+  </ResponsiveGrid>
+);
+
+export default Dashboard;

generator_ice/src/routes.js

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

generator_ice/tsconfig.json

@@ -0,0 +1,33 @@
+{
+  "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": "./",
+    "forceConsistentCasingInFileNames": true,
+    "noImplicitReturns": true,
+    "noImplicitThis": true,
+    "noImplicitAny": false,
+    "importHelpers": true,
+    "strictNullChecks": true,
+    "suppressImplicitAnyIndexErrors": true,
+    "noUnusedLocals": true,
+    "skipLibCheck": true,
+    "paths": {
+      "@/*": ["./src/*"],
+      "ice": [".ice/index.ts"],
+      "ice/*": [".ice/pages/*"]
+    }
+  },
+  "include": ["src/*", ".ice"],
+  "exclude": ["node_modules", "build", "public"]
+}