Home
Support Forums

How to reach _redirect placed in a sub folder?

I am deploying an i18n angular app with --localize, which creates 3 subfolders (separate version for each language) and place the _redirect file inside these folders. Now when i am accessing the site https://bbinvestors.netlify.app it returns a 404 not found but works “fine” when access through “/en” but still doesn’t load the assets. Can anybody help me with;

  1. Find the right redirect configuration which derivates the site to the browser language’s version or default language version.
  2. How to access the _redirect or how to place it outside the subfolders when i’m deploying it with CI.
    Thanks a lot.

Hi @pikuman83

As per the docs

Save a plain text file called _redirects without a file extension to the publish directory of your site.

You cannot have a _redirects file in a sub-directory.

There are language redirects available. If you had (for example) English, Russian and Chinese language sites (yeah, strange mix I know) you would have

/  /zh  302  Language=zh  # Chinese
/  /ru  302  Language=ru  # Russian
/  /en  302  Language=en  # English

which would redirect from the root of the site to language-specific pages. How well Angular plays with this setup I cannot say as I have not used it. There are possibly other steps required with Angular Routing also.

Thank you very much. Unfortunately there’s an open issue for angular to let copy files outside the root directory and as my sites are deployed in subfolders, there’s no way i can paste the _redirects in the parent folder through the build configuration. Can you suggest any solution please. The language redirects looks great.

Hi @pikuman83,

You can simply use netlify.toml as that would be in the root of the repo (or base directory).

Thanks hrishikesh,
I’ve copied a netlify.toml file in the root folder of my repo with the following content;
[[redirects]]
from = “/*”
to = “/en/home”
status = 302
conditions = {Language = [“en”]}

and it has not worked. Can you kindly have a look on the configurations of https://bbinvestors.netlify.app.
Thanks once again for the so needed help.

It would appear you don’t have an index.html in root which results in a page not found when your redirect does not work.

I can see the English page (by manually typing /en in the address bar) however if the page /en/home is refreshed it again results in a 404 page not found.

Note also that images are showing on the page. All the src paths are ../../../../assets/ is not an accessible directory in the browser.

You redirect syntax is correct though.

I really appreciate your help Coelmay. The index.html files are placed each inside its language folder. How can this issue be solved? is there a way to only copy the _redirect or netlify.toml in root?
On the other hand unfortunately I didn’t understand this sentence " Note also that images are showing on the page. All the src paths are ../../../../assets/ is not an accessible directory in the browser." from your reply, I have other site which is working fine with the same relative path declarations but in this case as the site being in a subfolder when i access it with “/en” it finds all the files with the correct base href “/en/” but for assets it is searching in using the base href. Can you kindly confirm it is not a netlify configuration issue?
Thanks once again.

All you assets are in the /assets directory relative to the site root (e.g. https://bbinvestors.netlify.app/assets/img109.jpg) so rather than referencing all your images, et.al with ../../assets change the links to /assets.

If you have language-specific homepage images, then you could add then inside the /assets directory e.g

/assets/en/
/assets/fr/
/assets/es/

Note: Chrome automatically removes the ../../../../ from the source paths and loads the images from the /assets directory on the homepage.

Thank you so much Coelmay :slight_smile:
The assets issue has been solved as per your advice. Do you have any suggestion regarding how to make netlify read the _redirects from the deployed language folders?
Or is it possible to place the _redirect file manually in the root folder (In this case, the root folder will contain 3 folders (one for each language version) and the _redirect file only).

It won’t. As per the Redirects and Rewrites docs (previously linked)

Save a plain text file called _redirects without a file extension to the publish directory of your site.

You will need to put all your redirects into one _redirects file in your publish (root) directory or as @hrishikesh use a netlify.toml for your redirects (syntax here)

Thanks Coelmay, the above povided information was already discussed and clear to me. My question was more targeted towards any alternative suggestion to solve the issue.
Any how, I’ve implemented a postbuild to my project which copies the _redirects file from “dist/myProject/en” to dist/myProject/, and is working fine on my local system but has failed when built on netlify deploy with error; xcopy : not known.
The following postbuild copy command is working fine in my system:

"postbuild":"xcopy /s \".\/dist\\bbInvestors\\es\\_redirects\" \".\/dist\\bbInvestors\" \/Y"

the post build runs automattically after the build with the following resut;

 bb-investors@0.0.0 postbuild
> xcopy /s "./dist\bbInvestors\es\_redirects" "./dist\bbInvestors" /Y

./dist\bbInvestors\es\_redirects
1 File(s) copied

if xcopy is not supported, is there any other package we can use to achieve the same?
Thanks

Not sure why you are using xcopy. cp is standard copy command. I assume you have a directory structure something like this with multiple languages directories (and files) inside the root (project/publish) directory

.
├── en
│   └── index.html
├── es
│   └── index.html
└── fr
    └── index.html

So rather than having three _redirects files (one in each directory) you would have one in your root (project/publish) directory from the outset, negating the need to us cp (or xcopy).

.
├── _redirects
├── en
│   └── index.html
├── es
│   └── index.html
└── fr
    └── index.html

Continuing the discussion from How to reach _redirect placed in a sub folder?:

I have in mind the file structure… but as the project is being deployed with the build command, it doesn’t allow me to place the _redirects files outside the root folder of each language [“en”, “es”, “en-Us”] so either I copy it manually to the parent folder (and as long as I know I do not have access to the file and folders in netlify to be able to do it) or copy it through post build (with which I am struggling and have not found any other solution/information than creating a post build script in my package.json file using xcopy). I imagine it should not be that complicated as it should be a very common case, but unfortunately I am not getting it right and will appreciate any help.
Thanks once again for your time.

Issue resolved by creating a postbuild script in package.json which copies the _redirect file from the subdirectory to the root directory

Linux syntax (for netlify build):
"postbuild": "cp /opt/build/repo/src/_redirects dist/myproject/"
Windows based servers syntax:
"postbuild": "copy \".\/dist\\bbInvestors\\es\\_redirects\" \".\/dist\\bbInvestors\""
1 Like