Vue storefront problem when connecting to server - Elasticsearch Error

[ArjanStudent]

I have installed vue storefront following all the documentation given on the docs ( and migrated my magento 2 project ) , the migration was succesful according to the logs but when I try to the vue storefront app ( localhost:3000 ) I get following error in the logs :

[search] Can not connect the vue-storefront-api / ElasticSearch instance! Error: {"code":500,"result":{"diagnosticText":"src/processor/default.ts(25,48): error TS2349: Cannot invoke an expression whose type lacks a call signature. Type 'string | Query | (string | Query)[] | ((searchString: string, position?: number) => number) | ((searchElement: string | Query, fromIndex?: number) => number)' has no compatible call signatures.\n","diagnosticCodes":[2349]}}
    at SearchAdapter.exports.modules../core/lib/search/adapter/api/searchAdapter.ts.SearchAdapter.handleResult (vsf-search-adapter-0.server-bundle.js:547:23)
    at Object.resultProcessor (vsf-search-adapter-0.server-bundle.js:582:30)
    at server-bundle.js:3188:92
    at processTicksAndRejections (internal/process/task_queues.js:97:5)

When I try to launch vue storefront on legacy mode ( yarn dev ) I get following error :

(node:4545) UnhandledPromiseRejectionWarning: Error: FetchError in request to ES: FetchError: request to http://localhost:8080/api/catalog/vue_storefront_catalog/attribute/_search?_source_include=activity%2Cattribute_code%2Cid%2Centity_type_id%2Coptions%2Cdefault_value%2Cis_user_defined%2Cfrontend_label%2Cattribute_id%2Cdefault_frontend_label%2Cis_visible_on_front%2Cis_visible%2Cis_comparable%2Ctier_prices%2Cfrontend_input&from=0&request=%7B%22query%22%3A%7B%22bool%22%3A%7B%22filter%22%3A%7B%22terms%22%3A%7B%22attribute_code%22%3A%5B%22color%22%2C%22size%22%2C%22price%22%2C%22erin_recommends%22%2C%22activity%22%2C%22type_id%22%2C%22sku%22%2C%22name%22%2C%22tax_class_id%22%2C%22final_price%22%2C%22special_price%22%2C%22special_to_date%22%2C%22special_from_date%22%2C%22price_incl_tax%22%2C%22original_price_incl_tax%22%2C%22original_price%22%2C%22special_price_incl_tax%22%2C%22id%22%2C%22image%22%2C%22sale%22%2C%22new%22%2C%22product_links%22%2C%22url_path%22%2C%22url_key%22%2C%22status%22%2C%22tier_prices%22%5D%7D%7D%7D%7D%7D&size=150&sort= failed,
 reason: socket hang up

On the api i get following error when I try to connect to the local vue storefront server :

$GET /api/catalog/vue_storefront_catalog/attribute/_search?_source_include=activity%2Cattribute_code%2Cid%2Centity_type_id%2Coptions%2Cdefault_value%2Cis_user_defined%2Cfrontend_label%2Cattribute_id%2Cdefault_frontend_label%2Cis_visible_on_front%2Cis_visible%2Cis_comparable%2Ctier_prices%2Cfrontend_input&from=0&request=%7B%22query%22%3A%7B%22bool%22%3A%7B%22filter%22%3A%7B%22terms%22%3A%7B%22attribute_code%22%3A%5B%22color%22%2C%22size%22%2C%22price%22%2C%22erin_recommends%22%2C%22activity%22%2C%22type_id%22%2C%22sku%22%2C%22name%22%2C%22tax_class_id%22%2C%22final_price%22%2C%22special_price%22%2C%22special_to_date%22%2C%22special_from_date%22%2C%22price_incl_tax%22%2C%22original_price_incl_tax%22%2C%22original_price%22%2C%22special_price_incl_tax%22%2C%22id%22%2C%22image%22%2C%22sale%22%2C%22new%22%2C%22product_links%22%2C%22url_path%22%2C%22url_key%22%2C%22status%22%2C%22tier_prices%22%5D%7D%7D%7D%7D%7D&size=150&sort= - 521.628 ms - -
(node:4444) UnhandledPromiseRejectionWarning: RangeError [ERR_HTTP_INVALID_STATUS_CODE]: Invalid status code: ECONNREFUSED
    at ServerResponse.writeHead (_http_server.js:248:11)
    at ServerResponse.writeHead (/home/awest/Documents/Stage/Vue/vue-storefront-api/node_modules/on-headers/index.js:44:26)
    at ServerResponse._implicitHeader (_http_server.js:239:8)
    at write_ (_http_outgoing.js:650:9)
    at ServerResponse.end (_http_outgoing.js:760:5)
    at ServerResponse.send (/home/awest/Documents/Stage/Vue/vue-storefront-api/node_modules/express/lib/response.js:221:10)
    at ServerResponse.json (/home/awest/Documents/Stage/Vue/vue-storefront-api/node_modules/express/lib/response.js:267:15)
    at apiStatus (/home/awest/Documents/Stage/Vue/vue-storefront-api/src/lib/util.js:77:20)
    at Object.apiError (/home/awest/Documents/Stage/Vue/vue-storefront-api/src/lib/util.js:89:10)
    at /home/awest/Documents/Stage/Vue/vue-storefront-api/src/api/catalog.js:92:9
(node:4444) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 3)
(node:4444) UnhandledPromiseRejectionWarning: RangeError [ERR_HTTP_INVALID_STATUS_CODE]: Invalid status code: ECONNREFUSED
    at ServerResponse.writeHead (_http_server.js:248:11)
    at ServerResponse.writeHead (/home/awest/Documents/Stage/Vue/vue-storefront-api/node_modules/on-headers/index.js:44:26)
    at ServerResponse._implicitHeader (_http_server.js:239:8)
    at write_ (_http_outgoing.js:650:9)
    at ServerResponse.end (_http_outgoing.js:760:5)
    at ServerResponse.send (/home/awest/Documents/Stage/Vue/vue-storefront-api/node_modules/express/lib/response.js:221:10)
    at ServerResponse.json (/home/awest/Documents/Stage/Vue/vue-storefront-api/node_modules/express/lib/response.js:267:15)
    at apiStatus (/home/awest/Documents/Stage/Vue/vue-storefront-api/src/lib/util.js:77:20)
    at Object.apiError (/home/awest/Documents/Stage/Vue/vue-storefront-api/src/lib/util.js:89:10)
    at /home/awest/Documents/Stage/Vue/vue-storefront-api/src/api/catalog.js:92:9

Any help on how I could solve this problem would be appreciated, none of the code has been touched, I have cloned vue storefront from github & followed the installation options ( yarn & yarn installer ).

Kind Regards

Arjan

[gibkigonzo]

You have type error in vsf-api. Run yarn build in vsf-api and you will see all type errors. Probably you've updated @types/express where they changed type for query. Take a look at this vuestorefront/vue-storefront-api#433

[ArjanStudent]

@gibkigonzo,

I get alot of these errors when trying to build :

node_modules/globby/index.d.ts:6:14 - error TS1005: ';' expected.

6       | readonly string[]
                   ~~~~~~

node_modules/globby/index.d.ts:6:21 - error TS1011: An element access expression should take an argument.

6       | readonly string[]
                          

node_modules/globby/index.d.ts:7:23 - error TS1005: ',' expected.

7       | {files?: readonly string[]; extensions?: readonly string[]};
                            ~~~~~~

In my package.json it says my types/express version is :
@types/express": "^4.16.1",

[ArjanStudent]

I also get some warnings concering my typescript error but i'm not sure which one i should go for, on the API project the typescript version is defaulted to 3.3.* and on the vue storefront project it is set to ^3.1.6 which is giving me version 3.8.3 during installation of the modules.

[gibkigonzo]

yarn.lock should prevent you from update to 4.17.5

"@types/express-serve-static-core@*":
  version "4.16.7"
  resolved "https://registry.yarnpkg.com/@types/express-serve-static-core/-/express-serve-static-core-4.16.7.tgz#50ba6f8a691c08a3dd9fa7fba25ef3133d298049"
  dependencies:
    "@types/node" "*"
    "@types/range-parser" "*"

"@types/express@^4.16.1":
  version "4.17.0"
  resolved "https://registry.yarnpkg.com/@types/express/-/express-4.17.0.tgz#49eaedb209582a86f12ed9b725160f12d04ef287"
  dependencies:
    "@types/body-parser" "*"
    "@types/express-serve-static-core" "*"
    "@types/serve-static" "*"

I will check it, you can downgrade this by typing yarn add @types/express@4.17.0 @types/express-serve-static-core@4.16.7 -W -D

[ArjanStudent]

"@types/express-serve-static-core@*":
  version "4.17.2"
  resolved "https://registry.yarnpkg.com/@types/express-serve-static-core/-/express-serve-static-core-4.17.2.tgz#f6f41fa35d42e79dbf6610eccbb2637e6008a0cf"
  integrity sha512-El9yMpctM6tORDAiBwZVLMcxoTMcqqRO9dVyYcn7ycLWbvR8klrDn8CAOwRfZujZtWD7yS/mshTdz43jMOejbg==
  dependencies:
    "@types/node" "*"
    "@types/range-parser" "*"

"@types/express@*":
  version "4.17.3"
  resolved "https://registry.yarnpkg.com/@types/express/-/express-4.17.3.tgz#38e4458ce2067873b09a73908df488870c303bd9"
  integrity sha512-I8cGRJj3pyOLs/HndoP+25vOqhqWkAZsWMEmq1qXy/b/M3ppufecUwaK2/TVDVxcV61/iSdhykUjQQ2DLSrTdg==
  dependencies:
    "@types/body-parser" "*"
    "@types/express-serve-static-core" "*"
    "@types/serve-static" "*"

I have this in my yarn.lock, I will attempt what you gave me and see how it reacts.

[ryrych]

I can confirm this.

Current master

6967e0ae6 (HEAD -> master, origin/master, origin/HEAD) Merge pull request #4265 from DivanteLtd/tom-aniol-patch-2

Node

nvm list
…
lts/* -> lts/erbium (-> v12.16.2)
…

…
? Would you like to use https://demo.vuestorefront.io as the backend? No
? Please provide Git path (if it's not globally installed) git
? Please provide path for installing backend locally (../vue-storefront-api)? Please provide path for installing backend locally
../vue-storefront-api
? Choose path for images endpoint
http://localhost:8080/img/

? Please provide your Magento url
http://demo-magento2.vuestorefront.io
? Would You like to perform initial data import from Magento2 instance?
No

…

 Starting storefront server...

{"code":500,"result":{"diagnosticText":"src/processor/default.ts(25,48): error TS2349: Cannot invoke an expression whose type lacks a call signature. Type 'string | Query | (string | Query)[] | ((searchString: string, position?: number) => number) | ((searchElement: string | Query, fromIndex?: number) => number)' has no compatible call signatures.\n","diagnosticCodes":[2349]}}

[ArjanStudent]

Another issue i seem to have ( not sure if related ) but the migration from magento works fine, but all the api requests that vue storefront does to the vue storefront API result in a 400 response.
Example from logs :

�[0mGET /api/catalog/vue_storefront_catalog/attribute/_search?_source_include=activity%2Cattribute_code%2Cid%2Centity_type_id%2Coptions%2Cdefault_value%2Cis_user_defined%2Cfrontend_label%2Cattribute_id%2Cdefault_frontend_label%2Cis_visible_on_front%2Cis_visible%2Cis_comparable%2Ctier_prices%2Cfrontend_input&from=0&request=%7B%22query%22%3A%7B%22bool%22%3A%7B%22filter%22%3A%7B%22terms%22%3A%7B%22attribute_code%22%3A%5B%22color%22%2C%22size%22%2C%22price%22%2C%22erin_recommends%22%2C%22activity%22%2C%22type_id%22%2C%22sku%22%2C%22name%22%2C%22tax_class_id%22%2C%22final_price%22%2C%22special_price%22%2C%22special_to_date%22%2C%22special_from_date%22%2C%22price_incl_tax%22%2C%22original_price_incl_tax%22%2C%22original_price%22%2C%22special_price_incl_tax%22%2C%22id%22%2C%22image%22%2C%22sale%22%2C%22new%22%2C%22product_links%22%2C%22url_path%22%2C%22url_key%22%2C%22status%22%2C%22tier_prices%22%5D%7D%7D%7D%7D%7D&size=150&sort= �[31m500�[0m 209.661 ms - 410�[0m