typescript - وارد کردن css-element-queries به یک برنامه Angular 6

من در تلاش هستم که کتابخانه css-element-queries را نصب و استفاده کنم.

برای نصب، من از دستور زیر استفاده کردم:

npm i css-element-queries

بعد از آن، سعی کردم کلاس ResizeSensor را از کتابخانه به این صورت وارد کنم:

import { ResizeSensor } from 'css-element-queries';

اما کامپایلر خطای زیر را بازیابی میکند:

نمیتوان فایل اعلان برای ماژول 'css-element-queries' پیدا کرد. 'c:/PrjNET/Elevation3/FW/4.00/Mainline/Framework/Development/Client/ElevationJS/ngcore/node_modules/css-element-queries/index.js' به طور ضمنی دارای نوع 'any' است. اگر وجود دارد، سعی کنید npm install @types/css-element-queries را اجرا کنید یا یک فایل اعلان جدید (.d.ts) اضافه کنید که شامل `declare module 'css-element-queries';` باشد.

بر اساس پیام خطا، من سعی کردم دستور npm زیر را اجرا کنم:

npm install @types/css-element-queries

اما کامپایلر خطای زیر را بازیابی کرد:

npm ERR! کد E404 npm ERR! 404 پیدا نشد: @types/css-element-queries@latest

چگونه میتوانم کتابخانه css-element-queries را وارد کنم؟

پاسخ شماره ۱

من از Angular استفاده نمیکنم، اما تازه به وارد کردن ResizeSensor در یک برنامه مبتنی بر TypeScript برخورد کردهام. نمیدانم css-element-queries چه زمانی ResizeSensor.d.ts را اضافه کرده است، اما اکنون بخشی از بسته است.

با این حال، آن فایل نادرست است. من برای آن یک مشکل در گیتهاب ثبت کردهام. دیروز من کمی تحقیق کردم دربارهٔ نحوه وارد کردن آن و در نهایت به مطالعهٔ انواع مختلف ماژولها و نحوه ایجاد یک فایل تایپینگ در مستندات تایپاسکریپت پرداختم.

این من را به روش صحیح تعریف فایل تایپینگ برای ResizeSensor هدایت کرد. اساساً فایل موجود در مخزن گیتهاب را گرفته و خط خروجی آن را به صورت زیر تغییر دهید:

export default ResizeSensor;

به

export = ResizeSensor;

سپس میتوانید از این به عنوان واردات خود استفاده کنید:

import ResizeSensor = require('Libs/css-element-queries/ResizeSensor');

مسیر شما به css-element-queries متفاوت خواهد بود زیرا تا زمانی که نگهدارنده بسته فایل .d.ts را اصلاح نکند، نمیتوانید آن را از npm بگیرید.

در اینجا یک لینک به مسئله گیتهاب وجود دارد.

پاسخ شماره ۲

در حالی که هنوز پکیج تایپینگ وجود ندارد، من قادر هستم از پکیج css-element-queries با استفاده از این ایمپورتها استفاده کنم:

import * as ElementQueries from 'css-element-queries/src/ElementQueries';
import * as ResizeSensor from 'css-element-queries/src/ResizeSensor';

اتم هنوز هشدارهای اطلاعاتی دربارهی نتوانستن برای یافتن فایل اعلامیه میدهد، اما هنوز کار میکند. امیدوارم این کمک کند!