fix: configure proxy before subscribing to error events

[zeorin]

Description

Currently, user proxy configuration is actioned after vite subscribes to proxy errors. This means that users cannot provide a custom response when there are proxy errors.

Vite doesn't return a body when responding when an error occurs.

I would like to be able to customize that

Currently, the below doesn't work, as my error handler subscribes after Vite's error handler:

export default defineConfig({
  plugins: [react(), tsconfigPaths()],
  server: {
    port: 3000,
    proxy: {
      '/api': {
        target: 'http://0.0.0.0:8000/',
        changeOrigin: true,
        configure: (proxy) => {
          proxy.on('error', (err, req, res, target) => {
            const hostname = req?.headers?.host;
            const requestHref = `${hostname}${req?.url}`;
            const targetHref = `${target?.href}`;
            if (!res.headersSent && !res.writableEnded) {
              res.writeHead(500, {
                'Content-Type': 'text/plain',
              });
              res.end(
                [
                  `Error occurred while proxying request ${requestHref} to ${targetHref} [${
                    err.code || err
                  }]`,
                  `(https://nodejs.org/api/errors.html#errors_common_system_errors).\n`,
                  `Are you sure you're running the API on ${targetHref}?`,
                  `Did you forget to start the Docker container?`,
                ].join(' ')
              );
            }
          });
        },
      },
    },
  },
  test: {
    globals: true,
    environment: 'jsdom',
    css: true,
  },
});

This PR changes when Vite subscribes to proxy errors so that users can handle the errors themselves if they wish.

What is the purpose of this pull request?

• Bug fix
• New Feature
• Documentation update
• Other

Before submitting the PR, please make sure you do the following

• Read the Contributing Guidelines.
• Read the Pull Request Guidelines and follow the PR Title Convention.
• Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
• Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).
• Ideally, include relevant tests that fail without this PR but pass with it.

[stackblitz]

Run & review this pull request in StackBlitz Codeflow.

[patak-dev]

Sounds good to me 👍🏼