docs📝: 更新文档

lxfljw · Jul 24, 2024 · 2834cbf · 2834cbf
1 parent f7e2e8e
commit 2834cbf
Show file tree

Hide file tree

Showing 5 changed files with 116 additions and 30 deletions.
diff --git a/code/ssr/server.js b/code/ssr/server.js
@@ -1,32 +1,31 @@
-import express from "express";
-import * as reactServer from "react-dom/server";
-import Home from "./Home.js";
-import React from "react";
+function asyncAdd(a, b, callback) {
+  setTimeout(function () {
+    callback(a + b);
+  }, 1000);
+}
 
-const app = express();
+function sum(...args) {
+  function fn(nums) {
+    const pList = [];
+    const len = nums.length;
+    if (len === 0) return Promise.resolve(0);
+    if (len === 1) return Promise.resolve(nums[0]);
+    // return new Pro
+    let i = 0;
+    while (i < nums.length) {
+      pList.push(
+        new Promise((resolve) => {
+          const next = typeof nums[i + 1] === "number" ? nums[i + 1] : 0;
+          asyncAdd(nums[i], next, resolve);
+        })
+      );
+      i += 2;
+    }
+    return Promise.all(pList).then((res) => {
+      return fn(res);
+    });
+  }
+  return fn(args);
+}
 
-const content = reactServer.renderToString(React.createElement(Home));
-
-app.get("/", (req, res) => {
-  res.setHeader("Content-Type", "text/html");
-  res.setHeader("Access-Control-Allow-Origin", "*");
-  res.setHeader("Set-Cookie", "sid=kljsadflkjkljkljkalsdjf;p=asdfk1");
-  res.send(`
-    <html>
-      <head>
-        <title>ssr</title>
-      </head>
-      <body>
-        <div id="root">${content}</div>
-        <script src="index.js"></script>
-      </body>
-    </html>
-   `);
-});
-
-app.use(express.static("public"));
-
-app.listen(3000, () => {
-  console.log("Server is running on port 3000");
-  console.log("http://localhost:3000");
-});
+sum(1, 2, 3, 4, 5).then((result) => console.log(result));
diff --git a/pages/6-前端知识点/7.dom相关.md b/pages/6-前端知识点/7.dom相关.md
@@ -0,0 +1,8 @@
+# 7. DOM相关
+
+DOM节点的各种位置，比   clientHeight,scrollHeight,offsetHeight ,以及scrollTop, offsetTop,clientTop的区别？
+clientHeight：表示的是可视区域的高度，不包含     border  和滚动条
+offsetHeight：表示可视区域的高度，包     含了  border  和滚动条
+scrollHeight：表示了所有区域的高度，包含了因为滚动被隐藏的部分。
+clientTop：表示边框    border  的厚度，在未指定的情况下一般为
+scrollTop：滚动后被隐藏的高度，获取对象相对于由 offsetParent 属性指定的父坐标(css 定位的元素或 body 元素)距离顶端的高度。
diff --git a/pages/7-前端工程化/前端打包工具.md → pages/7-前端工程化/1.前端打包工具.md b/pages/7-前端工程化/前端打包工具.md → pages/7-前端工程化/1.前端打包工具.md
diff --git a/pages/7-前端工程化/SWC.md → pages/7-前端工程化/2.SWC.md b/pages/7-前端工程化/SWC.md → pages/7-前端工程化/2.SWC.md
diff --git a/pages/7-前端工程化/3.node版本管理之volta.md b/pages/7-前端工程化/3.node版本管理之volta.md
@@ -0,0 +1,79 @@
+# 3.node版本管理之volta
+
+## volta介绍
+
+Volta 是一个跨平台的 Node.js 版本管理工具，它可以帮助你管理不同项目的 Node.js 版本，并提供一个统一的命令行界面来管理 Node.js 版本。
+
+Volta 可以帮助你：
+
+- 管理不同项目的 Node.js 版本
+- 在项目粒度固定 Node.js 版本 和 包管理工具
+
+
+## 安装volta
+
+Volta 可以在 macOS、Windows 和 Linux 上安装。
+
+这里介绍 macOS 上的安装方法：
+
+```bash
+curl https://get.volta.sh | bash
+```
+
+###  验证安装
+重新开一个标签，输入以下命令
+```bash
+volta --version
+```
+
+###  支持 pnpm
+
+pnpm 默认是无法接管到项目的，需要在配置文件开启：
+
+```bash
+# .bashrc 或 .zshrc
+# bash
+echo "export VOLTA_FEATURE_PNPM=1" >> ~/.bashrc
+# zsh
+echo "export VOLTA_FEATURE_PNPM=1" >> ~/.zshrc
+```
+
+## 管理 Node.js 或者包管理工具版本
+
+### 安装
+
+```bash
+# 安装node
+volta install node@14
+# 安装yarn
+volta install yarn
+# 安装pnpm
+volta install pnpm
+```
+
+## 项目固定版本
+
+```bash
+# 固定node版本
+volta pin node@14
+# 固定yarn版本
+volta pin yarn
+# 固定pnpm版本
+volta pin pnpm
+```
+
+执行以上命令后，volta 会在 package.json 文件中添加以下内容：
+
+```json
+{
+  "volta": {
+    "node": "14.15.4",
+    "yarn": "1.22.10",
+    "pnpm": "5.18.8"
+  }
+}
+```
+
+## 总结
+
+volta 底层基于 Rust 编写，性能高，并且可以在项目粒度固定 Node.js 版本 和 包管理工具，非常适合前端不同项目的管理，不需要像 nvm 那样手动切换版本，非常推荐。