Can I change build directory path from public to anything else?

[IftekherSunny]

Hi,

I'm trying to change my build directory path depending on my environment variable. Is it possible???

I already tried --output-dir and --build-dir flag, but both aren't working.

Waiting for your response @KyleAMathews

[janosh]

gatsby build doesn't offer a way to change the build directory. There's a long running issue about this (#1878) and even an attempt to implement this feature (#4756) but it's been reverted due to problems.

@KyleAMathews indicated that it's unlikely this feature will be implemented in the future.

I'm closing this for now but feel free to reopen if you still have questions.

[TomFreudenberg]

Hi @IftekherSunny

you may use the onPostBuild event to rename or move the public folder to what you wan't or you may add a e.g. postbuild rule to your package.json to do the mv job.

[cseebach-tpc]

Here's a bit of code that I wrote to accomplish this recently, with the onPostBuild strategy, inside gatsby-node.js:

const path = require('path');
const fs = require('fs');

exports.onPostBuild = function() {
  fs.renameSync(path.join(__dirname, 'public'), path.join(__dirname, 'public-blog'));

  fs.mkdirSync(path.join(__dirname, 'public'));

  fs.renameSync(path.join(__dirname, 'public-blog'), path.join(__dirname, 'public', 'blog'));
};```

[abraaoz]

To change the folder from public to dist without losing the development public folder, add the following code in your gatsby-node.js:

const path = require("path")
const fs = require("fs")

exports.onPreInit = () => {
  if (process.argv[2] === "build") {
    fs.rmdirSync(path.join(__dirname, "dist"), { recursive: true })
    fs.renameSync(
      path.join(__dirname, "public"),
      path.join(__dirname, "public_dev")
    )
  }
}

exports.onPostBuild = () => {
  fs.renameSync(path.join(__dirname, "public"), path.join(__dirname, "dist"))
  fs.renameSync(
    path.join(__dirname, "public_dev"),
    path.join(__dirname, "public")
  )
}

[gitowiec]

Does behaviour posted by @abraaoz or @cseebach-tpc still uses "public" in the middle of the process? I mean, what if I want to gatsby develop and gatsby build in the same time? I need to compare why two builds (local and production) are different.

[TomFreudenberg]

Hi Marek @gitowiec

sometimes people - me enclosed - think about too complicated solutions ;-) - my 2 cents

First of all, yes - both posted from @abraaoz and @cseebach-tpc will use "/public" in the middle of their process and both are not designed to support a running npm run develop during an addtional npm run build

But, I guess this isn't necessary at all

Just use the tools and feel well :-)

You can use git to checkout your sources besides your dev folder and run consequent npm run build just inside that or do some "magic" folder linking for a second develop process folder.

Try this (suggest your project sources are at /homes/myproject/...)

cd /homes/myproject
mkdir ../myproject-dev
cd ../myproject-dev
find ../myproject -mindepth 1 -maxdepth 1 -exec bash -c 'BASENAME=$(basename "{}"); if [[ "$BASENAME" != ".git" && "$BASENAME" != ".cache" && "$BASENAME" != "public" ]]; then ln -s "{}" "$BASENAME"; fi' \;

After that procedure you have a linked dev enabled folder beneath your project. Just start the development server npm run develop in the myproject-dev folder.

Now you can continue coding and editing your sources in your origin myproject folder. Always when saving - the development process will automatically update as usual. You can test your dev by "http://localhost:8000" as usual.

In addition, you may run npm run build inside your myproject folder and get the build output.

With that you always have TWO working environments with ONE codebase:

• development: /homes/myproject-dev/public
• production: /homes/myproject/public

What do you think about that approach?

Cheers,
Tom

P.S.: If you want to run the build command inside the linked folder, you need to exclude static from linking and copy its content recursively because the build process can't work with the linked static. I recommened to just use as above with no issues.