Next.js Discord

Discord Forum

How to use /public folder for Next.js 15

Answered
Nebelung posted this in #help-forum
Open in Discord
NebelungOP
I have been building next.js with app router, and there is an external library that I have to use with /public folder. It works in Next.js 13 as it preserves the public folders, but in 15, it is all compiled into _next/static. How do I get external libraries in this case?
Answered by B33fb0n3
if you don't use the files anywhere, they won't be downloaded (and like that they won't be visible). Make sure you loading them

Make sure you load them, for example thought a head tag like you mentioned.
View full answer

72 Replies

@Nebelung I have been building next.js with app router, and there is an external library that I have to use with /public folder. It works in Next.js 13 as it preserves the public folders, but in 15, it is all compiled into _next/static. How do I get external libraries in this case?
the usage of the public folder haven't changed in next15. You can still reach out to any file inside your public folder while adding it add the end of your server domain like:
https://example.vercel.app/yourfile.png
NebelungOP
but why don't I see public folder in sources
this is next.js 13
meanwhile this is next.js 15
should public folder be placed inside app/ directory?
NebelungOP
how do I use public folder in next.js 15?
@Nebelung should public folder be placed inside app/ directory?
it won't download all the files everytime from your public folder when you don't need them. It will only download the files that are needed on the page and then they will be placed into the page itself
NebelungOP
yeah that is what I did, but somehow next.js 13 shows the folder for library file in js
but next 15 does not
idk why
I did exactly what you just said
what kind of file do you want to show from your public folder? How do you load this file? Please share some code @Nebelung
NebelungOP
so I need to show js library from TradingView
here
the problem is this tradingview is only trying to make their library to stay in public folder
it is their skill issue that they cannot make it into compile js package on npm
but it is what it is
somehow next.js 13 works well when copying and pasting in the public folder
thanks for clarifying. You can do the same here: place all the files inside this folder (see attached)
NebelungOP
I hope it works like that, but I was not able to see the difference in next.js 15
NebelungOP
no there is difference between next.js 13
if you store a file in next.js 13 in public folder
@Nebelung this is next.js 13
NebelungOP
you see this
@Nebelung meanwhile this is next.js 15
NebelungOP
this is next.js 15
which is not working
next.js 15 sucks
I see no source
useless
what if I telling you, that I am using next15 and it looks like this for me? @Nebelung
NebelungOP
then it is useful
how do I do that
lol
this is what I did
I did what you told
it is still useless
not typescript, right?
if it is not typescript, then it is useless
@Nebelung I did the same that I said before (see attached). I placed it inside the folder
@Nebelung is this done in javascript?
serving files has mostly nothing to do with typescript or javascript
NebelungOP
hmm but I did the same
what would be the difference?
just to make sure: it's next15
NebelungOP
I made sure, but it still does not work
maybe this is because of js file, so I tried with different folder, but it does not work
you now placed it inside the public folder. How do you load the files?
NebelungOP
I don't do anything
do I have to use loader and add in next.config.js
?
NebelungOP
I don't understand
NebelungOP
I still don't understand
I even tried with newest create-next-app, but it only shows file that was in the public folder in the first place
I don't understand
@Nebelung I don't do anything
when they are just in the /public/... it will just be there. When no one loads them, then nothing happens 🤷‍♂️
NebelungOP
I don't understand, but that does not work like that
I even tried in the new project, it doesn't show
it does not show
Can you give me project file please
because there is no way
that public folder is working
NebelungOP
nvm I found out that I need to add head tag to clarify script in the public folder
@Nebelung I even tried in the new project, it doesn't show
if you don't use the files anywhere, they won't be downloaded (and like that they won't be visible). Make sure you loading them

Make sure you load them, for example thought a head tag like you mentioned.
Answer
NebelungOP
yeah I had to specify loading them with a specific head tag in layout
NebelungOP
ok yeah problem solved
but idk jpg file is not shown in public folder
i think jpg should be shown though
only svg files were shown in public without loader config
@Nebelung i think jpg should be shown though
when you are loading them on your page that you just visited (loaded) then it will be also visible at the other files