Skip to main content

9 posts tagged with "typescript"

View All Tags

GraphQL 项目搭建

· 14 min read
Alan
Alan
Maintainer of blog

本文转摘自公众号文章: GraphQL实践

随着业务的增长，页面涉及的业务线越来越多, 为了实现一个需求, 需要调用多个接口组合数据, 然后绑定到 UI 组件上. 每个接口返回的数据会有很多字段是不会使用的, 浪费了网络流量. 为了解决该问题, 我们小组引入了 GraphQL 作为 BFF 层, 利用 GraphQL 服务减少网络请求次数, 以及数据裁减能力减少网络响应数据量.

下面简单介绍一下我们组的 GraphQL Node 服务端项目的搭建过程.

TypeScript声明window全局变量

· One min read
Alan
Alan
Maintainer of blog

TypeScript项目如果用到了一些第三方JS类库，但是没有提供d.ts文件时, 可以自己手动声明.

一般是在源码的src目录下, 创建global.d.ts文件, 以下示例声明jQuery的$以及一个Gitalk类库的类型:

src/global.d.ts
interface Window {
  Gitalk: Gitalk
  $: any
}

interface Gitalk {
  new(options: {
    clientID: string,
    clientSecret: string,
    repo: string,
    owner: string,
    admin: Array<string>,
    id: string,
    distractionFreeMode: boolean
  }): GitalkInstance
}
interface GitalkInstance {
  render(id: string): void
}

然后就可以使用 new window.Gitalk({ ... }) 创建实例了.

实际上任何interface声明的类型, 都可以自己手动扩展. 而type声明的类型则无法再次扩展. 这也是interface和type的一个主要区别.