Angular vite optimisation

Question

404 (Not Found) error

The file does not exist at path>/.angular/cache/18.1.4/vite/deps/browser-VFYTEBP2.js?v=ef5c984d" which is in the optimize deps directory. The dependency might be incompatible with the dep optimizer. Try adding it to optimizeDeps.exclude.

When I debug, I find the below in Vite Documentation

https://vitejs.dev/config/dep-optimization-options.html#optimizedeps-exclude

   export default defineConfig({
    optimizeDeps: {
      include: ['esm-dep > cjs-dep'],
    },
   })

where should I add this in angular project to take effect

package.json

"ng": "ng",
"start": "ng serve",
"build": "ng build",
"watch": "ng build --watch --configuration development",
"test": "ng test"



"@angular/animations": "^18.1.4",
"@angular/cdk": "^18.1.4",
"@angular/common": "^18.1.4",
"@angular/compiler": "^18.1.4",
"@angular/core": "^18.1.4",
"@angular/forms": "^18.1.4",
"@angular/material": "^18.1.4",
"@angular/platform-browser": "^18.1.4",
"@angular/platform-browser-dynamic": "^18.1.4",
"@angular/router": "^18.1.4",

angular.json

       "optimization": {
            "scripts": true,
            "styles": {
              "minify": true,
              "inlineCritical": false
            },
            "fonts": true
          }

Answer 1

The solution to many Angular build problems:

Delete your node_modules folder, and your yarn.lock file and run yarn install. You should be good to go.

Using npm? Delete your node_modules folder, and your package-lock.json and run npm install.

Commit and push changes.