相关疑难解决方法(0)

TypeScript:“Window & typeof globalThis”上不存在属性“X”:使用“declare global”的建议解决方案给了我错误

编辑:这是一个 ESlint 问题。我在这篇文章的末尾包含了我的 ESLint 设置。

我对 TypeScript 还很陌生——我一直在重构别人的 React 代码,当我遇到这一行时,将其移至 TypeScript 以用于工作项目

        const memoryOptionsResponse = window.webchatMethods.getMemory(chatId);
Run Code Online (Sandbox Code Playgroud)

TypeScript 抱怨“window.webchat”,说

“Window & typeof globalThis”上不存在属性“X”

经过一番谷歌搜索后,答案似乎是将其放在模块的根级别

declare global {
    interface Window {
        webchatMethods:any;
    }
}
Run Code Online (Sandbox Code Playgroud)

但是现在 TS 抱怨以下错误。

这个 Stack Overflow 页面建议了一些类似的东西,但它再次declare global和 ESLint 犹豫不决。

在尝试解决这个问题半小时后,我决定向您寻求建议——如果有人知道一个好的解决方案,我将不胜感激!

在此处输入图片说明

// .eslintconfig
{
  "parser": "babel-eslint",
  "parserOptions": {
    "ecmaVersion": 2020,
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true,
      "modules": true
    }
  },
  "extends": [
    "eslint:recommended",
    "prettier",
    "plugin:react/recommended"
  ],
  "plugins": [
    "prettier",
    "react",
    "react-hooks"
  ],
  "env": …
Run Code Online (Sandbox Code Playgroud)

typescript reactjs

7
推荐指数
1
解决办法
3344
查看次数

Nodejs ws 模块:TypeScript 中的心跳

我目前正在努力使用 TypeScript 在 NodeJs 上运行 WebSocket 服务器。作为 WebSocket 服务器实现,我使用ws。除此之外,我还使用@types/ws包进行打字。我希望服务器定期向每个连接的客户端发送 ping 包。ws 模块的自述文件已经提供了一个 JavaScript 实现示例,我也想使用它。您可以在这里找到示例实现:

我面临的问题是,示例实现将“isAlive”属性添加到套接字对象,这显然无法在 TypeScript 中执行,因为套接字类不存在“isAlive”属性。

我的问题:将此属性添加到套接字类的最佳方法是什么?由于我将这些套接字对象作为参数传递,因此我希望避免向以某种方式与套接字一起使用的所有文件添加某种额外的导入。

我想避免将套接字对象类型转换为任何类型。

我尝试围绕 ws 实现一个包装器类,以便我可以实例化我的 WebSocket 类并在整个应用程序中使用它。

我的班级看起来像这样

import * as ws from "ws";


export default class WebSocketServer {
  private wss: ws.Server;
  private onSubscription: (socket: ws, deviceId: string, topicFilter: string) => void;

  constructor(port: number, onSubscription: (socket: ws, deviceId: string, topicFilter: string) => void) {
    this.wss = new ws.Server({ port });
    this.onSubscription = onSubscription;
    const conhandler = this.handleConnection.bind(this); …
Run Code Online (Sandbox Code Playgroud)

websocket node.js typescript ws

6
推荐指数
1
解决办法
6027
查看次数

在打字稿中使用 globalThis

我正在尝试在 Typescript 中使用 globalThis,我想就如何以更好的方式编写它提出一些建议。
目前的实现是这样的:

创建一个文件types/global.d.ts并在里面添加

interface Global {
   foo: string
}

declare let foo: Global["foo"];
Run Code Online (Sandbox Code Playgroud)

tsconfig.json添加

"files": [
  "types/global.d.ts"
]
Run Code Online (Sandbox Code Playgroud)

然后,以设定的值foo使用

(globalThis as any).foo = "The value of foo"
Run Code Online (Sandbox Code Playgroud)

我不喜欢这种方法首先是需要样板(但我认为这是无法避免的),其次是(globalThis as any).foo =表达式

typescript

6
推荐指数
4
解决办法
9907
查看次数

在 Typescript 中显式设置 Intercom 窗口类型会引发错误

根据此处的讨论,我必须扩展窗口对象才能强类型 Intercom 的窗口功能。

最初的代码是这样的:

  setCurrentRoute() {
    if (
      this.currentRoute.getValue().indexOf('website') > -1 ||
      this.currentRoute.getValue().indexOf('builder') > -1
    ) {
      (window as any).Intercom('update', {
        hide_default_launcher: true,
      });
    } else {
      (window as any).Intercom('update', {
        hide_default_launcher: false,
      });
    }
    localStorage.setItem('currentRoute', this.currentRoute.getValue());
  }
Run Code Online (Sandbox Code Playgroud)

但当我尝试利用更多 Typescript 的类型安全功能时,它现在看起来像这样:

  declare global {
    interface Window {
      Intercom(update: string, params: { hide_default_launcher: boolean }): void;
    }
  }

  setCurrentRoute(): void {
    if (this.currentRoute.getValue().indexOf('website') > -1 || this.currentRoute.getValue().indexOf('builder') > -1) {
      this.window.Intercom('update', {
        'hide_default_launcher': true
      });
    } else {
      this.window.Intercom('update', …
Run Code Online (Sandbox Code Playgroud)

typescript

6
推荐指数
2
解决办法
2401
查看次数

Typescript:将窗口上的属性更改为可选?

默认的 TS 类型window.NotificationNotification,但由于 Web 通知 API 只有 90% 的浏览器支持,因此应该是Notification | undefined。我最近遇到一个错误,我在使用时window.Notification没有检查它是否已定义。

有没有办法覆盖 的属性window,例如使它们可选?我尝试了这个,但没有成功:

declare global {
  interface Window {
    Notification?: Notification;
  }
}
Run Code Online (Sandbox Code Playgroud)

javascript typescript

6
推荐指数
1
解决办法
145
查看次数

如何在 Angular 5 中获取当前请求的 url (window.location)?

如何在 Angular 5 中获取当前请求的 url?

我尝试了在网上找到的几个解决方案,但似乎没有任何效果。- $window - 在 WindowRef 示例中包装本机窗口

我整个早上都在寻找这个,但对 Angular 有点陌生,并且迷失在针对不同版本 Angular 的在线不同示例中。

更新:我正在使用 TypeScript

谢谢

angular asp-net-core-spa-services angular5

5
推荐指数
2
解决办法
8861
查看次数

使用 Jest、AudioContext 进行测试和模拟

我在尝试对使用 AudioContext 的类进行一些测试时遇到了很多麻烦。我相信我的很多挫败感源于对模拟函数以及可能的测试执行方式没有很好的理解。

我正在尝试测试一个采用 AudioContext 的类,但是在运行测试时我不断收到此错误:

使用 TypeScript 文件时: TypeError: (window.AudioContext || window.webkitAudioContext) is not a constructor
此错误发生在 app.ts 文件中。当我运行测试时,它是否必须解决或执行它的所有依赖项?

使用 JavaScript 文件时,测试文件中会出现此错误:ReferenceError: AudioContext is not defined

现在,我假设我必须制作一个模拟 AudioContext。我什至如何了解 AudioContext 上的所有方法以开始手动模拟它?

这是我的工作表的简化版本。我将提供两者的 TS 和 JS 版本:

打字稿文件版本:

// app.ts
import Sampler from './Sampler';
const audioContext: AudioContext = new (window.AudioContext || window.webkitAudioContext)();
const sampler: Sampler = new Sampler(audioContext);


// Sampler.ts
export default class Sampler{
    private audioContext: AudioContext;

    constructor(audioContext: AudioContext){
        this.audioContext = audioContext;      
    }
 }
Run Code Online (Sandbox Code Playgroud)

JS 文件版本:

// app.js
const Sampler …
Run Code Online (Sandbox Code Playgroud)

javascript testing unit-testing typescript jestjs

5
推荐指数
1
解决办法
1616
查看次数

Firebase Firestore 模拟器错误`已在 settings() 和 useEmulator() 中设置了主机,将使用模拟器主机`

首先,这是我得到的完整错误。

@firebase/firestore:Firestore (8.1.1):在 settings() 和 useEmulator() 中都设置了主机,将使用模拟器主机
错误 [FirebaseError]:Firestore 已经启动,无法再更改其设置。您只能在调用 Firestore 对象上的任何其他方法之前修改设置。

这就是我初始化模拟器的方式

const db = app.firestore();
const auth = firebase.auth();
if (process.env.NODE_ENV === 'development') {
  db.useEmulator('localhost', 8888);
  firebase.auth().useEmulator('http://localhost:9099/');
}
Run Code Online (Sandbox Code Playgroud)

当我第一次启动应用程序时,项目正在运行 nextjs 一切都按预期运行,但是在 next.js 页面之间刷新或导航后,我突然收到此错误。我必须杀死终端并重新开始,这很烦人我不知道 next.js 服务器是否多次运行if (process.env.NODE_ENV === 'development')代码,这可能是导致此错误的原因,如果是这种情况下如何避免在那里设置新模拟器已经是一个了。还是与 firebase 模拟器相关的错误?

firebase reactjs next.js google-cloud-firestore firebase-cli

5
推荐指数
2
解决办法
937
查看次数

打字稿:使用“ .d.ts”文件向“窗口”添加功能

我有一个旧版* .js应用程序,想将其部分移植到打字稿上。

到目前为止,我已经为大多数使用的软件包找到了@types定义,但是在window对象中添加了一个全局函数。

我能够通过在* .ts文件开头添加addind来解决编译错误:

declare global {
    interface Window {
        openConformationModal?: any;
    }
}
Run Code Online (Sandbox Code Playgroud)

现在,我不想在我所有的* .ts中都包含它,所以我想将其添加到* .d.ts文件中,以便在所有软件包中都可以识别它。

问题是,如果我将同一文件添加到例如window.d.ts文件,则无法识别该文件。我知道找到了文件夹中的类型,因为我添加了

 {
  ...,
  "compilerOptions": {
    ....
    "typeRoots": [
      "FFOLDERPATH_TO_D_TS_FILE"
    ]
  }
}
Run Code Online (Sandbox Code Playgroud)

并且找到另一个* .d.ts。

PS:解决方案基于您如何在TypeScript中的“ window”上显式设置新属性?

typescript

4
推荐指数
1
解决办法
3665
查看次数

Angular 6中的MathJax吗?

不幸的是,关于这个库的信息很少。安装后我还不太清楚我需要将哪些内容导入到app.module.ts中,以及是否有要导入的内容?我在index.html中规定了以下代码:

<script type="text/x-mathjax-config">
MathJax.Hub.Config({
  tex2jax: {
    inlineMath: [['$','$'], ['\\(','\\)']]
  }
});
</script>
<script type="text/javascript" async
 src='https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/latest.js? 
 config=TeX-MML-AM_CHTML'>
</script>
Run Code Online (Sandbox Code Playgroud)

如果我没有简单的文本,但是在某些列中出现带有公式的文本的表,该如何应用MathJax?也许您可以以某种方式将整个表转移到MathJax.Hub.Queue?

mathjax angular angular6

4
推荐指数
1
解决办法
1126
查看次数