TypeScript issue with find and filter

Question

let access = environment.access.filter(it => it.roleName === userRole);

let access = environment.access.find(it => it.roleName == userRole);

Property 'filter' does not exist on type '{ siteadmin: string[]; manager: string[]; employee: string[]; contractor: any[]; }'.

This should work but I can't figure out why it's throwing this error when i ng build or ng serve

using Angular 13

Environment.ts

export const environment = {
  production: false,
  baseUrl:"https://localhost:5001/api/",
  access: [{
    roleName:"siteadmin",
    access:['page1','home', 'usermanagement']
  },
  {
    roleName:"manager",
    access:['home']
  },
  {
    roleName:"employee",
    access:['page1','home']
  },
  {
    roleName:"contractor",
    access:['page1','home', 'usermanagement']
  }
],
};

access is an array of objects

Answer 1

I bet the problem is that you've edited the environment.ts file, but you haven't updated the environment.prod.ts (or the equivalent for whatever configuration you've supplied with ng serve) file to match the same structure. Angular performs a file replacement as part of its build process that won't be caught by your editor's type checking.