- Save the content of public/css/custom.css in resources/assets/sass/_custom.scss
You have to change the file extension to .scss and add an underscore at the beginning. The underscore will be useful when importing in your main app.scss file.
-
Import your resources/assets/sass/_custom.scss file into your resources/assets/sass/app.scss this way :
/* importing _custome.scss from the same directory containing the following files resources/assets/sass/{app.scss, _custom.scss, _variables.scss} */ // import _custom.scss @import "custome"; // import _variables.scss (custom variables for bootstrap-sass) @import "variables"; // importing bootstrap-sass from node modules (if you are using bootstrap) @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap";
-
Include this in your webpack.mix.js file
mix.js('resources/assets/js/app.js', 'public/js') .sass('resources/assets/sass/app.scss', 'public/css');
-
Compile with
npm run dev