大学生/大学院生向け

在宅ワークのお仕事

プルグラミング学習の無料相談も可能良く

プログラミング学習の定額のサブスク

サイト/ブログ作成をコスパ良く

プロフィール

学ぶパンダ

初心者向けにプログラミング学習や

就職・転職に向けた情報を発信

Google Workspceで便利に作業

大学生/大学院生向け

在宅ワークのお仕事

プルグラミング学習の無料相談も可能良く

プログラミング学習の定額のサブスク

サイト/ブログ作成をコスパ良く

Laravel8とVue3の組み合わせの環境構築

LaravelとVueを使っていて、

システムを作っていく中で、

バージョンを新しく作成しようと考えた。

この時、

Laravel8 + Vue3

という構成で構築。

参考にしたサイト

以下のサイトを参考にして、

自分の環境でもうまくいきました。

実際の導入時の作業メモ

Laravelの導入

composer create-project laravel/laravel project

Vueの導入

npm install --save vue@next && npm install --save-dev vue-loader@next

各種パッケージのインストール

npm install

Laravelのコンパイル

npm run dev

表示確認

これで、

うまくバージョン8がインストールされており、

Vue.jsに関しても、

package.json

で確認すると、

    "dependencies": {
        "vue": "^3.2.31"
    }

となっているので、

うまくバージョン3がインストール完了。

App.vueで試す

ERROR in ./resources/js/App.vue 1:0
Module parse failed: Unexpected token (1:0)

のエラーになったので、

webpack.mix.js

のコードを変更

const mix = require('laravel-mix');

mix.js('resources/js/app.js', 'public/js').vue()
    .postCss('resources/css/app.css', 'public/css', [
        //
    ]);

上記は、

元々のコードに、

.vue()

を追記している

スキルを使って、就職/転職/副業する時のサイト

プログラミングのスキルなどを、自分なりに高めた上で、

自分のスキルをアピールして就職や転職を行い、年収をあげるか、

副業という形で、年収にプラスアルファの稼ぎを増やすことはできます。

まずはできる範囲で取り組むことで、

少しずつ、経験値も増え、自分のスキルが収入につながるのでおすすめです。

ピックアップ

おすすめ記事