免费思维导图框架-基于React

效果

步骤

要在本地部署使用 PNPM 创建的 Vite 项目，您可以按照以下步骤进行操作：

1.安装 PNPM（如果尚未安装）：
如果您尚未在系统上全局安装 PNPM，请执行以下命令：

npm install -g pnpm

2.创建一个新的 Vite 项目：
使用 PNPM 创建一个新的 Vite 项目，您可以在命令中指定项目名称(默认项目名字)

pnpm create vite

3.进入项目目录：

cd vite-project

4.安装项目依赖：
使用 PNPM 安装项目所需的依赖：

pnpm install

5.要使用 PNPM 安装 Excalidraw 包，您可以执行以下命令：

pnpm install @excalidraw/excalidraw

6.在创建的项目中使用Excalidraw

import { Excalidraw } from "@excalidraw/excalidraw";

import './App.css'

function App() {

  return (

    <>

     <div style={{ height: "700px",width: "1100px"}}>

          <Excalidraw/>

     </div>

    </>

  )

}

export default App

7.在vite.config.ts文件配置true

import { defineConfig } from 'vite'

import react from '@vitejs/plugin-react'

// https://vitejs.dev/config/

export default defineConfig({

  plugins: [react()],

  define: {

    "process.env.IS_PREACT": JSON.stringify("true"),

  }

})

8.启动开发服务器：
使用以下命令启动 Vite 开发服务器：

pnpm dev

部署

pnpm build