How to include elastic/search-ui in an Angular project?

805 Views Asked by At

I am trying to build a search page using @elastic-search-ui and following the headless concepts way of adding it, shows errors.

  1. Built a new angular application
  2. in package.json (adding them under devDependencies or dependencies has the same issue).
  ...
  "devDependencies": {
    ..    
    "@elastic/search-ui": "^1.9.0",
    "@elastic/search-ui-site-search-connector": "1.9.0",
  1. In app.module.ts
...
import { SearchDriver } from '@elastic/search-ui';
...

throws a compilation error as:

Error: src/app/app.module.ts:7:30 - error TS7016: Could not find a declaration file 
for module '@elastic/search-ui'. /Users/s/angular-elastic-search-ui/node_modules/@elastic/search-ui/lib/index.js' 
implicitly has an 'any' type.
Try `npm i --save-dev @types/elastic__search-ui` if it exists or 
add a new declaration (.d.ts) file containing `declare module '@elastic/search-ui';`
1

There are 1 best solutions below

1
On

Not sure if you still need help, but I suggest trying Elastic App Search Javascript client, https://github.com/elastic/app-search-javascript. I'm currently using it in a React SPA++.