生产环境中使用Vue3+TS+Vite
sonder 大杯
  2021-12-27 14:22:49 2021-12-27 14:22      373 字  1 分钟  

在生产环境中使用Vue3+TS+Vite

最近在新的项目中使用了Vue3，也是第一次在生产环境中使用Vue3做项目，很像写React但比React写起来舒服

  • 没有了this的使用
  • 根据TS定义接口，编写类型，在编译过程中就能避免低级错误，代码可阅读性强
  • Model的定义，在请求接口时返回的数据结构及类型，便于维护和一目了然的字段管理. 安装插件json2ts. 使用快捷键ctrl+alt+x来生成Model的接口(windows)
  • 使用axios-mapper发起网络请求，更方便对Model进行使用，整体比axios更方便感觉
  • scss的使用使得一些常用样式的封装的更加方便，之前不是很懂的语法现在也可以熟练使用，算是一次进步吧
  • 由于第一次使用，没有办法说出更深度的内容，只是一种在开发过程中的体验



在开发过程中，Vite的热更新非常快，但是有时也会需要自己手动刷新才会生效，不知是否与我用的Vscode的终端有关，总之速度效率上还是非常给力的.

在配置vite.config.js中可以参考
vitejs



在修改main.js为main.ts时，编辑器报错，解决办法为根目录创建一个文件shims.d.ts

1
2
3
4
5
declare module '*.vue' {
    import { ComponentOptions } from 'vue'
    const componentOptions: ComponentOptions
    export default componentOptions
}


byebye
  • 本文标题：生产环境中使用Vue3+TS+Vite
  • 本文作者：sonder
  • 创建时间：2021-12-27 14:22:49
  • 本文链接：https://sonderss.github.io/2021/12/27/生产环境中使用Vue3-TS-Vite/
 评论