Category Archive Laravel

Vuejs.org เป็นตัวเลือกหนึ่งที่ laravel ได้เตรียมเอาไว้ ให้ใน Using Vue / React หรือจะติดตั้งเอง ในภายหลังก็ได้ เพราะว่า ผมมีบางหน้าที่ใช้ JQuery อยู่คู่ไปด้วย

1. ติดตั้งโดย command
   npm install vue@next
   แต่ใน mac os จะขึ้น error
   (node:24748) ExperimentalWarning: CommonJS module
   แก้โดยใช้
   npm install vue
2. ติดตั้ง @vitejs/plugin-vue โดย command
   npm install -D @vitejs/plugin-vue
3. เปิดไฟล์ SourceCode/vite.config.js
4. แก้ไขตามรูปแบบ
   ?

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

   import { defineConfig } from 'vite'; import laravel from 'laravel-vite-plugin'; import vue from '@vitejs/plugin-vue';   export default defineConfig({     plugins: [         laravel({             input: [                 'resources/css/app.css',                 'resources/js/app.ts'             ],             refresh: true,         }),         vue({             template: {                 transformAssetUrls: {                     base: null,                     includeAbsolute: false,                 },             },         }),     ], });

5. เปลี่ยนเป็น TypeScript โดย command
   npm update vue-tsc
6. ติดตั้ง Laravel Breeze (หากยังไม่ได้ติดตั้ง)
   composer require laravel/breeze --dev
7. ติดตั้ง Breeze พร้อม Vue.js
php artisan breeze:install vue
8. ติดตั้ง dependencies
npm install
9. Compile assets
npm run dev
10. เปิด resources/js/Components จะเห็น Components สำเร็จรูป เช่น Dropdown.vue