ng build - Add option to save bundled js files in different directory and index in different directory

[naveedahmed1]

Here is a feature request.

When we build a project using ng build command, it creates a folder dist and place all bundles and index file in it. I know that we can specify the outdir in angular-cli.json and cli will generate all bundles and index.html file in the specified folder.

What if there is a need to put the bundled js files in a separate directory and index file in separate directory e.g

bundled js in
/dist/js/ folder

and index file in
/dist/ folder

I tried, copying the generated js bundles to the dist/js folder and updated the paths in index file but it didn't work and console shows 404 error for bundles.

It would be good to add an option to specify path for the bundled js files and index file.

[filipesilva]

Dupe of #2276

[anilarya]

Its not duplicate of #2276 , but valid question. I also need to separate built index.html and all js files in separate folder.

[yasarkunduz]

The --deploy-url flag (that does what --public-path does for webpack) has been around for a while: https://github.com/angular/angular-cli/wiki/build

[yaniv1988]

+1 Any update on this ? I am facing a similar issue.

[ryanlangton]

There is still no solution to this that I've found.. why is this closed?
--deploy-url and --base-href correctly set values in index.html.
Neither of these address the problem of wanting to put index.html in one folder and all the bundled .js files in another. What is the solution?

[BenjaminDiscoVergy]

@filipesilva if you're looking for a duplicate of this, then try this one:
#2951

I'm not sure if the duplicate you've assigned is an actual duplicate. It seems different.

On this ticket:
I am disappointed in the fact that Angular-CLI is taking away useful options that webpack had already provided. (Especially given the fact that Vue-CLI provides just that kind of functionality)

We here at the company are migrating away from some old structures but we cannot move all at once.

So for the next year or 2 we will be having a scenario that requires the index-file to sit in a folder location that is not a child of the dist-folder but more like the great-uncles neighbors friend-who-he-met-at-a-bars sibling nth-removeds dogs hairstylist.

So: "(How) can i make index end up in that separate folder?"
is a vital question for our efforts to ditch the old crap in favor of angular.

I find it hard to imagine we are the only company that made a too-quick choice of how to deliver frontends. Migrating from these mistakes to Angular will usually be a stepwise process.
Being able to support this process should be rather beneficial to Angular and Webdevelopment in general.

[fmflame]

@filipesilva This is exactly what I am trying to do:
"
What if there is a need to put the bundled js files in a separate directory and index file in separate directory e.g"

bundled js in
/dist/js/ folder

and index file in
/dist/ folder
"

Currently I only found out that I can use ng build --deploy-url "js/" to update the location of the js files in the index.html, but the .js files are still being output in the dist folder when I want them to be output in the dist/js/ folder.

I want to do this since I was explained that our current server setup has some request limits for prefixes. Prefixes = folders. So if I keep many files in one folder. That limit is hit very fast. So I want to move the .js files in our project in another folder.

2 years later I find I still have to do it with a build script...? I could not find an option in angular.json to change the .js bundles output location. Did I miss something? Or what is the progress with this?

Thank you.

[fedotxxl]

Why is this ticket closed?! This is a major bug which forces us to use js files in root directory which is not possible in some cases. I can't even imagine that it's not implemented.

--deploy-url is not the solution because dev environment should be equal to prod

[zakjakub]

Some hack available? I need to have index.html in other folder too and can't get in to working state. :/

[anupsahu02]

+1 for this

[stephdz]

+1 we need this feature !

[softdays]

+1 please @filipesilva reopen this issue. We can achieve this goal using native Webpack, so please remove this limit from angular-cli

[brian-duffy]

+1 for this please!!!!!!!