Rails Rails 7 esbuild 无法在 application 里 import controller 文件夹

wdrsam · 2022年08月01日 · 最后由 Catherine 回复于 2022年08月01日 · 438 次阅读

新起了一个项目,对照着改了一遍,相关的包括 package.json 全都一样。不知道哪里不对,每次 build js 的时候就会说 application 中引入 controllers 不对。但奇怪的是,我单独去引用 controllers 文件夹里面的 index 和 application 这两个 JS 文件,却没有任何问题。

我在引入了 bootstrap,试了下样式的可以用没有任何问题的,因为其实 build 出来本来也不会有什么问题。

但我就是不知道,到底为什么它会说 application 中引入 controllers 那里有问题,几乎是照着文档弄的。

麻烦各位看看能不能发现可能哪里有问题呢?不知道如何排查了。相关文件,都放下面了。

17:46:36 js.1   | 1 error
17:46:36 js.1   | [watch] build finished
17:46:49 js.1   | [watch] build started (change: "app/javascript/controllers")
17:46:49 js.1   | ✘ [ERROR] Could not resolve "./controllers"
17:46:49 js.1   |
17:46:49 js.1   |     app/javascript/application.js:3:7:
17:46:49 js.1   |       3 │ import "./controllers"

package.json

{
  "name": "app",
  "private": "true",
  "dependencies": {
    "@hotwired/stimulus": "^3.1.0",
    "@hotwired/turbo-rails": "^7.1.3",
    "@popperjs/core": "^2.11.5",
    "bootstrap": "^5.1.3",
    "bootstrap-icons": "^1.8.3",
    "esbuild": "^0.14.51",
    "sass": "^1.52.1",
    "sortable": "^2.0.0"
  },
  "scripts": {
    "build:css": "sass app/assets/stylesheets/application.scss app/assets/builds/application.css --no-source-map --load-path=node_modules",
    "build": "esbuild app/javascript/application.js --bundle --outdir=app/assets/builds"
  }
}

Procfile.dev

web: bin/rails server -p 3000
css: yarn build:css --watch
js: yarn build --watch

app/javascripts/application.js

// Entry point for the build script in your package.json
import "@hotwired/turbo-rails"
import "./controllers"

其中 controllers 文件夹里仅有 1 个默认的 application.js 和一个我自己加的 js 文件 app/javascripts/controllers/index_controller.js

import { Controller } from "@hotwired/stimulus"

// Connects to data-controller="hello"
export default class extends Controller {
  connect() {}

  greet() {
    console.log(123)
  }
}

app/javascript/controllers/application.js

import { Application } from "@hotwired/stimulus"

const application = Application.start()

// Configure Stimulus development experience
application.debug = false
window.Stimulus   = application

export { application }

manifest.js

//= link_tree ../builds

不可能有问题的

你去找一个 esbuild stimulus 的插件,估计就解决了

你 javascript/controllers 文件夹里有 index.js 文件吗?

u1435638317 回复

有的,controllers 下有 application.rb 和 index_controller.rb。

wdrsam 回复

特指 index.js,这个 js 文件里面要手工 import 其他文件。import 文件夹是某些工具例如 webpacker 配置的规则。

而且我没查过 esbuild 是否默认支持 import 文件夹的时候找 index.js。

我周末也遇到个类似的问题,但和楼主的还是不一样。 修改的 js 内容死活不生效,watcher 也看着正常 build 了文件。最后结果我执行了这个命令就正常了。

rake assets:clobber

这个命令仅仅是删除 public 下 build 出来的 assets 我看 outputs,但我明确的记着,之前操作我也手动删除过 build path 里的 js css,以及 public 下的。不过好在问题解决了,就没去深究了

需要 登录 后方可回复, 如果你还没有账号请 注册新账号