flatpickr 通过 rails importmap 未生成

flatpickr via rails importmap not being generated

正在尝试使用 flatpickr 作为 UI 来设置 Rails 7.0.1 和 ruby 3.1 的日期字段。单击输入字段时,未呈现预期的 2 个月日历,事实上,浏览器网络选项卡中未注册任何内容。

bin/importmap pin flatpickr rails 将库固定到 importmap.rb 文件中的 cdn 后:

pin "flatpickr", to: "https://ga.jspm.io/npm:flatpickr@4.6.9/dist/flatpickr.js"

application.js 具有最初生成的 import "controllers".

flatpickr_controller.rb 是在 javascript/controllers 目录中创建的

import { Controller } from "@hotwired/stimulus"
import flatpickr from "flatpickr"

export default class extends Controller {
  connect() {
    this.config = {
      enableTime: false,
      dateFormat: 'Y-m-d',
    }
  }
}

视图部分调用:

<%= form_with model: promo do |f| %>
  <%= f.text_field :date_from, placeholder: t(".select"), data: { controller:  "flatpickr" } %>
<% end %>

同时控制器设置

    @promos = Promo.up_comings(60)
    @promo = Promo.new
    @next_promo = Promo.next
    @dates_to_disable = @promos.pluck(:date_from)

为什么日历没有呈现?
我也对在哪里放置不同的 flatpickr 选项感到困惑:在控制器中,或者直接放入表单日期元素中。

该问题与对 Stimulus 3 的支持有关。固定如下:
bin/importmap pin stimulus-flatpickr@beta

还参考了一些css来源,例如最新版本
<link rel="stylesheet" href="https://ga.jspm.io/npm:flatpickr@4.6.9/dist/flatpickr.min.css">
否则输入字段将被视为只读...