How to add node_modules in browser (using style and script view helpers)


#1

Hi, I would like to add styles and js installed via npm in my layout file.

But both

{{ style('style') }}

and

{{ script('app') }}

are relative to the ‘public’ folder.
Is there a way to include files in my root ‘node_modules’, or should I do this instead

<project-root>/public> npm i bootstrap

In Laravel, I can do this

<script src="{{ asset('node_modules/vue/dist/vue.js') }}"></script>

It’s a good way to keep both css and js files up to date.

PS: I’m not comparing Adonis js with Laravel. And we don’t use build tools.

Thanks in advance.


#2

Hey @jaybeemind, :wave:

You should do none of them.

It’s a very bad idea to link file from node_modules to your production application.
You should bundle them via a bundler or use a CDN.


#3

Hi, thanks for the response @romain.lanz.

Here is my use case.

This app will be used internally, within a controlled network (intranet). The server where the app will be deployed will not have internet connection (or anywhere outside the internal network).

What I’m trying to avoid is manually copying files to the ‘public’ folder every time. What I did as of the moment is have a separate package.json inside the ‘public’ folder. This handles all of my front-end needs, using npm.

Is there another way where I wouldn’t use some sort of bundler/builder, but be able to easily manage package updates? Updates will be done in the workstation, where internet connection is possible.

Not using a bundler/builder is kind of a preference, because not everyone in my team knows about it. It’s still not a standard for us in our team. They’re only familiar with the old way of doing things.