Можно ли загрузить Uppy в ванильное приложение Rails через карты импорта Rails 7?
Если вы в конечном итоге закрепите @uppy/core, вы получите много зависимостей, добавленных в ваш файл importmap:
bin/importmap pin @uppy/core
... но когда вы пытаетесь получить к нему доступ через контроллер Stimulus, например:
import Uppy from '@uppy/core';
Вы получаете множество не очень полезных ошибок.
Сафари показывает:
syntaxerror: Importing binding name 'default' cannot be resolved by star export entries.
И у Chrome есть несколько разных ответов:
SyntaxError: The requested module 'classnames' does not provide an export named 'default'
(Я также видел, что это проблема для mime-match вместо classnames.
Я немного запутался с отладкой этого - сложно понять, откуда может возникнуть проблема. Это тип ответа «не могу использовать импортные карты Rails 7»?
🤔 А знаете ли вы, что...
Ruby on Rails популярен для быстрого создания MVP (Minimum Viable Product) стартапов и прототипов.
Я думаю, это связано с разными стилями импорта, поддерживаемыми в разных окружениях. Сопровождающие jspm и importmap-rails призывают пользователей сообщать о проблемах или исправлениях с зависимостями. например
Мне удалось воспроизвести проблему Failed to register controller: uppy (controllers/uppy_controller) SyntaxError: The requested module 'mime-match' does not provide an export named 'default', которую вы видели при использовании unpkg.
У JSPM, похоже, нет проблем, и я думаю, что он делает немного больше, чтобы сгладить их. Вы можете попробовать переключиться с помощью флага --from jspm. Хотя, я считаю, что это по умолчанию.
❯ ./bin/importmap pin @uppy/core @uppy/drag-drop --from jspm
Мне этого было достаточно, чтобы получить базовый контроллер для загрузки Uppy и его плагина перетаскивания:
import { Controller } from "@hotwired/stimulus"
import { Uppy } from "@uppy/core"
import { default as DragDrop } from "@uppy/drag-drop"
// Connects to data-controller = "uppy"
export default class extends Controller {
connect() {
const uppy = new Uppy({ })
.use(DragDrop, {
target: "#drag-drop"
})
window.uppy = uppy;
Я не стал экспериментировать дальше. Может быть нужно больше.