Re: pg-native could not be resolved

Solved

How to resolve pg-native error in Shopify CLI Extensions Server?

sirev
Shopify Partner
15 4 3

Hello there,

 

@Shopify/app@3.0.25
@Shopify/cli@3.0.25

Having this issue when running the project:

 

extensions | Shopify CLI Extensions Server is now available at https://5958-188-138-193-49.eu.ngrok.io/extensions/dev-console
extensions | flaminjoy-galleries-pixel (C:\projects\productlead.me\shopify\productlead-galleries\node_modules\@shopify\app\node_modules\.bin\shopify-cli-extensions:2
extensions | basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
extensions |           ^^^^^^^
extensions |
extensions | SyntaxError: missing ) after argument list
extensions |     at Object.compileFunction (node:vm:352:18)
extensions |     at wrapSafe (node:internal/modules/cjs/loader:1033:15)
extensions |     at Module._compile (node:internal/modules/cjs/loader:1069:27)
extensions |     at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
extensions |     at Module.load (node:internal/modules/cjs/loader:981:32)
extensions |     at Function.Module._load (node:internal/modules/cjs/loader:822:12)
extensions |     at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
extensions |     at node:internal/main/run_main_module:17:47)
frontend   |
frontend   | > dev
frontend   | > vite
frontend   |
backend    |
backend    | > dev
backend    | > cross-env NODE_ENV=development nodemon index.js --ignore ./frontend
backend    |
frontend   |
frontend   |   vite v2.9.15 dev server running at:
frontend   |
frontend   |   > Network:  http://192.168.56.1:64666/
frontend   |   > Network:  http://192.168.18.8:64666/
frontend   |   > Local:    http://localhost:64666/
frontend   |   > Network:  http://172.31.224.1:64666/
frontend   |
frontend   |   ready in 243ms.
frontend   |
backend    | [nodemon] 2.0.19
backend    | [nodemon] to restart at any time, enter `rs`
backend    | [nodemon] watching path(s): *.*
backend    | [nodemon] watching extensions: js,mjs,json
backend    | [nodemon] starting `node index.js`
frontend   | b [ERROR] Could not resolve "pg-native"
frontend   |
frontend   |     ../node_modules/pg/lib/native/client.js:4:21:
frontend   |       4 b var Native = require('pg-native')
frontend   |         b5                      ~~~~~~~~~~~
frontend   |
frontend   |
frontend   |   You can mark the path "pg-native" as external to exclude it from the bundle, which will remove this error. You can also surround this "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.
frontend   |
frontend   | b [ERROR] Could not resolve "mock-aws-s3"
frontend   |
frontend   |     ../node_modules/@mapbox/node-pre-gyp/lib/util/s3_setup.js:43:28:
frontend   |       43 b     const AWSMock = require(
frontend   | 'mock-aws-s3');
frontend   |          b5                             ~~~~~~~~~~~~~
frontend   |
frontend   |   You can mark the path "mock-aws-s3" as external to exclude it from the bundle, which will remove this error. You can also surround this "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.
frontend   |
frontend   | b [ERROR] Could not resolve "aws-sdk"
frontend   |
frontend   |     ../node_modules/@mapbox/node-pre-gyp/lib/util/s3_setup.js:76:22:
frontend   |       76 b   const AWS = require(
frontend   | 'aws-sdk');
frontend   |          b5                       ~~~~~~~~~
frontend   |
frontend   |   You can mark the path "aws-sdk" as external to exclude it from the bundle, which will remove this error. You can also surround this "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.
frontend   |
frontend   | b [ERROR]
frontend   | Could not resolve "nock"
frontend   |
frontend   |     ../node_modules/@mapbox/node-pre-gyp/lib/util/s3_setup.js:112:23:
frontend   |       112 b   const nock = require('nock');
frontend   |           b5                        ~~~~~~
frontend   |
frontend   |   You can mark the path "nock" as external to exclude it from the bundle, which will remove this error. You can also surround this "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.
frontend   |
frontend   | 11:52:52 [vite] error while updating dependencies:
frontend   | Error: Build failed with 4 errors:
frontend   | ../node_modules/@mapbox/node-pre-gyp/lib/util/s3_setup.js:43:28: ERROR: Could not resolve "mock-aws-s3"
frontend   | ../node_modules/@mapbox/node-pre-gyp/lib/util/s3_setup.js:76:22: ERROR: Could not resolve "aws-sdk"
frontend   | ../node_modules/@mapbox/node-pre-gyp/lib/util/s3_setup.js:112:23: ERROR: Could not resolve "nock"
frontend   | ../node_modules/pg/lib/native/client.js:4:21: ERROR: Could not resolve "pg-native"
frontend   |     at failureErrorWithLog (C:\projects\productlead.me\shopify\productlead-galleries\web\frontend\node_modules\esbuild\lib\main.js:1624:15)
frontend   |     at C:\projects\productlead.me\shopify\productlead-galleries\web\frontend\node_modules\esbuild\lib\main.js:1266:28
frontend   |     at runOnEndCallbacks (C:\projects\productlead.me\shopify\productlead-galleries\web\frontend\node_modules\esbuild\lib\main.js:1046:63)
frontend   |     at buildResponseToResult (C:\projects\productlead.me\shopify\productlead-galleries\web\frontend\node_modules\esbuild\lib\main.js:1264:7)
frontend   |     at C:\projects\productlead.me\shopify\productlead-galleries\web\frontend\node_modules\esbuild\lib\main.js:1377:14
frontend   |     at C:\projects\productlead.me\shopify\productlead-galleries\web\frontend\node_modules\esbuild\lib\main.js:678:9
frontend   |     at handleIncomingPacket (C:\projects\productlead.me\shopify\productlead-galleries\web\frontend\node_modules\esbuild\lib\main.js:775:9)
frontend   |     at Socket.readFromStdout (C:\projects\productlead.me\shopify\productlead-galleries\web\frontend\node_modules\esbuild\lib\main.js:644:7)
frontend   |     at Socket.emit (node:events:527:28)
frontend   |     at addChunk (node:internal/streams/readable:315:12)

 


Tried:
- Removed package-lock.json (from root folder, web folder and frontend folder)
- Removed node-modules folder (from root folder, web folder and frontend folder)
- Run npm i in all root folder, web folder, frontend folder
- Reinstalled all node-modules for @Shopify/cli@3.3.3, after for @Shopify/cli@3.8.0

Thanks,
 

Accepted Solution (1)

sirev
Shopify Partner
15 4 3

This is an accepted solution.

I found where the bug was, the solution was to not use GraphQLClient on frontend react side, and use it only on node side by calling a REST API, therefore executing the mutation, although I'm still getting errors on creating the web pixel extension, it's in that shell script saying dirname missing arugment after ")". Further will search and open another thread on this case.

THE ANSWER: DO NOT USE GRAPHQLCLIENT and Shopify imports on frontend side as it doesn't find the modules for GraphQL.

View solution in original post

Replies 2 (2)

sirev
Shopify Partner
15 4 3

This is an accepted solution.

I found where the bug was, the solution was to not use GraphQLClient on frontend react side, and use it only on node side by calling a REST API, therefore executing the mutation, although I'm still getting errors on creating the web pixel extension, it's in that shell script saying dirname missing arugment after ")". Further will search and open another thread on this case.

THE ANSWER: DO NOT USE GRAPHQLCLIENT and Shopify imports on frontend side as it doesn't find the modules for GraphQL.

branderson
Shopify Partner
1 0 0

This is really unfortunate. We spent a good chunk of time trying to fix the pg-native problem so we could use GraphQL from the embedded app generated from Shopify CLI version three. It would be nice to see a solution. GraphQL really belongs on the front-end as well as the back-end.