laravel out of box vuejs example not working

我只是试图用laravel学习vuejs，无法获得示例组件的工作。laravel out of box vuejs example not working

我已经创建了一个新的路线来简单地为现在的vue示例服务。

create.blade.php 

<!DOCTYPE html> 
<html> 
<head> 
<title>VUE</title> 
</head> 

<body> 

<h1>example</h1> 

<div id="app"> 

<example></example> 

</div> 

<script src="/js/app.js"></script> 
</body> 
</html>

的app.js和example.vue文件是完全一样的开箱（所以我不会打扰显示example.vue这里

require('./bootstrap'); 

window.Vue = require('vue'); 

Vue.component('example', require('./components/Example.vue')); 

const app = new Vue({ 
    el: '#app' 
});

我有npm run watch运行，它似乎已经构建了应用程序文件确定。

控制器和路线也好，页面加载，但我得到的控制台错误如下

app.js:1697 Uncaught TypeError: Cannot read property 'csrfToken' of 
undefined 
at Object.<anonymous> (app.js:1697) 
at __webpack_require__ (app.js:20) 
at Object.<anonymous> (app.js:778) 
at __webpack_require__ (app.js:20) 
at Object.<anonymous> (app.js:41430) 
at __webpack_require__ (app.js:20) 
at app.js:66 
at app.js:69

当我点击Chrome浏览器的控制台错误它指向app.js行：

window.axios.defaults.headers.common['X-CSRF-TOKEN'] = 
window.Laravel.csrfToken;

是否抱怨csrftoken，因为我用它作为一个刀片模板？我如何才能在laravel里面工作，这样我就可以玩和学习vuejs？

来源

2017-06-17 yoyoma

它所抱怨的代码位于resources/assets/js/bootstrap.js源代码中，您将看到该代码在app.js文件的顶部被引用。在您的刀片文件中，在包含您的app.js之前，您可以设置csrf标记值。

<script> 
    window.Laravel.csrfToken = {{ csrf_token() }}; 
</script> 
<script src="/js/app.js"></script>

，或者，如果你想要做的是与示例发挥-是，你可能刚刚从bootstrap.js删除该行的代码。但是当你开始更多地使用VueJS时，你可能会需要它。

来源

2017-06-17 08:34:13 dispake

嗯感谢，但现在给错误'创建：18未捕获的ReferenceError：gEUrhuyDkZkWtPxbnFRY2j4ZOdxWfcccN8sGjTk2没有在规定的创建：18' – yoyoma

从bootstrap中删除该行，但是没有工作（想稍后再回来） – yoyoma

好吧我只需要'{{csrf_field（）}}'没有脚本标记，谢谢标记为正确:) – yoyoma

我觉得这是更好地修改您的bootstrap.js与以下文件（Axios公司进口后）：

window.axios.defaults.headers.common = { 
    'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content'), 
    'X-Requested-With': 'XMLHttpRequest' 
};

来源

2018-03-05 16:57:05 omarjebari

laravel out of box vuejs example not working

回答

相关问题