docs: update tutorial

packages/stack-idealjs/docs/full_guide/react/react_todo_list.md

@@ -9,7 +9,7 @@ sidebar_position: 2
 1. 已创建react ts工程
 
 >**提示**                                                                                                                                    
-若未创建react ts工程，可以参考[使用vite创建react ts工程](https://github.com/idealjs/stack/blob/main/packages/stack-idealjs/docs/react/react_ts.md)文档
+若未创建react ts工程，可以参考[使用vite创建react ts工程](/docs/full_guide/react/react_ts)文档
 
 ## 项目初始化
 打开react ts工程

packages/stack-idealjs/docs/full_guide/react/react_ts.md

@@ -31,3 +31,64 @@ npm install
 ```
 npm run dev
 ```
+
+## 按步引入react包
+
+除了直接用脚手架创建react工程，也可以在一个已有的vanilla工程中，按步引入react包。这个过程可以帮助理解react工程的最小组成。
+
+### 1. 安装依赖
+
+在vanilla工程目录下，运行以下命令
+
+```
+npm install react react-dom
+npm install -D @types/react @types/react-dom @vitejs/plugin-react
+```
+
+### 2. 配置vite
+
+修改`vite.config.ts`，添加react插件
+
+```ts
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+
+export default defineConfig({
+  plugins: [react()],
+})
+```
+
+### 3. 修改入口文件
+
+把`index.html`中的入口指向react组件文件
+
+```html
+<script type="module" src="/src/main.tsx"></script>
+```
+
+编写`src/main.tsx`
+
+```tsx
+import React from 'react'
+import { createRoot } from 'react-dom/client'
+
+function App() {
+  return <h1>Hello React</h1>
+}
+
+createRoot(document.getElementById('app')!).render(<App />)
+```
+
+同时在`index.html`的`body`中添加挂载点
+
+```html
+<div id="app"></div>
+```
+
+### 4. 运行项目
+
+```
+npm run dev
+```
+
+看到页面输出`Hello React`，说明react已经成功引入。

packages/stack-idealjs/docs/full_guide/vite/vite.md

@@ -8,7 +8,7 @@ vite 是一个现代化的前端构建工具，旨在提供快速的开发体验
 ## 什么是vite
 访问网站 https://vitejs.cn/vite3-cn/guide/
 
-## 创建vanilla ts工程
+## 创建 vanilla ts 工程
 ### 打开终端
 使用快捷键`Ctrl+ ~` 打开终端
 
@@ -17,7 +17,15 @@ vite 是一个现代化的前端构建工具，旨在提供快速的开发体验
 ```
 npm create vite@latest
 ```
-2. 根据提示，输入名字并选择vanilla，再选择typescript
+2. 根据提示，输入名字并选择 vanilla，再选择 typescript
+
+也可以直接指定模板，跳过交互。创建vanilla-ts工程
+
+创建vanilla-ts工程
+
+```
+npm create vite@latest vanilla-ts-test -- --template vanilla-ts
+```
 
 3. 输入以下命令,进入项目
 ```

packages/stack-idealjs/docs/full_guide/vite_vanilla_ts/vite_vanilla_ts.md

@@ -7,7 +7,7 @@ sidebar_position: 1
 1. 已创建vanilla ts工程
 
 >**提示**                                  
-若未安装vanilla ts工程，可以参考[vite的入门](https://github.com/idealjs/stack/blob/main/packages/stack-idealjs/docs/vite/vite.md)文档
+若未安装vanilla ts工程，可以参考[vite的入门](/docs/full_guide/vite/)文档
 
 ## 项目初始化
 打开vanilla ts工程