快速开始
创建项目
运行以下命令创建 Esmx 项目:
选择模板
运行命令后,你会看到模板选择界面:
可用模板
模板 | 描述 |
---|
shared-modules | 微前端共享模块解决方案 |
vue-csr | Vue 3 客户端渲染 |
vue-ssr | Vue 3 服务端渲染 |
vue2-csr | Vue 2.7 客户端渲染 |
vue2-ssr | Vue 2.7 服务端渲染 |
指定模板
你也可以通过 -t
或 --template
选项直接指定模板,跳过交互式选择:
npm create esmx my-app --template vue-csr
启动开发服务器
创建项目后,进入目录启动开发服务器:
cd my-app
npm install
npm run dev
开发服务器将在 http://localhost:3000
启动。
生产环境构建
构建生产环境版本:
npm run build
npm run start
项目结构
创建的项目结构如下:
my-app/
├── src/ # 源代码
│ ├── app.vue # 应用组件
│ ├── create-app.ts # 应用创建函数
│ ├── entry.client.ts # 客户端入口
│ ├── entry.node.ts # 开发服务器入口
│ ├── entry.server.ts # 服务端渲染入口
│ └── components/ # 组件目录
│ └── hello-world.vue
├── tsconfig.json # TypeScript 配置
├── package.json # 项目依赖和脚本
└── README.md # 项目说明
高级选项
覆盖现有目录
使用 --force
或 -f
选项强制覆盖现有目录:
npm create esmx my-app --force
指定项目名称
使用 --name
或 -n
选项指定项目名称:
npm create esmx my-app --name my-project