【问题标题】:Folder structure for backend and frontend后端和前端的文件夹结构
【发布时间】:2021-12-12 04:05:10
【问题描述】:

我正在设置一个带有 express node.js 后端和反应前端的项目。这是我第一次设置一个带有后端的项目,我不确定它们的一些事情......

第一个问题:

所以我当前的文件夹结构是这样的:

--后端
--node_modules
--package-lock.json
--package.json
--server.js
--yarn.lock
--客户端
--node_modules
--package.json
--公共
--.gitignore
--README.md
--yarn.lock
--src
--boilerplate create-react-app 文件

我的 package.json 文件:
BACKEND

{
  "name": "yelp-clone-2-backend",
  "license": "MIT",
  "version": "1.0.0",
  "scripts": {
    "client": "cd client && yarn start",
    "server": "nodemon server.js",
    "dev": "concurrently --kill-others-on-fail \"yarn server\" \"yarn client\""
  },
  "dependencies": {
    "body-parser": "^1.18.3",
    "express": "^4.17.1"
  },
  "devDependencies": {
    "concurrently": "^4.0.1"
  }
}

我的 package.json 文件:

前端

{
  "name": "yelp-clone-2-front-end",
  "version": "0.1.0",
  "license": "MIT",
  "private": true,
  "proxy": "http://localhost:5000/",
  "dependencies": {
    "@testing-library/jest-dom": "^5.11.4",
    "@testing-library/react": "^11.1.0",
    "@testing-library/user-event": "^12.1.10",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-scripts": "4.0.3",
    "web-vitals": "^1.0.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}


我正在使用 BACKEND package.json 中的命令来组合前端和后端服务器
"dev": "concurrently --kill-others-on-fail \"yarn server\" \"yarn client\""

当我运行此命令(从 /backend 目录)时,我遇到的问题是我当前的文件夹结构,我得到

[1] /bin/sh: line 0: cd: client: No such file or directory
error Command failed with exit code 1.

但是...如果我将所有内容移出后端并移到根目录中,以便在客户端之外而不是在后端文件夹中,则该命令将起作用,并且服务器将启动并像预期的那样在端口 5000 上侦听。

为什么该命令仅适用于根目录中的后端文件,而不适用于我想要的后端文件夹。

在启动服务器之前,我尝试在后端文件夹中运行以下命令,但没有成功:
rm -rf node_modules
yarn cache clean
yarn
yarn start

【问题讨论】:

  • 您可以使用--prefix 而不是cding 进入客户端文件夹:"client": "yarn start --prefix client",
  • 我不熟悉 --prefix 做什么?我很困惑为什么我要运行“yarn start --prefix client”
  • --prefix 命令指定运行命令的文件夹。在这种情况下,您需要定位 client 文件夹,并且在客户端文件夹中,您需要运行客户端 package.json 中的脚本之一。例如,在我的客户端 package.json 文件中,我有一个 @ 987654331@ 脚本,但我想从服务器 package.json 运行它:"client": "npm run dev --prefix client",
  • 如果您同时使用,那么您只需在服务器 package.json 中定位上述 client 脚本:"dev": "concurrently \"npm run server\" \"npm run client\"",。现在,当我运行 npm run dev 时,它将在开发环境中同时加载服务器和客户端。

标签: node.js reactjs express directory-structure git-init


【解决方案1】:
  • 对于无法运行的 cd 命令,您需要了解 npm 命令是在后端文件夹中执行的。这意味着如果要将目录更改为客户端文件夹,则需要在文件夹前附加两个点:cd ../client。您试图转到不存在的后端/客户端。

  • 要生成 git 存储库,您需要运行 git init 而不是 npm init

请在盲目使用 cd 命令之前了解它的工作原理,因为它在专业环境中可能会产生一些非常糟糕的结果。

如有更多问题,请回复此答案,我很乐意对其进行编辑。

【讨论】:

  • 我正在从 /backend 文件夹运行 npm run dev 命令,但它不起作用。如果我理解正确,您认为我是从后端文件夹以外的其他地方运行命令?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2018-12-10
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-06-20
  • 2017-05-30
  • 2017-09-19
相关资源
最近更新 更多