vue 报错 You are using the runtime-only build of Vue where the template compiler is not available.

问题描述

学习vue-router官方教程，'起步’章节，<router-view>无效果，控制台报warn:

You are using the runtime-only build of Vue where the template compiler is not available.Either pre-compiler the templates into render functions, or use the compiler-included build.

项目大体情况

• 环境如下：

  • webpack版本：4.40.2
  • vue-cli版本：3.11.0

• 使用vue-cli vue create xxx命令创建vue项目，采取默认配置

• 使用npm install vue-router安装vue-router

• 主要代码如下：

import Vue from 'vue'
import App from './App.vue'

// 0. 导入vue-router
import VueRouter from 'vue-router'
Vue.use(VueRouter)

Vue.config.productionTip = false

// 1. 定义路由组件
const Foo = {template:'<div>Foo</div>'}
const Bar = {template:'<div>Bar</div>'}
const User = {template:'<div>user {
  
  { $route.params.id }}