Как использовать jQuery и его плагин в TypeScript без импорта библиотеки?Jquery

Программирование на jquery
Ответить
Anonymous
 Как использовать jQuery и его плагин в TypeScript без импорта библиотеки?

Сообщение Anonymous »

Я работаю над новым веб-сайтом для своего проекта jQuery Terminal, который использует Docusaurus и TypeScript. Но я не хочу импортировать библиотеку и связывать ее с проектом. Я хочу использовать jsDelivr CDN для файлов, чтобы всегда получать последнюю версию библиотеки.
Это мой код, который загружает зависимость из CDN:
< pre class="lang-js Prettyprint-override">

Код: Выделить всё

import { useLayoutEffect, useRef } from 'react';
import clsx from 'clsx';

import useIsBrowser from '@docusaurus/useIsBrowser';
import Head from '@docusaurus/Head';

import useScripts from '@site/src/hooks/useScripts';
import './styles.css';

const replReady = () => {
return (
globalThis.jQuery &&
globalThis.jQuery.terminal
);
}

import { initTerminal, destroyTerminal } from './terminal';

type InterpreterProps = {
className?: string;
};

const terminal_scripts = [
'https://cdn.jsdelivr.net/npm/jquery',
'https://cdn.jsdelivr.net/combine/npm/jquery.terminal/js/jquery.terminal.min.js,npm/js-polyfills/keyboard.js,npm/jquery.terminal/js/less.js'
]

export default function Interpreter({ className }: InterpreterProps): JSX.Element {
const ref = useRef();

const isProd = process.env.NODE_ENV === 'production';
const isBrowser = useIsBrowser();
const isStatic = isProd && !isBrowser && !globalThis.jQuery;

useScripts(!globalThis.jQuery && terminal_scripts);

useLayoutEffect(() => {
(function loop() {
if (replReady() && styleReady()) {
initTerminal();
} else {
setTimeout(loop, 100);
}
})();
return destroyTerminal;
}, []);

function styleReady() {
// hack to prevent initalizaing of jQuery Terminal before style is loaded
return !!getComputedStyle(ref.current).getPropertyValue('--base-background');
}

return (




{isStatic && terminal_scripts.map(script => {
return 
})}




);
};
Существует два способа импорта скриптов, поскольку Docusaurus работает по-разному в режиме разработки (React) и производственном режиме (SSG).
Это работает нормально, за исключением ошибок TypeScript при использовании:

Код: Выделить всё

globalThis.jQuery
Я получил ошибку:

Свойство jQuery не существует для типа typeof globalThis.

Я пытался импортировать файлы d.ts:

Код: Выделить всё

/// 
/// 
внутри файла src/types.ts, который я пытался включить в tsconfig, и импортировать его в файл tsx. Но это не работает.
есть ли способ определить globalThis.jQuery в TypeScript? Было бы неплохо, если бы библиотека не входила в комплект.

Подробнее здесь: https://stackoverflow.com/questions/789 ... he-library
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Jquery»