add vue3 init logic

zorrowm · Jun 20, 2020 · dfe9bea · dfe9bea
1 parent a38c608
commit dfe9bea
Show file tree

Hide file tree

Showing 22 changed files with 809 additions and 34 deletions.
diff --git a/README.md b/README.md
@@ -1,21 +1,26 @@
-# rollup-starter-ts
+## mini-vue
+实现最简 vue3 模型，用于学习
 
-To fast start a typescript library.  
 
-## Getting started
 
-Clone this repository and install its dependencies:
-
-```bash
-git clone https://github.com/zenoslin/rollup-starter-ts.git
-cd rollup-starter-ts
-npm install
+### build
+```shell
+yarn build
 ```
 
-## scripts
-- `npm run build` builds the library to `lib`.
-- `npm run build:type` builds `.d.ts` file for the library.
-- `npm run test` use `jest` to test the source files.
+### example
+直接打开 example/index.html 即可
+
+
 
-## License
-[MIT](LICENSE)
+### tasking
+- [ ] runtime-core 初始化逻辑
+    - [ ] 基础类型的处理：static fragment comment
+    - [ ] 触发各种 hook
+    - [ ] 标准化 vnode 的实现
+    - [ ] 初始化 props 逻辑
+    - [ ] 初始化 slots 逻辑
+    - [ ] proxy 暴露给用户的代理实现
+    - [ ] 支持 template 
+    - [ ] 给元素设置 props
+        - [ ] 需要过滤掉vue自身用的key
diff --git a/example/App.js b/example/App.js
@@ -0,0 +1,11 @@
+import { h } from "../lib/mini-vue.esm.js";
+import HelloWorld from "./components/HelloWorld.js";
+
+export default {
+    name:"App",
+  setup() {},
+
+  render() {
+    return h("div", { tId: 1 }, [h("p", {}, "你好，我是p"), h(HelloWorld)]);
+  },
+};
diff --git a/example/components/HelloWorld.js b/example/components/HelloWorld.js
@@ -0,0 +1,8 @@
+import { h } from "../../lib/mini-vue.esm.js";
+export default {
+  name: "HelloWorld",
+  setup() {},
+  render() {
+    return h("div", { tId: "helloWorld" }, "hello world vue3");
+  },
+};
diff --git a/example/index.html b/example/index.html
@@ -8,6 +8,7 @@
 </head>
 <body>
 
+    <div id="root"></div>
 
     <script src="main.js" type="module"></script>
 </body>

diff --git a/example/main.js b/example/main.js
@@ -1,3 +1,5 @@
-import {add} from '../lib/bundle.esm.js'
+import { createApp } from "../lib/mini-vue.esm.js";
+import App from "./App.js";
 
-console.log(add)
+const rootContainer = document.querySelector("#root");
+createApp(App).mount(rootContainer);
diff --git a/lib/mini-vue.cjs.js b/lib/mini-vue.cjs.js
diff --git a/lib/mini-vue.cjs.js.map b/lib/mini-vue.cjs.js.map
-Original file line number
+Diff line change
@@ Expand Up / @@ -8,6 +8,7 @@ @@
     </head>
     <body>
+        <div id="root"></div>
         <script src="main.js" type="module"></script>
     </body>
@@ Expand Down @@