將Postgres與新創建的React應用程序一起使用時出錯：找不到模塊：無法解析“ dns”

Question

我可能在這里遺漏了一些非常明顯的東西，但是當嘗試從新創建的React應用程序使用Postgres時，我一直收到以下錯誤

Module not found: Can't resolve 'dns' in '/Users/tarek/test/node_modules/pg/lib'

以下是重現步驟：

1. 使用create-react-app創建一個新的React應用
2. 使用npm install pg --save添加Postgres模塊
3. 將以下行添加到App.js： const { Client } = require('pg');
4. 鍵入npm run start ，您將收到上述錯誤。

我在這里想念什么？

**節點版本：v8.12.0

** package.json

{
  "name": "test",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "pg": "^7.4.3",
    "react": "^16.5.1",
    "react-dom": "^16.5.1",
    "react-scripts": "1.1.5"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }
}

Answer 1

問題在於React應用程序本應在瀏覽器中運行，而瀏覽器無法直接訪問數據庫。 即使您確實找到了執行此操作的方法，它也只能在本地運行，而不能在生產中使用。 考慮一下，如果數據庫在您的計算機上，而您的應用程序在Internet上可用，則遠程用戶將無法以您所描述的方式訪問計算機上的數據。

為了在React上使用數據庫，您需要設置一個服務器（可能是用Node編寫的（使用Express ）），該服務器將為您的應用程序和數據提供服務。

服務器接收來自不同用戶的請求，並以適當的資源進行響應。 例如，如果他們訪問您的網站（例如example.com），您的服務器應為您的項目使用index.html進行響應（在這種情況下，它將是您的React應用程序的index.html）。 然后，要從數據庫中獲取數據，您可以使用例如example.com/api/model/1之類的路由設置一個api，以便您的react應用可以從服務器請求ID為1的model實例，該實例將從數據庫並將其發送到React應用程序。

查看MERN（Mongo Express React Node）堆棧，以詳細了解所有這些如何協同工作。 即使使用Postgres，該過程也與使用Mongo幾乎相同。