尼采般地抒情

尼采般地抒情

尼采般地抒情

公告栏

此网站主题为本人手写主题, 主题待开源···

音乐盒

站点信息

文章总数目: 307
已运行时间: 1101
目录
  1. TS7053: 元素隐式具有 "any" 类型,因为类型为 "string" 的表达式不能用于索引类型 "{ doc_image: string; docx: string[]; }"。ts(7053)
  2. TS2531: Type ‘HTMLElement | null‘ is not assignable to type ‘HTMLElement‘
  3. TS2345: Typescript 'string | 类型的参数 null' 不能分配给“字符串”类型的参数.类型 'null' 不能分配给类型 'string'
  4. TS2307: 【找不到模块】或【ts 导入 js 文件】
  5. TS2339: Property 'replaceAll' does not exist on type 'string'
  6. TS2589: Type instantiation is excessively deep and possibly infinite.
尼采般地抒情

尼采般地抒情

尼采般地抒情

公告栏

此网站主题为本人手写主题, 主题待开源···

站点信息

文章总数目: 307
已运行时间: 1101


TS7053: 元素隐式具有 "any" 类型,因为类型为 "string" 的表达式不能用于索引类型 "{ doc_image: string; docx: string[]; }"。ts(7053)

const MINE_TYPES = {

doc_image: ['image/png', 'image/gif', 'image/jpeg', 'image/jpg', 'image/bmp'].join(','),
// 暂仅支持 docx 和 xlsx
docx: [
// 'application/pdf',
// 'application/msword',
'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
]
};

  • ts 对于传入的 apiType,编译器只知道为字符串而不是具体的 doc_image 或者 docx,所以需要自行使用断言以及显示声明传入的值与这些值一致。
const accept = MINE_TYPES[apiType as keyof typeof MINE_TYPES] || '\*';

TS2531: Type ‘HTMLElement | null‘ is not assignable to type ‘HTMLElement‘

  • 查找 DOM 这块,很有可能是找不到该 DOM 元素的,如下:

很确定 dom 层一渲染 dom 树,使用断言

// 点击按钮,返回顶部
const handleBackToTop = () => {
let page_content: HTMLElement = document.getElementById('file-page-content') as HTMLElement;
if (page_content !== null) {
page_content.scrollTop = 0;
}
};

TS2345: Typescript 'string | 类型的参数 null' 不能分配给“字符串”类型的参数.类型 'null' 不能分配给类型 'string'

const authorInfo = localStorage.getItem('LOGIN_USER')
? JSON.parse(localStorage.getItem('LOGIN_USER') as string)
: null;

TS2307: 【找不到模块】或【ts 导入 js 文件】

可以归为一类问题,都是导入非 ts 模块 而报错,而 ts 的编译是需要有声明类型的

这类报错一般有如下两种情况:

  1. import 导入依赖包,但是提示找不到该包
  2. ts 文件中导入 js 文件

原因:

  1. 依赖包没有做 ts 化,没有声明文件,或者说暴露出来的接口,import 不支持
  2. ts 不能导入 js,除非做一些配置文件的相关配置(但是尽量不要在 ts 项目存在 js 项目)

解决:

  • 国际化网站下载下来的是 js 文件,但是 vite 项目不能使用 require 来导入外部文件

vite 无法使用 require 的替代方案 - 古墩古墩 - 博客园,api 已废弃

en.d.ts 中添加

···
declare module '@/i18n/lang/zh.js';
declare module '@/i18n/lang/en.js';
···

然后再 ts 文件中直接导入使用即可

import zh from '@/i18n/lang/zh.js';
import en from '@/i18n/lang/en.js';
···
  • 解决方法 2:直接在 tsconfig 中配置可以使用 js 的配置项,但是需要单独添加 ts 编译后的 js 目录,改动较大

TS2339: Property 'replaceAll' does not exist on type 'string'

  • 解决方法:默认 TypeScript 不支持某些 es6 polyfill 函数,在 tsconfig.json 配置中进行配置新版本的 js 语法
{
...,
"compilerOptions": {
...,
"lib": [
...,
"ES2021.String"
]
}
}

TS2589: Type instantiation is excessively deep and possibly infinite.

  • 如果使用 js 文件导入,那么在 ts 文件中使用就会报 ts 2589 错误。
src/utils/fetch.ts:63:55 - error TS2589: Type instantiation is excessively deep and possibly infinite.

63 message[response.config.warnType as NoticeType](<i18n.global.t(msg)>);

使用如下方式导入 js 导出来的 js 和 json 数据

import { createI18n } from 'vue-i18n';
import config from './config.json';
import zh from '@/i18n/lang/zh.js';
import en from '@/i18n/lang/en.js';
import { ref } from 'vue';

let zh_obj = {};
zh_obj = zh;
let en_obj = {};
en_obj = en;
export const lang = ref('zh_obj');

export const languages = config;

const i18n = createI18n({
locale: lang.value,
fallbackLocale: lang.value,
messages: {
zh_obj,
en_obj
}
});

export default i18n;

评论区

Twikoo giscus