Signature_pad: Невозможно импортировать в TypeScript

Созданный на 5 февр. 2018 · 20Комментарии · Источник: szimek/signature_pad

Согласно описанию, я должен иметь возможность импортировать этот модуль в TypeScript следующим образом:
import * as SignaturePad from 'signature_pad';

TypeScript отказывается признать это действительным, потому что нет экспортированного модуля. Пожалуйста, экспортируйте модуль для совместимости с TypeScript.

Вот тема переполнения стека по этому поводу.

more info

Источник

jamie-thul

👍2

Самый полезный комментарий

Я только что выпустил бета-версию, переписанную на TypeScript. Файлы объявлений теперь предоставляются библиотекой. Вы можете установить его, используя yarn add signature_pad@beta . Исходный код по-прежнему доступен только в ветке typescript .

Он по-прежнему использует экспорт по умолчанию, но я тестировал его с помощью Webpack 4 и TypeScript 2.7.2, и он работает, если я импортирую его с помощью import SignaturePad from 'signature_pad' .

Было бы здорово получить обратную связь, если это сработает, возникнут ли проблемы и т. Д.

szimek 13 мар. 2018

👍7

Все 20 Комментарий

Если это не сработает, вы можете попробовать импортировать напрямую из signature_pad/dist/signature_pad.mjs .

Следующая версия, скорее всего, будет переписана на TypeScript - см. Ветку typescript . Мне «просто» нужно найти немного свободного времени, чтобы очистить его и выяснить конфигурацию накопительного пакета для всех версий (umd es5, es6, non-minified, minified и т. Д.) И как сгенерировать файлы декларации TS.

szimek 5 февр. 2018

👍3

@szimek Может

import * as SignaturePad from 'signature_pad'; Gives SignaturePad не является конструктором

import * as SignaturePad from 'signature_pad/dist/signature_pad.mjs'; Gives SignaturePad не является конструктором

const SignaturePad = require('signature_pad'); Gives SignaturePad не является конструктором

import SignaturePad from 'signature_pad'; Работает, но выдает ошибку машинописного текста

strongui 6 февр. 2018

👍1

Что именно в этом случае находится в переменной SignaturePad ? Код в signature_pad/dist/signature_pad.mjs просто объединяется вместе с исходным кодом ES6 с экспортом по умолчанию. Он должен просто работать, если TS не обрабатывает экспорт по умолчанию.

szimek 6 февр. 2018

@szimek TS

strongui 6 февр. 2018

Но эта библиотека не предоставляет файлы декларации TypeScript.

szimek 6 февр. 2018

@szimek это не так? То, что устанавливается, когда вы делаете install @types/signature_pad --save-dev , определенно есть файлы декларации TS. Разве это не одни и те же люди?

strongui 6 февр. 2018

Не знаю;) Вы можете увидеть все публикуемые файлы, например, здесь: https://www.jsdelivr.com/package/npm/signature_pad.

szimek 6 февр. 2018

@szimek Я только что заметил, что мой комментарий раньше не отображал всю строку установки из-за символа @ . Я его отредактировал. Обычно, если вы выполняете install @types/signature_pad --save-dev , вы увидите определения, установленные в папке @types/signature_pad . Интересно, кто это делает? Может быть, нам нужно связаться с ними, исправить это и объединить с пакетом по умолчанию lol

strongui 6 февр. 2018

Похоже, вы используете файл определений от ОпределенноТипед .

Если я правильно прочитал декларацию, это может сработать (извините, не пробовал, я только что наткнулся на эту проблему):
import { SignaturePad } from 'signature_pad';

MrJoe 9 февр. 2018

👎2

@strongui У меня такая же ошибка, как и у вас. Все перепробовала в комментариях,
Я тоже пробовал ваши комментарии @szimek . Абсолютно не сработало.
Сейчас я использую панель для подписи в файле JS, но мне нужно сменить место на TS
Я использую версию узла v6.11.2, а версия Typescript - v2.6.2
npm version { npm: '3.10.10', ares: '1.10.1-DEV', node: '6.11.2', zlib: '1.2.11' }

Selman-EE 13 февр. 2018

Я только что попробовал использовать TypeScript 2.7.2, и он отлично работает.

index.ts

import SignaturePad from 'signature_pad';

new SignaturePad(document.querySelector('canvas'));

index.html

<html>
  <body>  
    <canvas style="border: 2px solid #000"></canvas>
    <script src="bundle.js"></script>
  </body>
</html>

tsconfig.json

{
  "compilerOptions": {
    "outDir": ".",
    "noImplicitAny": true,
    "module": "es6",
    "target": "es3"
  }
}

webpack.config.js

module.exports = {
  entry: './index.js',  
  output: { filename: 'bundle.js' },
  module: {
    rules: [
      {
        test: /\.ts$/,
        use: 'ts-loader',
        exclude: /node_modules/
      }
    ]
  },
  resolve: {
    extensions: [ '.ts', '.js' ]
  }
};

Запустите yarn add signature_pad typescript webpack ts-loader && yarn run webpack . Затем откройте index.html и он должен работать.

szimek 18 февр. 2018

🎉1 👍1

@szimek спасибо, у меня работает

Selman-EE 23 февр. 2018

У меня работает с использованием TypeScript 2.4.2 и его импортом, как @szimek в комментарии выше.

tsconfig.json

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [
      "dom",
      "es2015"
    ],
    "module": "es2015",
    "moduleResolution": "node",
    "sourceMap": true,
    "target": "es5"
  },
  "include": [
    "src/**/*.ts"
  ],
  "exclude": [
    "node_modules"
  ],
  "compileOnSave": false,
  "atom": {
    "rewriteTsconfig": false
  }
}

pablomaurer 26 февр. 2018

Для тех, кто получает SignaturePad, это не ошибка умолчанию , как:
new SignaturePad.default(canvas, { backgroundColor: 'rgb(255, 255, 255)' });

onurkose 2 мар. 2018

👍3

Было бы здорово получить обратную связь, если это сработает, возникнут ли проблемы и т. Д.

szimek 13 мар. 2018

👍7

Мы используем бета-версию в приложении TypeScript 2.8, и она отлично работает.

Просто мелкие недочеты:

Получение необработанной ошибки на сенсорной панели, потому что const touch = event.targetTouches[0] не определено.
Аргументы метода toDataURL должны быть помечены как необязательные, если вы хотите сопоставить метод toDataURL холста.

StevenBarnettST 12 апр. 2018

❤1

@StevenBarnettST Исправлено! Спасибо, что сообщили об этих проблемах. Завтра выпущу новую бета-версию.

szimek 12 апр. 2018

Как правильно привязать ТИП / интерфейс панели подписи к переменной для автозаполнения и проверки ts?

Ross-Rawlins 19 февр. 2019

Для тех, кто получает SignaturePad, это не ошибка умолчанию , как:
new SignaturePad.default(canvas, { backgroundColor: 'rgb(255, 255, 255)' });

У меня это работает. Большое спасибо! (Symfony Webpack Encore)