1
使用脚手架创建项目
# 一键创建项目，全自动配置
npm create dev-to
# 启动开发服务器，访问 http://localhost:5173
cd my-project && npm run dev脚手架会自动安装依赖、配置 Vite 插件、生成 HelloWorld 组件，开箱即用
2
手动配置 可选
// vite.config.ts - 适合在已有项目中集成
import { devToReactPlugin } from '@dev-to/react-plugin'
export default defineConfig({
plugins: [
react(),
devToReactPlugin({
MyCard: 'src/components/MyCard.tsx',
}),
],
})如果你有现有项目，可以手动安装 @dev-to/react-plugin 并配置组件映射
3
宿主容器对接 容器侧
// 宿主应用代码，由容器团队维护
import { ReactLoader } from '@dev-to/react-loader'
<ReactLoader
origin="http://localhost:5173"
name="MyCard"
/>组件开发者无需关心此步骤，这是容器/宿主团队的集成工作