Chore: update configurations

.gitignore

@@ -1,5 +1,6 @@
 .DS_Store
 node_modules
+package-lock.json
 /dist
 
 

Makefile

@@ -0,0 +1,37 @@
+.PHONY: dist test
+default: help
+
+install:
+	npm install
+
+install-cn:
+	npm install --registry=http://registry.npm.taobao.org
+
+new:
+	node build/bin/new.js $(filter-out $@,$(MAKECMDGOALS))
+	node build/bin/build-entry.js
+
+dev:
+	npm run dev
+
+dist: 
+	npm run dist
+
+pub:
+	npm run pub
+
+# deploy:
+# 	# npm run deploy
+
+test:
+	npm run test:ui
+
+help:
+	@echo "   \033[35m make\033[0m \033[1m命令使用说明：\033[0m"
+	@echo "   \033[35m make install\033[0m\t\033[0m\t\033[0m\t\033[0m\t---  安装依赖"
+	@echo "   \033[35m make install-cn\033[0m\t\033[0m\t\033[0m\t\033[0m\t---  安装依赖"
+	@echo "   \033[35m make new <component-name> [组件中文名]\033[0m\t---  创建新组件(组件英文名用中横线)例如 'make new button-group 按钮'"
+	@echo "   \033[35m make dev\033[0m\t\033[0m\t\033[0m\t\033[0m\t\033[0m\t---  启动开发"
+	@echo "   \033[35m make test\033[0m\t\033[0m\t\033[0m\t\033[0m\t\033[0m\t---  运行测试"
+	@echo "   \033[35m make dist\033[0m\t\033[0m\t\033[0m\t\033[0m\t\033[0m\t---  编译项目，构建目标文件"
+	@echo "   \033[35m make pub\033[0m\t\033[0m\t\033[0m\t\033[0m\t\033[0m\t---  发布到 npm 上"

README.md

@@ -37,122 +37,62 @@
    基于vue-next的一套PC端前端UI组件库
 </div>
 
-## 技术栈
-* [Vue3.0](https://cn.vuejs.org/)
-* [TypeScript](https://www.tslang.cn/)
-* [Dart Scss](https://sass-lang.com/)
-* [Mocha](https://mochajs.org/) + [chai](https://www.chaijs.com/)
-* [Eslint](https://eslint.bootcss.com/)
-
-## 目录结构
-```bash
-.
-├─ README.md
-├─ package.json
-├─ docs # 组件使用文档
-│  └─ button.md
-├─ packages # 组件源码
-│  ├─ button # 单组件
-│  │  ├─ src
-│  │  │  └─ button.vue
-│  │  └─ axe.umd.js
-│  └─ axe.umd.js # 全部组件入口
-├─ public
-│  ├─ img
-│  │  └─ icons # 存放pwa 图标
-│  ├─ favicon.ico
-│  ├─ index.html
-│  └─ robots.txt
-├─ src # demo样式
-│  ├─ components # 存放单元组件使用Demo
-│  ├─ App.vue
-│  └─ main.ts
-├─ styles # 组件样式
-│  ├─ common
-│  │  ├─ _var.scss # 全局scss变量
-│  │  └─ xxx.scss
-│  ├─ mixin # 混合
-│  │  └─ xxx.scss
-│  └─ button.scss # 组件单样式
-└─ tests
-   └─ utils # 单元测试
-      └─ xx.spec.ts # xx模块测试文件
-```
-## 依赖安装
-### 1、环境要求
-- `no`de``： 8.9+ (推荐 10+)
-- `npm`： 6+
-
-> Vue CLI  requires [Node.js](https://nodejs.org/en/) version 8.9 or above (v10+ recommended). You can manage multiple versions of Node on the same machine with [n](https://github.com/tj/n), [nvm](https://github.com/nvm-sh/nvm) or [nvm-windows](https://github.com/coreybutler/nvm-windows). 
+## 常用链接
+- [FQA]()
 
-### 2、升级cli
-本项目是使用vue-cli搭建项目框架，需要用vue3，得先把vue-cli的版本升级到`vue-cli@4.5`以上：
-```
-npm install -g @vue/cli
+## 安装
+```sh
+npm install axe-ui -S
 ```
-> 因为不更新版本直接install，会报[vue-loader-v16](https://github.com/vuejs/vue-cli/pull/5718#issuecomment-673360542)相关的错。但是这个问题在[vue-cli@4.5.1修复](https://github.com/vuejs/vue-cli/blob/dev/CHANGELOG.md#bug-bug-fix-7)了。所以推荐更新的到最新版～
+### 快速使用
+全局引入：
+```sh
+import { createApp } from 'vue'
+import App from './App.vue'
+import Axe from 'axe-ui'
+import 'axe-ui/axe.css'
 
-### 3、安装依赖：
+createApp(App).use(AxeUI).mount('#app')
 ```
-npm install
+本组件支持按需导入。你也可以像下边这样，单独导入需要的组件：
+```sh
+import { createApp } from 'vue'
+import App from './App.vue'
+import {
+  Input,
+  Button
+  // ...其他组件
+} from 'axe-ui'
+import 'axe-ui/css/input/style.css'
+import 'axe-ui/css/button/style.css'
+let app = createApp(App)
+app.component(Input.name, Input)
+app.component(Button.name, Button)
+app.mount('#app')
 ```
-## host配置
-因为服务启动后需要访问域名，故可以先进行配置：
+## 浏览器支持
+- 现代浏览器
+- IE 11+
 
-```
-#### axe-ui
-127.0.0.1 dev.axe-ui.com
-```
-## 开始开发
-### 启动文档平台
-整个axe-ui平台启动，适用源码开发、文档编写。
-```
-npm run serve
-# or
-npm run dev
-```
+## 开发文档
+- [中文文档]()
 
-### 浏览地址
-启动成功后在浏览器中打开 http://dev.axe-ui.com:8080/  导航至相应组件即可进行开发。
+## 更新日志
+[release notes](https://github.com/DFE-evernote/axe-ui/releases)
 
-源码地址：`packages/`
+## 参与贡献
+在拉取代码前请先查看我们的[贡献文档](https://github.com/DFE-evernote/axe-ui/issues/19)
 
-## 开发完成后  
-• 如果是修复 bug，请确保该组件的其他功能没有受到本修复的影响。  
-• 如果是新增功能，请在文档中补充该功能的 API 说明，并在 TypeScript 定义中添加该 API。视功能的复杂程度，有时还需要添加测试用例和文档例子。  
+## 特别感谢
+下面的贡献者让组件库变得更好，感谢[所有为Axe做出贡献的人](https://github.com/DFE-evernote/axe-ui/graphs/contributors)!
 
-## 单元测试
-在提交代码前，建议首先在本地运行一遍测试。  
-使用下列命令，即可进行测试，并且在你改变代码后会再次触发测试。
-```
-npm run test:unit
-```
+以贡献时间为序，感谢：  
 
-## 代码校验和修复
-```
-npm run lint
-```
-## 提交代码
-在 commit 代码时，commit message 请遵循以下格式：
-```
-<Commit 类型>: <commit 描述>
-```
-**commit 类型可以是：**  
-• `Tree`：如果本次 commit 修复了某个组件的 bug，或为某个组件添加了 feature，则 commit 类型为该组件的名称  
-• `Docs`：本次 commit 与文档相关，如优化了文档某处语言描述、新增了一个例子  
-• `Chore`：本次 commit 与构建、CI 相关，如修改了 webpack 配置、修改了发布脚本  
-• `Utils`：本次 commit 修改了 src/utils 中的某些内容  
-• `Test`：本次 commit 修改了 test 中的某些内容  
-• `Changelog`：一般仅在发布新版本前出现，表示新增了本次发布的更新说明  
+-[Otto](https://github.com/Otto-J)
 
 
-## 生产环境（打包+压缩）
-生成dist文件
-
-```
-npm run build
-```
-
-## 自定义配置
-See [Configuration Reference](https://cli.vuejs.org/config/).
 
+## 加入我们
+[《加入axe-ui》](https://www.yuque.com/docs/share/03c22f3e-e1d0-4b8f-8f73-33921c61e8a9) 
+## LICENSE
+[MIT](https://github.com/DFE-evernote/axe-ui/blob/main/LICENSE)

build/bin/build-entry.js

@@ -0,0 +1,63 @@
+'use strict'
+const fs = require('fs'),
+  path = require('path'),
+  jsonRender = require('json-templater/string'),
+  uppercamelcase = require('uppercamelcase'),
+  endOfLine = require('os').EOL,
+  componentsList = require('../../components.json'),
+  OUTPUT_PATH = path.join(__dirname, '../../packages/index.js')
+
+const MAIN_TEMPLATE = `/* Automatically generated by './build/bin/build-entry.js' */
+
+{{include}}
+
+const components = [
+{{install}},
+]
+
+const install = (app, opts = {}) => {
+  components.forEach(item => {
+    app.component(item.name, item)
+  })
+
+  app.$AXE = {
+    size: opts.size || '',
+    zIndex: opts.zIndex || 1000
+  }
+}
+
+export default {
+  version: '{{version}}',
+  install,
+{{export}},
+}
+`,
+  IMPORT_TEMPLATE = `import {{nameCameraCase}} from './{{name}}/'`
+
+const componentNames = Object.keys(componentsList),
+  includeTempList = [],
+  installTempList = [],
+  exportTempList = []
+componentNames.forEach(compItemName => {
+  const AxeCompCameraName = 'Axe' + uppercamelcase(compItemName)
+  includeTempList.push(
+    jsonRender(IMPORT_TEMPLATE, {
+      name: compItemName,
+      nameCameraCase: AxeCompCameraName
+    })
+  )
+  installTempList.push(`  ${AxeCompCameraName}`)
+  exportTempList.push(`  ${AxeCompCameraName}`)
+})
+
+const template = jsonRender(MAIN_TEMPLATE, {
+  include: includeTempList.join(endOfLine),
+  install: installTempList.join(',' + endOfLine),
+  export: exportTempList.join(',' + endOfLine),
+  version: process.env.VERSION || require('../../package.json').version
+})
+
+fs.writeFileSync(OUTPUT_PATH, template)
+// DONE
+console.log('🎉🎉🎉🎉🎉不骗你，这次是真的完了~🎉🎉🎉🎉🎉')
+console.log('[build entry] DONE:', OUTPUT_PATH)