1、pnpm比同类工具快2倍左右，而且节省磁盘控件，使用：

npm install -g pnpm //安装
pnpm create vue //创建项目
pnpm install
pnpm add axios
pnpm add sass -D
pnpm dev

2、eslint配置，在eslintrc.cjs中增加rules：

//1.禁用格式化插件 prettier，因为用的是package.json里面的prettier
rules: {
    'prettier/prettier': [
      'warn',
      {
        singleQuote: true, // 单引号
        semi: false, // 无分号
        printWidth: 80, // 每行宽度至多80字符
        trailingComma: 'none', // 不加对象|数组最后逗号
        endOfLine: 'auto' // 换行符号不限制（win mac 不一致）
      }
    ],
    'vue/multi-word-component-names': [
      'warn',
      {
        ignores: ['index'] // vue组件名称多单词组成（忽略index.vue）
      }
    ],
    'vue/no-setup-props-destructure': ['off'], // 关闭 props 解构的校验
    //

3、在vue3中使用路由：

<script setup lang="ts">
import { useRoute, useRouter } from 'vue-router'
//在VUE3 CompositonAPI中
const router = useRouter()
const route = useRoute()
const gotoList = () => {
  router.push('/list')
  console.log(route)
}
</script>
<template>
  <div>我是APP</div>
  <button @click="$router.push('/home')">跳首页</button>
  <button @click="gotoList">跳列表页</button>
</template>
<style scoped></style>

4、按需使用element plus，

pnpm install element-plus
pnpm add -D unplugin-vue-components unplugin-auto-import

在vite.config.ts中的配置：

import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    AutoImport({
      resolvers: [ElementPlusResolver()]
    }),
    Components({
      resolvers: [ElementPlusResolver()]
    })
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  }
})

默认components下的文件也会被自动注册。比如TestCom.vue可以直接<test-com></test-com>
5、token保存到pinia例子，先安装pinia持久化：

pnpm add pinia-plugin-persistedstate -D