vue3项目 基本搭建流程

创建项目

使用create-vue库创建项目

npm init vue@3 //创建vue3项目
npm init vue@2 //创建vue2项目

询问是否需要安装，填y

依次填写和选择下列选项

✔ Project name: … vue3-train  项目名称
✔ Add TypeScript? …  Yes  是否使用ts
✔ Add JSX Support? …  Yes 是否需要支持jsx
✔ Add Vue Router for Single Page Application development? …  No 是否使用vue-router
✔ Add Pinia for state management? …  Yes 是否使用pinia
✔ Add Vitest for Unit Testing? … No 是否使用vitest测试
✔ Add Cypress for both Unit and End-to-End testing? … No 是否使用cypress测试
✔ Add ESLint for code quality? …  Yes 是否使用eslint
✔ Add Prettier for code formatting? …  Yes 是否使用prettier

选择完就创建成功

配置自动打开项目

输入npm run dev 自动打开项目

// vite.config.ts文件
export default defineConfig({
  server:{
    open:true,
    // 主机
    host:"127.0.0.1",
    // 端口
    port:3000
  }
})

安装UI框架

npm install element-plus --save

// main.ts 添加引入