diff --git a/.env.example b/.env.example
index 9bb1bd7..1a33404 100644
--- a/.env.example
+++ b/.env.example
@@ -48,5 +48,5 @@ PUSHER_APP_KEY=
PUSHER_APP_SECRET=
PUSHER_APP_CLUSTER=mt1
-MIX_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
-MIX_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"
+VITE_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
+VITE_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"
diff --git a/.gitignore b/.gitignore
index 228147a..c59a02c 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,5 +1,6 @@
/node_modules
/public/hot
+/public/build
/public/storage
/storage/*.key
/vendor
diff --git a/composer.json b/composer.json
index d2d3b4f..61f45fe 100644
--- a/composer.json
+++ b/composer.json
@@ -2,7 +2,10 @@
"name": "laravel/laravel",
"type": "project",
"description": "The Laravel Framework.",
- "keywords": ["framework", "laravel"],
+ "keywords": [
+ "framework",
+ "laravel"
+ ],
"license": "MIT",
"require": {
"php": "^8.0.2",
@@ -10,7 +13,7 @@
"fruitcake/laravel-cors": "^2.0.5",
"guzzlehttp/guzzle": "^7.2",
"intervention/image": "^2.7",
- "laravel/framework": "^9.0",
+ "laravel/framework": "^9.19",
"laravel/sanctum": "^2.14",
"laravel/tinker": "^2.7",
"laravel/ui": "^3.4",
diff --git a/package.json b/package.json
index ce0db67..5cc974d 100644
--- a/package.json
+++ b/package.json
@@ -1,13 +1,8 @@
{
"private": true,
"scripts": {
- "dev": "npm run development",
- "development": "mix",
- "watch": "mix watch",
- "watch-poll": "mix watch -- --watch-options-poll=1000",
- "hot": "mix watch --hot",
- "prod": "npm run production",
- "production": "mix --production"
+ "dev": "vite",
+ "build": "vite build"
},
"devDependencies": {
"axios": "^0.21.4",
@@ -27,7 +22,6 @@
"jquery-datetimepicker": "^2.5.21",
"jquery-sparkline": "^2.4.0",
"jvectormap": "^2.0.4",
- "laravel-mix": "^6.0.31",
"load-google-maps-api": "^2.0.2",
"lodash": "^4.17.21",
"masonry-layout": "^4.2.2",
@@ -41,8 +35,11 @@
"select2": "^4.0.11",
"skycons": "^1.0.0",
"sweetalert2": "^11.1.5",
- "vue": "^2.6.14",
+ "vue": "^2.7.0",
"vue-loader": "^15.9.8",
- "vue-template-compiler": "^2.6.14"
+ "vue-template-compiler": "^2.6.14",
+ "vite": "^3.0.2",
+ "laravel-vite-plugin": "^0.6.0",
+ "@vitejs/plugin-vue2": "^1.1.2"
}
}
diff --git a/readme.md b/readme.md
index f6e1a1b..b14f0b4 100644
--- a/readme.md
+++ b/readme.md
@@ -31,7 +31,7 @@ php artisan migrate:fresh --seed # Run migration and seed users and categories f
yarn install # or npm i to Install node dependencies(>= node 9.x)
-npm run production # To compile assets for prod
+npm run build # To compile assets for prod
```
@@ -93,9 +93,9 @@ The current architecture of assets are inspired from [adminator](https://github.
If you want to update the CSS, you can put them directly in [`resources/sass/app.scss`](https://github.com/kossa/laradminator/blob/master/resources/sass/app.scss#L72) or create new file under `resources/sass` and import it in [resources/sass/app.scss](https://github.com/kossa/laradminator/blob/master/resources/sass/app.scss#L5)
-> VERY IMPORTANT: Any change you make on resources you have to run : `npm run dev` or `npm run prod`.
+> VERY IMPORTANT: Any change you make on resources you have to run : `npm run dev` or `npm run build`.
-> If you have a lot of changes it's much better to run: `npm run watch` to watch any changes on your files, take a look on [browersync](https://laravel.com/docs/master/mix#browsersync-reloading)
+> If you have a lot of changes it's much better to run: `npm run dev` to watch any changes on your files, take a look on [browersync](https://laravel.com/docs/master/mix#browsersync-reloading)
#### Create new CRUD
diff --git a/resources/js/app.js b/resources/js/app.js
index 042e322..62a2b82 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -1,5 +1,5 @@
-require('./bootstrap');
+import './bootstrap';
// import Vue from 'vue';
diff --git a/resources/js/bootstrap.js b/resources/js/bootstrap.js
index 762a3d1..5330b98 100644
--- a/resources/js/bootstrap.js
+++ b/resources/js/bootstrap.js
@@ -50,8 +50,8 @@
// window.Echo = new Echo({
// broadcaster: 'pusher',
-// key: process.env.MIX_PUSHER_APP_KEY,
-// cluster: process.env.MIX_PUSHER_APP_CLUSTER,
+// key: import.meta.env.VITE_PUSHER_APP_KEY,
+// cluster: import.meta.env.VITE_PUSHER_APP_CLUSTER,
// encrypted: true
// });
diff --git a/resources/views/admin/default.blade.php b/resources/views/admin/default.blade.php
index ee9d1a1..f714290 100644
--- a/resources/views/admin/default.blade.php
+++ b/resources/views/admin/default.blade.php
@@ -39,7 +39,7 @@
-
+ @vite('resources/js/app.js')
diff --git a/resources/views/layouts/partials/head.blade.php b/resources/views/layouts/partials/head.blade.php
index 075c227..6b8a959 100644
--- a/resources/views/layouts/partials/head.blade.php
+++ b/resources/views/layouts/partials/head.blade.php
@@ -8,8 +8,8 @@
{{ config('app.name', 'Laravel') }}
-
- {{-- --}}
+ @vite('resources/css/app.css')
+ {{-- @vite('resources/css/rtl.css') --}}
diff --git a/vite.config.js b/vite.config.js
new file mode 100644
index 0000000..0500310
--- /dev/null
+++ b/vite.config.js
@@ -0,0 +1,24 @@
+import { defineConfig } from 'vite';
+import laravel from 'laravel-vite-plugin';
+import vue from '@vitejs/plugin-vue2';
+
+export default defineConfig({
+ plugins: [
+ laravel({
+ input: [
+ 'resources/sass/app.scss',
+ 'resources/sass/rtl.scss',
+ 'resources/js/app.js',
+ ],
+ refresh: true,
+ }),
+ vue({
+ template: {
+ transformAssetUrls: {
+ base: null,
+ includeAbsolute: false,
+ },
+ },
+ }),
+ ],
+});
diff --git a/webpack.mix.js b/webpack.mix.js
deleted file mode 100644
index d7a9095..0000000
--- a/webpack.mix.js
+++ /dev/null
@@ -1,35 +0,0 @@
-const mix = require('laravel-mix');
-
-/*
- |--------------------------------------------------------------------------
- | Mix Asset Management
- |--------------------------------------------------------------------------
- |
- | Mix provides a clean, fluent API for defining some Webpack build steps
- | for your Laravel application. By default, we are compiling the Sass
- | file for the application as well as bundling up all the JS files.
- |
- */
-
-mix.webpackConfig(webpack => {
- return {
- plugins: [
- new webpack.ProvidePlugin({
- $: 'jquery',
- jQuery: 'jquery',
- 'window.jQuery': 'jquery',
- Popper: ['popper.js', 'default'],
- })
- ]
- };
-});
-
-
-mix.js('resources/js/app.js', 'public/js')
- .vue()
- .sass('resources/sass/app.scss', 'public/css')
- .sass('resources/sass/rtl.scss', 'public/css')
- .copyDirectory('resources/sass/static/images','public/images')
- .browserSync(process.env.APP_URL)
- .version()
- .sourceMaps();