热线Rails - 无法在模块外使用import语句

Question

我已经在现有的Rails项目中安装了hotwire-rails。 甚至在编写任何与hotwire相关的代码之前，我在每个页面的浏览器控制台上都会收到以下错误消息： Uncaught SyntaxError: Cannot use import statement outside a module in application.debug-86...95.js:53462 错误所指的行如下：

import { Controller } from "@hotwired/stimulus"

我正在使用Rails 6.1.3.1版本，并且使用Sprockets处理资产。以前我只在使用webpack的Rails项目中使用过Hotwire，所以不确定是否与此有关。

- StuartFrost

Answer 1

不确定这是否是您问题的解决方案，但在最近更新的Rails 7应用程序中删除webpack并安装importmap-rails后，我遇到了完全相同的错误。但它是指向我的application.js中的导入语句，而不是js控制器。 通过将javascript_include_tag中的type:"module"添加到我的一个布局中解决了这个问题。 最终解决方案：

   <%= javascript_include_tag 'application', type: "module" %>

如果您已经通过 javascript_importmap_tags 导入了所有内容，那么只需删除 javascript_include_tag 即可。

- Manuel Farez

---

使用webpack（从webpacker迁移而来），这将问题转移到了“Uncaught TypeError：Failed to resolve module specifier“ ol / Map”。”。相对引用必须以“/”，“./”或“../”开头的JavaScript中的import Map from 'ol/Map';，而不是Stimulus（尽管我希望将其移动到那里）。向前或向侧面移动。 - Greg

Answer 2

在Rails 7中，Turbo预装了一些gem，如果您使用的是Rails 6，则需要手动安装这些gem。

1/ 安装gem importmap-rails 2/ 安装gem stimulus-rails 这应该可以解决您的问题。

- Samuel Faure