viteser
v0.0.1-beta.36
Published
允许直接在 vite .vue .tsx .ts 前端文件中写接口
Downloads
35
Readme
把接口当作函数写在前端项目中
// src/api.ts
import { useEffect, useState } from 'react'
import { db } from './db'
// src/App.tsx
import { getUser } from './api'
export async function getUser(id: number) {
'use server'
return db.query(`SELECT * FROM users WHERE id = ${id}`)
}
function App() {
const [user, setUser] = useState<{
id: number
name: string
}>({ id: 0, name: '' })
useEffect(() => {
getUser(1).then(setUser)
}, [])
return <div>{user.name}</div>
}
🏃🏻♂️➡️ 开始
- 安装 viteser 和其他依赖
npm install viteser
- 修改 vite.config.ts
import { defineConfig } from 'vite'
import { ViteserPlugin } from 'viteser'
// https://vitejs.dev/config/
// noinspection JSUnusedGlobalSymbols
export default defineConfig({
plugins: [
ViteserPlugin(),
// react() or vue() or other . . .
],
})
🔍 快速启动
https://github.com/sia-fl/viteser-demo
📦 最佳实践(长期维护)
https://github.com/sia-fl/buess