Razzle: Override paths.js values in razzle.config.js

Created on 28 Jul 2018 · 12Comments · Source: jaredpalmer/razzle

I would like to move my server dir into the root so my filesystem would look like this.

-/src
-server
-...etc.

Digging in razzle, it seems that babel and webpack are getting location of code from

module.exports = {
  dotenv: resolveApp('.env'),
  appPath: resolveApp('.'),
  appBuild: resolveApp('build'),
  appBuildPublic: resolveApp('build/public'),
  appManifest: resolveApp('build/assets.json'),
  appPublic: resolveApp('public'),
  appNodeModules: resolveApp('node_modules'),
  appSrc: resolveApp('src'),
  appPackageJson: resolveApp('package.json'),
  appServerIndexJs: resolveApp('src'),
  appClientIndexJs: resolveApp('src/client'),
  testsSetup: resolveApp('src/setupTests.js'),
  appBabelRc: resolveApp('.babelrc'),
  appEslintRc: resolveApp('.eslintrc'),
  appRazzleConfig: resolveApp('razzle.config.js'),
  nodePaths: nodePaths,
  ownPath: resolveOwn('.'),
  ownNodeModules: resolveOwn('node_modules'),
  publicUrl: getPublicUrl(resolveApp('package.json')),
  servedPath: getServedPath(resolveApp('package.json')),
};

The only issue is, because the values are hard coded, I can't override them.

I've come up with a work around by copypasting the resolveApp function from razzle to razle.config.js

const appDirectory = fs.realpathSync(process.cwd());
const resolveApp = relativePath => path.resolve(appDirectory, relativePath);

and looping through rules and depending on environment and configuration I replace the include property with my custom path, like so...

      appConfig.module.rules.map(rule => {
        if (rule.include && rule.test) {
          rule.include = [
            resolveApp('server'),
            resolveApp('src'),
          ];
        }
      })

This feels really hacky though. Would it be possible to abstract the hard coded values in paths.js to environment variables or expose them in the createConfig function so that I can change the paths whenever I want?

I'd be happy to work on this if it seems like a good idea, but maybe there's a solution for this already that I'm missing. Please help :)

enhancement

Source

KevinMind

👍16

Most helpful comment

On my radar, have sort of a plan 😀

fivethreeo on 10 May 2020

🎉6 👍6

All 12 comments

Hola! So here's the deal, between open source and my day job and life and what not, I have a lot to manage, so I use a GitHub bot to automate a few things here and there. This particular GitHub bot is going to mark this as stale because it has not had recent activity for a while. It will be closed if no further activity occurs in a few days. Do not take this personally--seriously--this is a completely automated action. If this is a mistake, just make a comment, DM me, send a carrier pidgeon, or a smoke signal.

stale[bot] on 26 Sep 2018

Well. I moved my server to new server folder inside src
And then in razzle.config.js edit config for the server

config.entry.pop()
config.entry.push('./src/server')

It works fine but seems like after this debugging (--inspect) nodejs is broken

olehreznichenko on 27 Sep 2018

stale[bot] on 26 Nov 2018

ProBot automatically closed this due to inactivity. Holler if this is a mistake, and we'll re-open it.

stale[bot] on 3 Dec 2018

This issue shouldn't have been closed.

brianjd on 30 Jan 2019

👍1

I'm also using workarounds to set different application directory, it's a pretty large project that hosts API code in the same root directory, and 'src' is really ambiguous.

nvma on 5 Jun 2019

@nvma Can you please provide an example to set different application directory? Thanks!

antoniomaia on 21 Oct 2019

I think this is a pretty important issue. I'd be willing to submit a PR ASAP if we can come up with a list of the _core_ directories that should be configurable. Off the bat, I'd say: build, src for client, src for server, and public.

mikestopcontinues on 2 Apr 2020

I was able to resolve it in my razzle / webpack configuration.

brianjd on 3 Apr 2020

On my radar, have sort of a plan 😀

fivethreeo on 10 May 2020

🎉6 👍6

In case it's useful to someone else I recently had to do this in razzle.config.js and it seems to work

const defaultOptions = {
  server: null,
  client: null,
};

function modifyEntryPoints(baseConfig, env, webpack, userOptions = {}) {
  const options = { ...defaultOptions, ...userOptions };
  const webpackConfig = { ...baseConfig };

  const { client, server } = options;
  /* This is required to rename the entry points instead of using the defaults */
  if (env.target === "node" && server) {
    webpackConfig.entry = [server];
  }
  if (env.target !== "node" && client) {
    webpackConfig.entry.client = client;
  }

  return webpackConfig;
}


module.exports = {
  plugins: [
    {
      func: modifyEntryPoints,
      options: {
        server: path.join(__dirname, "./src/docker-server"),
        client: path.join(__dirname, "./src/docker-client"),
      },
    },
  ]
};