https://github.com/ramsescupps/laravel-vue-cli-3
https://github.com/ramsescupps/laravel-vue-cli-3
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/ramsescupps/laravel-vue-cli-3
- Owner: ramsescupps
- Created: 2024-08-29T14:30:09.000Z (9 months ago)
- Default Branch: master
- Last Pushed: 2024-08-31T13:49:59.000Z (9 months ago)
- Last Synced: 2025-01-30T08:19:05.123Z (4 months ago)
- Language: PHP
- Size: 318 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Laravel + Vue CLI 3
This demo assumes you are serving this Laravel app via Valet at `laracon.test`. If you are serving the laravel app at a different local URL, modify it accordingly in `frontend/vue.config.js`.
### To Run the Frontend
``` sh
cd frontend
yarn # OR npm install
yarn serve # OR npm run serve
# build for production:
yarn build # OR npm run build
```
### Steps for Scaffolding From Scratch
1. Create Laravel Project
``` sh
laravel new my-project
cd my-project
# remove existing frontend scaffold
rm -rf package.json webpack.mix.js yarn.lock resources/assets
```
2. Create a Vue CLI 3 project in the Laravel app
``` sh
vue create frontend
# pick router
```
3. Configure Vue project
Create `frontend/vue.config.js`:
``` js
module.exports = {
// proxy API requests to Valet during development
devServer: {
proxy: 'http://laracon.test'
},
// output built static files to Laravel's public dir.
// note the "build" script in package.json needs to be modified as well.
outputDir: '../public',
// modify the location of the generated HTML file.
// make sure to do this only in production.
indexPath: process.env.NODE_ENV === 'production'
? '../resources/views/index.blade.php'
: 'index.html'
}
```
Edit `frontend/package.json`:
``` diff
"scripts": {
"serve": "vue-cli-service serve",
- "build": "vue-cli-service build",
+ "build": "rm -rf ../public/{js,css,img} && vue-cli-service build --no-clean",
"lint": "vue-cli-service lint"
},
```
4. Configure Laravel for single-page app.
**routes/web.php**
``` php
where('any', '.*');
```
**app/Http/Controllers/SpaController.php**
``` php