EMP 全栈技能：React 19 脚手架脚本、emp.config.ts 配置、Tailwind v4、微前端 empRuntime、@empjs/valtio 状态管理、React 性能优化。适用于创建 EMP 应用、配置模块联邦、状态管理、性能优化等场景。
整合 EMP React 项目、微前端、Tailwind v4、状态管理、性能优化于一体。全部内容已本地化。
快速创建 EMP React 19 项目。在项目根目录执行：
node skills/empjs/scripts/create-emp-react19.js <项目名> [目标目录]
示例：
node skills/empjs/scripts/create-emp-react19.js my-app
node skills/empjs/scripts/create-emp-react19.js my-app ./projects
生成后执行 cd <项目名> && pnpm install && pnpm dev。
生成结构：package.json、emp.config.ts、tsconfig.json、src/index.html、src/index.tsx、src/bootstrap.tsx、src/App.tsx、src/style.css、src/global.d.ts。
// emp.config.ts
import { defineConfig } from '@empjs/cli'
import pluginReact from '@empjs/plugin-react'
export default defineConfig(store => ({
plugins: [pluginReact()],
server: { port: 8000, open: false },
}))
project/
├── emp.config.ts
├── package.json
├── src/
│ └── index.tsx
└── tsconfig.json # extends: "@empjs/cli/tsconfig/react"
pnpm dev # 开发
pnpm build # 构建
pnpm start # 预览
{
"scripts": {
"dev": "emp dev",
"dev:open": "emp dev --open",
"dev:test": "emp dev --env test",
"dev:prod": "emp dev --env prod",
"dev:doctor": "emp dev --doctor",
"dev:profile": "emp dev --profile",
"build": "emp build",
"build:test": "emp build --env test",
"build:prod": "emp build --env prod",
"build:watch": "emp build --watch --serve",
"build:ts": "emp build --ts",
"build:stat": "emp build --analyze",
"build:doctor": "emp build --doctor",
"build:profile": "emp build --profile",
"start": "emp serve",
"serve": "emp serve",
"stat": "emp build --analyze",
"dts": "emp dts",
"emp": "emp"
}
}
| 配置 | 说明 | 默认 |
|---|---|---|
plugins | 插件数组，React 需 pluginReact() | - |
server.port | 端口 | 8000 |
appSrc | 源码目录 | src |
appEntry | 入口文件 | index.{ts,tsx,jsx,js} |
@empjs/plugin-react：React 项目必需@empjs/plugin-tailwindcss：Tailwind v4 默认，@import "tailwindcss"@empjs/plugin-lightningcss：LightningCSS，px_to_rem、px_to_viewport@empjs/share：模块联邦共享pnpm add @empjs/plugin-tailwindcss tailwindcss