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

回答

相關問題