VUE - TS

2024年2月20日 144次阅读 来源: 牵着蜗牛散步

ts – vue 配置

shims-tsx.d.ts 中 Window 属性声明 appData/wx
util/base输出使用 Vue.prototype.function
util/filters 无法全局注册·单文件注册使用
$refs使用

vuex

https://juejin.im/entry/5a373…
https://juejin.im/post/5c46c6…
vuex-class
import { State, Action, Getter } from ‘vuex-class’;

vue-router

$router / $route / util/base方法 需要声明才能使用(在ts中)

declare module 'vue/types/vue' {
  interface Vue {
    $router: VueRouter;
    $route: Route;
    checkLink: any;
    toRouter: any;
  }
}

路由守卫使用 Component.registerHooks([‘beforeRouteEnter’, ‘beforeRouteLeave’, ‘beforeRouteUpdate’]);

滚动行为
router – scrollBehavior(to, from, savePosition)

axios·二次封装·catch·拦截器

request.ts – catch(res => processResponseError(res.response))

vue-property-decorator·装饰器写法

action/mutation 抽离

模块下的mutation使用 store.commit(‘UploadImage/uploadPicture’); – “modules文件名/mutation方法名”

选手列表·实现逻辑(价值)

打包出来的文件 – vue-cli

<link href=https://cdn.myfans.cc/new-vote/css/app.5f255f15.css rel=preload as=style>
<link href=https://cdn.myfans.cc/new-vote/css/chunk-vendors.282efb41.css rel=preload as=style>
<link href=https://cdn.myfans.cc/new-vote/js/app.988f2c80.js rel=preload as=script>
<link href=https://cdn.myfans.cc/new-vote/js/chunk-vendors.3eeeb0f7.js rel=preload as=script>


app.css - 本项目的公用css
chunk-vendors.css - 引入ui框架的公用css

app.js - 模块化开发/通过路由来判断何时引入并使用相应页面的模块打包文件和样式
chunk-vendors - 依赖js

分包加载-vant · css打包 · vue-cli3.0配置

    原文作者：牵着蜗牛散步
    原文地址: https://segmentfault.com/a/1190000019875652
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞