npm install --save-dev babel-plugin-transform-object-rest-spread
add .babelrc in your project directory
{
"plugins": ["transform-object-rest-spread"]
}
参考：
Laravel5.4 と Vue2 のcomponentsの連携
環境：cloud9上にPHP7、laravel5.4をインストール。laravel内に設置したvueファイルの表示に関して。
＊vueファイル内にlaravelのdirectiveは混ぜられない(コンパイル時エラーが発生する)
vueで作成したファイル内にlaravelのmiddlewareやproviderを通したデータを挿入したい場合、例えば…
- 方法１
laravel側
Route::get('/user', function(){
return Auth::user();
})->middleware('auth');
vue側
const app = new Vue({
el: '#app',
store,
router: router,
created() {
axios.get('/user').then(response => {
console.log(response);
})
}
});
vueインスタンス生成時(created)にaxios経由でサーバーにリクエストを送り、laravel側で加工したデータを受け取る。
参考：
https://youtu.be/8aTfMHg3V1Q?list=PLXsbBbd36_uVjOFH_P25__XAyGsohXWlv&t=447
- 方法２
同一ページ内にlaravel blade templateで作成したcomponentがある場合、vueファイル上で$('hoge').text()などで直接jsで加工済みの値を取得する。
参考：
https://youtu.be/8aTfMHg3V1Q?list=PLXsbBbd36_uVjOFH_P25__XAyGsohXWlv&t=802
Laravel5.4 + laravel/socialite google oauth issue
googleAPIにリクエストを投げた後、適切にcallbackURLを設定しているのにも関わらず下記のエラーが発生した時
"ClientException in RequestException.php line 107: Client error: `GET https://www.googleapis.com/plus/v1/people/me?prettyPrint=false` resulted in a `403 Forbidden` response:
{"error":{"errors":[{"domain":"usageLimits","reason":"accessNotConfigured","message":"Access Not Configured. Google+ API (truncated...)"
googleAPIダッシュボードにてgoogle+apiを有効化する
参考：
Laravel5.4 + cloud9 php artisan migrate error
php artisan migrate
→
[Illuminate\Database\QueryException] SQLSTATE[42000]: Syntax error or access violation: 1071 Specified key was too long; max key length is 767 bytes (SQL: alter table `users` add unique `users_emai l_unique`(`email`))
MySQLのencodingがutf8mb4の場合は4バイトのため、255 * 4 = 1,020 バイトとなり、767バイトを超えてしまうためエラーが発生
カラムのlimitを191に制限 191 * 4 = 764バイトとなり制限以内に抑える
この設定変更前は php artisan migrate:rollback 等々のコマンドでもエラーが発生
設定前に php artisan migrate でエラーデータベースを作っていた場合は手動でデータベースを削除した後に設定をし直す
- Add the following to the app/Providers/AppServiceProvider boot method:
Schema::defaultStringLength(191);- Don't forget to include the following at the top of the file:
use Illuminate\Support\Facades\Schema;
参考：
