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ファイルが正確にボックス外とされている（ので、私はnpm run watch実行している

require('./bootstrap'); 

window.Vue = require('vue'); 

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

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

example.vueここに示す気にしないだろうし、それがいるようですアプリは、[OK]ファイルを構築しています。

ページがロードされるとコントローラとルートは、罰金ですが、

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

を次のように私はコンソールのエラーを取得しています私はクロームでのコンソールエラーをクリックすると

それは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

しかし、その行をブートストラップから削除しても問題ありませんでした（後で返すことにしました） – yoyoma

ok私はちょうど '{{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

答えて

関連する問題