在生产中使用Rails 7中的导入映射时javascript上的404错误

Question

我不确定这是一个重要映射问题还是其他问题，但是在Rails 7.0.alpha 2中，我在javascript文件上得到了404个错误。

​

​

想知道我是否错过了某种生产“编译”步骤，因为它在开发中运行良好。

# app/javascript/application.js
import "@hotwired/turbo-rails"
import "controllers"


# app/javascript/controllers/index.js
import { application } from "./application"

import VoteController from "./vote_controller.js"
application.register("vote", VoteController)


# app/javascript/controllers/vote_controller.js
import { Controller } from "@hotwired/stimulus"

// Connects to data-controller="vote"
export default class extends Controller {
  static targets = ["element"];

  toggle(event) {
    //event.preventDefault();
    event.target.classList.add("opacity-100");
    event.target.classList.remove("opacity-0");
  }
}


# config/importmap.rb
pin "application", preload: true
pin "@hotwired/turbo-rails", to: "turbo.js"
pin "@hotwired/stimulus", to: "stimulus.js"
pin "@hotwired/stimulus-loading", to: "stimulus-loading.js"
pin_all_from "app/javascript/controllers", under: "controllers"

然后，在我的app/views/layouts/application.html.erb文件中，我使用<%= javascript_importmap_tags %>来包含所有内容。

如果我在config.assets.compile = true中设置了production.rb，那么错误就会变成away...but --我不知道原因，也不知道它是否解决了核心问题。

Answer 1

在Rails 7.0.0中，已经修改了app/javascript/controllers/index.js。我找到了几种不同的方法来解决这个问题。

首先，尝试将import { application }行更改为从controllers/application导入，如下所示：

import { application } from "controllers/application"

然后将每个特定控制器导入的from参数修改为："controllers/name_controller"。

可选：

删除每个控制器的单个导入并使用：

// Eager load all controllers defined in the import map under controllers/**/*_controller
import { eagerLoadControllersFrom } from "@hotwired/stimulus-loading"
eagerLoadControllersFrom("controllers", application)

或者这个：

// Lazy load controllers as they appear in the DOM (remember not to preload controllers in import map!)
import { lazyLoadControllersFrom } from "@hotwired/stimulus-loading"
lazyLoadControllersFrom("controllers", application)

这个好像帮我修好了。奇怪的是，rails stimulus:manifest:update命令将用不起作用的旧样式替换它。

关于根本原因的更多信息和讨论：https://github.com/hotwired/stimulus-rails/issues/87

Answer 2

如果您使用的是Rails 7.0.0+ (稳定版本)，则不再需要运行rails stimulus:manifest:update (当使用导入映射时)，也不需要单独导入每个控制器。

因此，将app/javascript/controllers/index.js中的任何内容替换为以下内容：

// Import and register all your controllers from the importmap under controllers/*

import { application } from "controllers/application"

// Eager load all controllers defined in the import map under controllers/**/*_controller
import { eagerLoadControllersFrom } from "@hotwired/stimulus-loading"
eagerLoadControllersFrom("controllers", application)

// Lazy load controllers as they appear in the DOM (remember not to preload controllers in import map!)
// import { lazyLoadControllersFrom } from "@hotwired/stimulus-loading"
// lazyLoadControllersFrom("controllers", application)

以上代码是从https://github.com/hotwired/stimulus-rails/blob/main/lib/install/app/javascript/controllers/index_for_importmap.js复制的。