Laravel: Which npm packages should be in "dependencies" vs "devDependencies"?
All of those are devDependencies
if you are using elixir
:
Firstly, you don't need elixir
in production because it's just a wrapper for gulp
, hopefully, you will compile your assets on your development machine and upload them.
All other npm javascript libraries can be compiled with elixir
, so there is no need to have them on the production machine. By default elixir
uses webpack
to compile resources\assets\js\app.js
into public\js\app.js
which you need to include in your webpages as a script
.
If you take a look at: resources\assets\js\bootstrap.js
you will see the packages that laravel
adds by default (things like vue
, bootstrap
and jQuery
), so if, for example you want to add dropzone
to your project you simply add it to bootstrap.js
like so:
require('dropzone');
Which would now compile dropzone
to public\js\app.js
making dropzone
a devDependency
also.
Also, in newer versions of Laravel that use Laravel Mix (which is a wrapper around Webpack) all your dependencies can be under devDependencies
.
Webpack compiles everything down to a single file (/js/app.js
), or multiple files, if for example, you use the extract
method to build your files (/js/app.js
, /js/app.js
, /js/manifest.js
). And those are the only files your browser needs to execute your JavaScript code; and for Webpack to build them it's enough to find all the dependencies under devDependencies
.