Configuré un nuevo proyecto de Rails 7 con esbuild: rails new my_project -j esbuild

Luego agregué Vue.js con yarn add vue .

Puedo ver que Vue se agregó con éxito a mi archivo package.json :

 { "name": "app", "private": "true", "dependencies": { "@hotwired/stimulus": "^3.0.1", "@hotwired/turbo-rails": "^7.1.1", "autoprefixer": "^10.4.5", "esbuild": "^0.14.38", "postcss": "^8.4.13", "tailwindcss": "^3.0.24", "vue": "^3.2.33" }, "scripts": { "build": "esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds", "build:css": "tailwindcss -i ./app/assets/stylesheets/application.tailwind.css -o ./app/assets/builds/application.css --minify" } }

Luego agregué import "./vue_controllers" a mi archivo application.js :

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

y colocó un código básico de Vue.js en ./vue_controllers/test.js :

 import Vue from 'vue'; document.addEventListener('turbo:load', () => { const element = document.getElementById('point'); if (element != null) { const app = Vue.createApp({ data() { return { count: 1 } }, created() { alert(`count is: ${this.count}`) } }) const vm = app.mount(element) } })

Cuando inicio el servidor con ./bin/dev , aparece el siguiente error:

 13:07:47 js.1 | ✘ [ERROR] Could not resolve "./vue_controllers" 13:07:47 js.1 | 13:07:47 js.1 | app/javascript/application.js:4:7: 13:07:47 js.1 | 4 │ import "./vue_controllers" 13:07:47 js.1 | ╵ ~~~~~~~~~~~~~~~~~~~ 13:07:47 js.1 | 13:07:47 js.1 | 1 error

Luego traté de colocar el archivo dentro de ./controllers en su lugar. No recibo un error cuando hago eso, pero el archivo js no se carga.

También intenté cambiar el nombre del archivo a ./controllers/test_controller.js pero aún no se ejecuta.

La única forma en que puedo hacer este tipo de ejecución es colocando el código directamente en mi archivo application.js . Cuando hago eso, se ejecuta el código Vue, el objeto en el que está montado se procesa por un segundo y luego desaparece.

¿Alguna idea de cómo puedo ejecutar el código Vue.js usando Rails 7 y esbuild?

Gracias por adelantado