Posts Learn Components Snippets Categories Tags About

How to Copy Styling and Scripts from node_modules in Laravel

Learn the right way to copy styling and scripts from node_modules in Laravel project using Laravel Mix

Created on Aug 31, 2021


When developing a Laravel project, sometimes you might need to copy the styling and scripts of an external library which is located inside the "node_modules". This is necessary in order to use the styling or scripts which by default can't be referenced when inside the node_modules.

Copy node_modules Style and Scripts using Laravel Mix

To copy the styles and scripts, you need to use Laravel Mix. A little bit of what Laravel Mix is:
Laravel Mix, a package developed by Laracasts creator Jeffrey Way, provides a fluent API for defining webpack build steps for your Laravel application using several common CSS and JavaScript pre-processors.
For this example let's imagine you want to copy Highlight.js styles from the "node_module" directory into your public directory. To do so you can write your code like below.
# webpack.mix.js
mix.copy('node_modules/highlight.js/styles/base16/apathy.css', 'public/css');
Once you have already define like so you can run the watch/dev/production command to copy the style/scripts.
npm run prod
If you are using yarn.
yarn prod

Snippets by

PostSrc poster


Full stack developer mainly focusing on the front end side of the web. The main author of PostSrc and loves writing tutorial and guides online.


PostSrc Code Components

Collection of Tailwind CSS components for everyone to use. Browse all of the components that's right for your project.

View Components

Other Code Snippets