我创建了一个新的rails 5.2应用程序,并安装了vue,其中包括:

bundle exec rails webpacker:install:vue

在创建了一个简单的端点Home#landing并将<%= javascript_pack_tag 'hello_vue' %>添加到默认布局后,示例应用程序按预期工作.

我做了一些改变:

1) 修改了hello_vue.js to,

import Vue from 'vue'

document.addEventListener('DOMContentLoaded', () => {
  const app = new Vue({
    el: '#vueapp',
    data: {
      message: "Hello Vue!"
    }
  })
})

2) 创建并在我仅有的视图中清空<div id="vueapp"> {{ message }} </div>.

3) 已删除应用程序.来自应用程序/Java脚本的vue.

据我所知,这也应该起作用(这也是我们使用vue rails gem运行链轮的方式).现在的问题是:

[Vue warn]:在模板编译器不可用的情况下,您正在使用仅运行时版本的Vue.可以将模板预编译为渲染函数,也可以使用编译器附带的版本.

我无法确切地理解发生了什么或为什么失败,因为我的应用程序中没有任何组件或模板可编译.

推荐答案

vue NPM包的默认导出仅为运行时.

由于需要模板编译器,您需要将Vue导入更改为以下内容,其中包括运行时和模板编译器:

import Vue from 'vue/dist/vue.esm.js';

这里有https://vuejs.org/v2/guide/installation.html#Explanation-of-Different-Builds个细节

Vue.js相关问答推荐

将事件监听器绑定到动态元素

无法从CDN使用Vue和PrimeVue呈现DataTable

将 v-calendar 与以时间和日期格式出现的事件一起使用

在移动版本中使用标准的 v-data-table

如果在 VueJS/VuetifyJS 中切换switch,则调用函数

使用 Vue.js 清除数组内容和react性问题

拖入 vue2-google-map 后如何获取标记位置?

如何使用 vue.js 获取本地 html 文件?

在没有组件的vue js中拖放

查看 cli3 启用 CORS

使用 Vee-Validate 在提交时验证子输入组件

Vue更改宽度和内容

未捕获的类型错误:c.querySelectorAll 不是函数

从 vue.js 中的 store 获得的计算(computed)属性的设置器

如何从 vue-apollo 中访问 this.$route?

vue-router如何持久化导航栏?

VueJS 2 在多个组件上debounce

在 Vue JS 组件中使用 Laravel 路由的最佳方法是什么

在 vue.js 组件中react this.props.children

使用 vuejs 动态设置 id 标签