Skip to content

Commit

Permalink
fix(@angular-devkit/build-angular): remove unactionable error overlay…
Browse files Browse the repository at this point in the history
… suggestion from Vite-based dev server

The Vite-based development server that is used with the esbuild-based builders (`application`/`browser-esbuild`)
will show an error overlay when the application build encounters an error. This overlay previously provided a
suggestion to edit the `vite.config.js` configuration file to disable the error overlay. Since Vite usage is
encapsulated within the Angular CLI, this suggestion is unactionable and may lead to user confusion due to
no Vite configuration file being present within the project nor would creating one have an effect on the build
process.

(cherry picked from commit 2f1b650)
  • Loading branch information
clydin authored and alan-agius4 committed Oct 30, 2023
1 parent f5f9687 commit c27ad71
Showing 1 changed file with 26 additions and 0 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -443,6 +443,10 @@ export async function setupServer(
const relativeFile = normalizePath(path.relative(virtualProjectRoot, file));
const codeContents = outputFiles.get(relativeFile)?.contents;
if (codeContents === undefined) {
if (relativeFile.endsWith('/node_modules/vite/dist/client/client.mjs')) {
return loadViteClientCode(file);
}

return;
}

Expand Down Expand Up @@ -683,6 +687,28 @@ export async function setupServer(
return configuration;
}

/**
* Reads the resolved Vite client code from disk and updates the content to remove
* an unactionable suggestion to update the Vite configuration file to disable the
* error overlay. The Vite configuration file is not present when used in the Angular
* CLI.
* @param file The absolute path to the Vite client code.
* @returns
*/
async function loadViteClientCode(file: string) {
const originalContents = await readFile(file, 'utf-8');
let contents = originalContents.replace('You can also disable this overlay by setting', '');
contents = contents.replace(
// eslint-disable-next-line max-len
'<code part="config-option-name">server.hmr.overlay</code> to <code part="config-option-value">false</code> in <code part="config-file-name">vite.config.js.</code>',
'',
);

assert(originalContents !== contents, 'Failed to update Vite client error overlay text.');

return contents;
}

function pathnameWithoutServePath(url: string, serverOptions: NormalizedDevServerOptions): string {
const parsedUrl = new URL(url, 'http://localhost');
let pathname = decodeURIComponent(parsedUrl.pathname);
Expand Down

0 comments on commit c27ad71

Please sign in to comment.