ctf0 / Laravel-Media-Manager

A "Vuejs & Laravel" Media Manager With Tons of Features
MIT License
829 stars 179 forks source link

[Question] Compatibility with Laravel 8 and Jetstream #167

Closed rajeshdalsaniya closed 3 years ago

rajeshdalsaniya commented 3 years ago

I am trying to use laravel media manager with Laravel Jetstream, livewire but I am getting following error when i run npm run watch command. Kindly guide me to fix it. Thanks!

ERROR in ./resources/assets/vendor/MediaManager/sass/modules/image-editor.scss?vue&type=style&index=0&lang=scss& (./node_modules/css-loader!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src??ref--8-2!./node_modules/sass-loader/dist/cjs.js??ref--8-3!./resources/assets/vendor/MediaManager/sass/modules/image-editor.scss?vue&type=style&index=0&lang=scss&)
Module build failed (from ./node_modules/postcss-loader/src/index.js):
Error: Failed to find '~cropperjs/dist/cropper.css'
  in [
    /Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/sass/modules
  ]
    at /Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/node_modules/postcss-import/lib/resolve-id.js:35:13
 @ ./resources/assets/vendor/MediaManager/sass/modules/image-editor.scss?vue&type=style&index=0&lang=scss& (./node_modules/style-loader!./node_modules/css-loader!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src??ref--8-2!./node_modules/sass-loader/dist/cjs.js??ref--8-3!./resources/assets/vendor/MediaManager/sass/modules/image-editor.scss?vue&type=style&index=0&lang=scss&) 2:14-338
 @ ./resources/assets/vendor/MediaManager/sass/modules/image-editor.scss?vue&type=style&index=0&lang=scss&
 @ ./resources/assets/vendor/MediaManager/js/components/image/editor/main.vue
 @ ./node_modules/babel-loader/lib??ref--4-0!./node_modules/vue-loader/lib??vue-loader-options!./resources/assets/vendor/MediaManager/js/components/manager.vue?vue&type=script&lang=js&
 @ ./resources/assets/vendor/MediaManager/js/components/manager.vue?vue&type=script&lang=js&
 @ ./resources/assets/vendor/MediaManager/js/components/manager.vue
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/arrows' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 52:0-34
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/arrows-h' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 57:0-36
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/arrows-v' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 58:0-36
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/clock-o' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 40:0-35
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/cloud-upload' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 44:0-40
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/diamond' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 72:0-35
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/dot-circle-o' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 70:0-40
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/eyedropper' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 67:0-38
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/file-archive-o' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 41:0-42
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/file-pdf-o' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 22:0-38
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/file-text-o' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 24:0-39
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/flash' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 65:0-33
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/folder-open-o' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 5:0-41
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/glass' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 73:0-33
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/lemon-o' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 68:0-35
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/map-o' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 3:0-33
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/refresh' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 6:0-35
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/rotate-left' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 55:0-39
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/rotate-right' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 56:0-40
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/scissors' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 71:0-36
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/shield' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 75:0-34
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/sun-o' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 63:0-33
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/modules/icons.js
Module not found: Error: Can't resolve 'vue-awesome/icons/warning' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js/modules'
 @ ./resources/assets/vendor/MediaManager/js/modules/icons.js 26:0-35
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css

ERROR in ./resources/assets/vendor/MediaManager/js/manager.js
Module not found: Error: Can't resolve 'vue-clipboard2' in '/Volumes/Data/IDEProjects/PhpstormProjects/cloudFileManager/resources/assets/vendor/MediaManager/js'
 @ ./resources/assets/vendor/MediaManager/js/manager.js 3:0-42 5:8-20
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/assets/vendor/MediaManager/sass/manager.scss ./resources/css/app.css
rajeshdalsaniya commented 3 years ago
ERROR in ./resources/assets/vendor/MediaManager/sass/modules/image-editor.scss?vue&type=style&index=0&lang=scss& (./node_modules/css-loader!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src??ref--7-2!./node_modules/sass-loader/dist/cjs.js??ref--7-3!./resources/assets/vendor/MediaManager/sass/modules/image-editor.scss?vue&type=style&index=0&lang=scss&)
Module build failed (from ./node_modules/postcss-loader/src/index.js):
Error: Failed to find '~cropperjs/dist/cropper.css'
  in [
    /Volumes/Data/IDEProjects/PhpstormProjects/filemanager/resources/assets/vendor/MediaManager/sass/modules
  ]
    at /Volumes/Data/IDEProjects/PhpstormProjects/filemanager/node_modules/postcss-import/lib/resolve-id.js:35:13
 @ ./resources/assets/vendor/MediaManager/sass/modules/image-editor.scss?vue&type=style&index=0&lang=scss& (./node_modules/style-loader!./node_modules/css-loader!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src??ref--7-2!./node_modules/sass-loader/dist/cjs.js??ref--7-3!./resources/assets/vendor/MediaManager/sass/modules/image-editor.scss?vue&type=style&index=0&lang=scss&) 2:14-338
 @ ./resources/assets/vendor/MediaManager/sass/modules/image-editor.scss?vue&type=style&index=0&lang=scss&
 @ ./resources/assets/vendor/MediaManager/js/components/image/editor/main.vue
 @ ./node_modules/babel-loader/lib??ref--4-0!./node_modules/vue-loader/lib??vue-loader-options!./resources/assets/vendor/MediaManager/js/components/manager.vue?vue&type=script&lang=js&
 @ ./resources/assets/vendor/MediaManager/js/components/manager.vue?vue&type=script&lang=js&
 @ ./resources/assets/vendor/MediaManager/js/components/manager.vue
 @ ./resources/assets/vendor/MediaManager/js/manager.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/css/app.css
ctf0 commented 3 years ago

the tickets are not for how to setup the package, u can try the demo repo and test with it & if u have a specific issue then create a ticket for it, thanx.