create project

初始化项目

$ npm create vite@latest

导入vs code 方便操作

初始化的目录如下

安装依赖库

生成node_modules依赖库 和 package-lock.json. 其中package-lock.json用于锁定模块的版本号。

npm install

启动项目

 npm run dev

项目配置

增加路由器

路由器

npm install vue-router@4

安装node

import path from ‘path’，其中path模块来自于node

> npm install @types/node --save-dev

自动导入 & 组件注入

pnpm add -D unplugin-auto-import

pnpm add -D unplugin-vue-components

安装ICON 图片

参考

npm i -D unplugin-icons

安装 Element Plus

npm install element-plus --save

在线检查组件的状态

npm i -D vite-plugin-inspect

tsconfig.json定义路径

省去写全路径

    "baseUrl": ".",
    "paths": {
      "@/*":["src/*"],
      "components/*":["src/components"],
      "api/*":["src/api"],
      "view/*":["src/view"],
      "util/*":["src/util"]
    },

安装 Axios 调用API

$ npm install axios

样式表

安装 SASS

npm install --save-dev sass