我想显示一个带有h1文本的简单主页，但它不起作用。我配置了路由并将其添加到main.js. 当我浏览到localhost:8080什么都没有显示时。我看不出它不起作用的原因。主文件import Vue from 'vue'import App from './App'import router from './router'Vue.config.productionTip = falsenew Vue({ el: '#app', router, components: { App }, template: '<App/>'})应用程序<template> <div> <router-view/> </div></template><script>export default { name: 'App'}</script>主页.vue<template> <div> <h1>Home</h1> </div></template><script> export default { name: 'home' }</script>/路由器/index.jsimport Vue from 'vue'import Router from 'vue-router'import Home from '@/components/Home'Vue.use(Router)export default new Router({ mode: 'history', routes: [ { path: '/', name: 'Home', component: Home } ]})索引.html<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <link rel="icon" href="<%= BASE_URL %>favicon.ico"> <title>client</title> </head> <body> <noscript> <strong>We're sorry but client doesn't work properly without JavaScript enabled. Please enable it to continue.</strong> </noscript> <div id="app"></div> <!-- built files will be auto injected --> </body></html>
1 回答
幕布斯6054654
TA贡献1876条经验 获得超7个赞
@vue/cli默认情况下仅使用 vue 运行时，而不使用vue 编译器（如果要使用内联模板字符串，则需要编译器）
要解决此问题，您可以在以下文件中打开 runtimeCompilervue.config.js：
module.exports = {
"runtimeCompiler": true
};
或者更改您的代码以使用该render()函数：
new Vue({
el: '#app',
router,
components: { App },
template: '<App/>'
})
到
new Vue({
router,
render: h => h(App)
}).$mount("#app")
顺便说一句，如果您正在使用@vue/cli，则可以选择Manually select featuresduring vue create。
当您选择Router一个功能时，您将获得一个启动的项目，vue-router该项目将开箱即用。
添加回答
举报
0/150
提交
取消