Squeak.ru - шаблоны программирования

Как опубликовать компонент react+typescript

Я пытаюсь опубликовать компонент React, написанный с помощью Typescript, и у меня есть некоторые сомнения относительно того, как лучше всего

мое рабочее пространство:

./src
   index.tsx
   styles.module.css
   logo.svg
   SubcomponentFolder
       index.tsx
       styles.module.css

-Чтобы опубликовать его в менеджере пакетов (npm)
я создаю файл tsconfig с: объявлениями: true, module: commonjs, target: es5, jsx: react
Затем запустите tsc && npx copyfiles -F -u 2 \"src/lib/**/*.svg\" \"src/lib/**/*.css\" dist, это создаст папку с та же структура, но с файлами .js и файлами d.ts
мой вывод:

./dist
   index.js
   index.d.ts
   styles.module.css
   logo.svg
   SubcomponentFolder
       index.js
       index.d.ts
       styles.module.css

Это путь к этому? Или есть лучший способ приблизиться к этому? Я прочитал и увидел много сообщений и ответов, в которых говорилось, что можно использовать веб-пакет, но я не могу создать файлы определений .d.ts. А также с помощью веб-пакета он объединит реакцию и реакцию-дом и сделает пакет тяжелее, верно? Или я ошибаюсь?

-Чтобы использовать его в html-файле, например:
Также мне интересно, хочу ли я использовать свой компонент непосредственно в html-файле, импортирующем реакцию и реакцию-дом с использованием тега script, как я могу связать все, включая изображения и файлы css?


Ответы:


1

Похоже, вы немного зашли в этот проект, чтобы это слишком помогло, но пакет npm create-react-library выполняет всю настройку (включая машинописный текст) для публикации компонентов реакции в npm. Если у вас есть только один компонент, перенос не займет много времени.

07.09.2020
Новые материалы

Угловая структура архитектуры
Обратите внимание, что эта статья устарела, я решил создать новую с лучшей структурой и с учетом автономных компонентов: https://medium.com/@marekpanti/angular-standalone-architecture-b645edd0d54a..

«Данные, которые большинство людей используют для обучения своих моделей искусственного интеллекта, поставляются со встроенным…
Первоначально опубликовано HalkTalks: https://hacktown.com.br/blog/blog/os-dados-que-a-maioria-das-pessoas-usa-para-treinar-seus-modelos-de-inteligencia-artificial- ja-vem-com-um-vies-embutido/..

Сильный ИИ против слабого ИИ: различия парадигм искусственного интеллекта
В последние годы изучению и развитию искусственного интеллекта (ИИ) уделяется большое внимание и прогресс. Сильный ИИ и Слабый ИИ — две основные парадигмы в области искусственного интеллекта...

Правильный способ добавить Firebase в ваш проект React с помощью React Hooks
React + Firebase - это мощная комбинация для быстрого и безопасного создания приложений, от проверки концепции до массового производства. Раньше (знаете, несколько месяцев назад) добавление..

Создайте API с помощью Python FastAPI
Создание API с помощью Python становится очень простым при использовании пакета FastAPI. После установки и импорта вы можете создать приложение FastAPI и указать несколько конечных точек. Каждой..

Веселье с прокси-сервером JavaScript
Прокси-серверы JavaScript — это чистый сахар, если вы хотите создать некоторую общую логику в своих приложениях, чтобы облегчить себе жизнь. Вот один пример: Связь клиент-сервер Мы..

Получить бесплатный хостинг для разработчиков | Разместите свой сайт за несколько шагов 🔥
Статические веб-сайты — это веб-страницы с фиксированным содержанием и его постоянным содержанием. Но теперь статические сайты также обрабатывают динамические данные с помощью API и запросов...