Vue.js应用程序在开发中工作,但没有使用Rails 5.2.0 / Webpacker在生产中安装模板 – 空白屏幕在控制台中没有错误

我正在使用Rails 5.2.0和Webpacker gem来部署Vue应用程序。

show.html.erb文件非常简单:

然后在我的入口包中,打包/ my_vue_app.js:

 import TurbolinksAdapter from 'vue-turbolinks'; import Vue from 'vue/dist/vue.esm' Vue.use(TurbolinksAdapter); import MyComponent from '../components/my_app/index.vue' document.addEventListener('turbolinks:load', () => { var element = $('[data-behavior="vue-app"]'); if(!element) { return }; console.log('Initializing Vue'); const app = new Vue({ el: element[0], data: { }, components: { MyComponent } }) }) 

在开发中,一切都很好。 该应用程序已安装并正常运行。

但是在生产中,在页面加载和JS运行之后,

将从分页中删除,只留下

在控制台中,绝对没有错误。 我可以使用DevTools确认已加载pack js文件,并且已解析,因为console.log是在控制台中打印的。

哎呀,certificateVue正在工作的是在JS解析后从DOM中删除了挂载它的整个

最奇怪的是,我可以通过在console.log行上附加调试器并在调试器暂停执行时将其关闭来让应用程序挂载ONCE。 即使是艰难的我看到应用程序安装的时间,我以后无法安装它,甚至再次调试调试器……它真的,非常奇怪。

这些是package.json的版本:

"vue": "^2.5.16", "vue-loader": "14.2.2", "vue-template-compiler": "^2.5.16",

Rails应用程序是全新的,没有默认配置。

Webpacker gem为3.5.3,Rails为5.2.0。

在这花了很长时间后,我才发现这个github问题: https : //github.com/rails/webpacker/issues/1520

编辑 :我提供了一个链接到真正的生产应用程序发生此错误: https : //planilha.tramitacaointeligente.com.br/planilhas/ED2sUXz32-R9CJKdkmtf8Q

你会发现它没有安装。 这是开发中的同一页面:

应用程序安装截图