不知不觉毕业已经一坤年了，啥也没学会，就会唱跳...

使用环境

• 尽量使用pnpm，npm偶尔出现问题，引入的某些库需要手动重新引入，目前没找到原因
• 我的node-v: 16.17.0
• vscode + volar + mac

关于Vue2.7

• 在我看来属于是Vue2与Vue3的中间产物
• 让喜欢composition-api的童鞋在兼顾浏览器兼容的同时可以尝试新写法
• 当然，这个还是有些东西跟V3不是那么的相似，还是采用了Vue2的逻辑

举个🌰

• 这是踩坑！scf-setup需要两个script标签，主动声明model属性，不然无法实现v-model语法糖。如果需要声明组件name。也需要在新起的script中导出。

• vue2.7中不可将 :test.sync="testValue"改写为 v-model:test="testValue"，不生效！
• Vue3中将$listeners和$attrs合并了，使用时只需要v-bind='$attrs'即可，但是在Vue2.7中还是需要用到v-on='$listeners'，Vue3文档链接

• Vue3的Jsx转化插件较为完美，没有发现啥比较难用的点。但是在Vue2.7的转化插件，嗯...跟坤哥当NBA代言人一样让人XXXXX。v-model无法使用

这个链接带了些啥？

当然是我家咯咯的？？

• 纯ts项目，支持scf-setup，tsx，sfc，sfc-setup-ts
• tsx请使用render返回template，此种方式可以使用v-model，保留ts类型推断。具体可以查看test.tsx组件。
• 简单使用Vuex，使用Vuex实属无奈之举，纯属公司项目必备，如果有需要可以自行修改为pinia。

  • useStoreState

    使用的时候保留类型推断，module需要存在于IRootStoreState。返回的是一个computedState，可以直接更改。举个例子

        const username = useStoreState<string>('username', 'SET_USER', 'user')
        function todo() {
          username.value += '又是两年半了'
        }
        // 点击触发
        todo()
        // <span @click="todo">{{ username }}</span>
    

• 简单封装了下axios，使用vue-request做进一步处理，具体参考vue-request文档
• element-ui不建议使用vite自动引入，el-message等相关样式会有问题。此处report一个问题，是不是我sass版本太高了。每次跑element的样式狂警告，写法需要替换。。啥时候能维护下？自定义样式也出现问题，无法使用官网中提供的复写变量的方法

     /* 改变主题色变量 */ 
     $--color-primary: teal; 
     /* 改变 icon 字体路径变量，必需 */ 
     $--font-path: '~element-ui/lib/theme-chalk/fonts'; 
     @import "~element-ui/packages/theme-chalk/src/index";    

• 简单重新写了份RouteConfig类型。根据自己喜欢的来哈
• 项目中配置了挺多的自动导入
  • @vueuse/core
  • vue
  • vuex
  • vue-router
  • ...具体参考vite.config.ts
• 带了antfu大佬的eslint配置和我自己搞得简单的stylelint
• 带了echarts

好像也没啥了？

哦！还支持Pug模板。

一个简单的探索项目，该踩坑踩坑。
如果大家，有其他的问题，可以给我留言，大家一起看看咋解决～～