Where is the location for sweetalert2? - laravel

I am having a hard time installing the swwetalert2 package.
npm i sweetalert2 - its fine.
the package is inside node_modules.
inside my app.css i tried different variation of the #import
#import '/sweetalert2';
#import '~sweetalert2';
#import 'sweetalert2/dist';
but every time I run npm run dev or production I get this:
ERROR in ./resources/css/app.css
Module build failed (from ./node_modules/css-loader/index.js):
ModuleBuildError: Module build failed (from ./node_modules/postcss-loader/src/index.js):
Error: Failed to find 'sweetalert2'
no matter the variation I use for the location.

Related

Npm Run Dev Doesn't Work Properly Font awesome Laravel 8

This is the error i get after importing #fortawesome
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Can't find stylesheet to import.
╷
16 │ #import "~#fortawesome";
│ ^^^^^^^^^^^^^^^
╵
C:\xampp\htdocs\renazaandam\resources\sass\app.scss 16:9 root stylesheet
To install font-awesome you first should install it with npm. So in your project root directory type:
npm install font-awesome --save
Then edit the resources/assets/sass/app.scss file and add at the top this line:
#import "node_modules/font-awesome/scss/font-awesome.scss";
Now you can do for example:
npm run dev
This builds unminified versions of the resources in the correct folders. If you wanted to minify them, you would instead run:
npm run production
And then you can use the font.

How to install node package in Laravel Mix correctly?

I have clear Laravel 5.7 installation and I need to install izimodal package
So I have installed by npm install izimodal.
For the next step, I initialized this package in my /resources/js/bootstrap.js like:
import iziModal from 'izimodal/js/iziModal';
$.fn.iziModal = iziModal;
and run npm run dev to compile app.js
At this stage, the package was successfully imported and working but I missing CSS part of izimodal... How can I correctly initialize this package with CSS? I have tried this code in my webpack.mix.js but it does not work:
mix.copy('node_modules/izimodal/css/iziModal.css', 'resources/css');
mix.styles([
'resources/css/reset.css',
'resources/css/style.css'
], 'public/css/app.css');
Solved. Just added to my app.scss
// npm-package
#import "~izimodal/css/iziModal.css";
// Custom CSS
#import "../css/reset.css";
#import "../css/style.css";

How to import font-awesome to Laravel?

How to add font-awesome to laravel project.
I ran:
npm install font-awesome
But what is next, how to import it in my app.scss what is correct path?
I am trying :
#import "/node_modules/font-awesome/scss/font-awesome.scss";
But get and error:
ERROR in ./resources/assets/sass/app.scss
Module build failed: ModuleBuildError: Module build failed:
#import "/node_modules/font-awesome/scss/font-awesome.scss";
If you're pulling a file in from your node_modules directory you can use ~ followed by the path to the file inside node_modules:
#import '~font-awesome/scss/font-awesome';
If you have:
mix.options({
processCssUrls: false
});
Then you will need to copy the files in your webpack.mix.js file with something like:
mix.copy('./node_modules/font-awesome/fonts/**', 'public/fonts/font-awesome');
And then above the #import in your .scss file have:
$fa-font-path: '/fonts/font-awesome';

Laravel-Mix Font-awesome can't installed properly with npm

I have installed font-awesome with npm with following command :
npm install font-awesome --save
And then i have add following line in app.scss
#import "~font-awesome/scss/font-awesome";
Then i have run npm run watch
I have checked manually font-awesome folder is there inside the node_modules directory.
But in my webpage icon not displayed and in console i have seen following Error
GET
http://localhost/fonts/vendor/font-awesome/fontawesome-webfont.woff2?af7ae505a9eed503f8b8e6982036873e
net::ERR_ABORTED GET
How do i resolve the issue?
Since your are using Laravel, you need to write the following line in resources/asset/sass/_variables.scss:
$fa-font-path: "~font-awesome/fonts/";
Now in your resources/assets/sass/app.scss, write:
#import "~font-awesome/scss/font-awesome";

Laravel mix dependency was not found error

I'm using clean and latest Laravel 5.4.
I have an error on npm run dev
ERROR Failed to compile with 4 errors
This dependency was not found:
* -!../../../node_modules/css-loader/index.js?{"url":true,"sourceMap":false}!../assets/fonts/jquery.filer-icons/jquery-filer.css in ./~/css-loader?{"url":true,"sourceMap":false}!./~/postcss-loader?{"sourceMap":false}!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss
To install it, you can run: npm install --save -!../../../node_modules/css-loader/index.js?{"url":true,"sourceMap":false}!../assets/fonts/jquery.filer-icons/jquery-filer.css
app.scss:
#import "node_modules/jquery.filer/css/jquery.filer";
jquery.filer.css:
#import url('../assets/fonts/jquery.filer-icons/jquery-filer.css');
I tried to change this path but it doesn't works anyway

Resources