Развертывание приложения React с npm запустить сборку без поиска файлов

Question

У меня сейчас есть каталог myproject/ В моем проекте у меня есть эти

/src
/public
package.json

et c. Нормальные вещи, которые вы увидите в приложении реакции. Я отправил это на сервер aws lightsail nodejs, а затем запустил npm install. После того, как я все это сделаю, я go и выполню npm run build

Я получаю следующий вывод:

> react-scripts build

Creating an optimized production build...
Failed to compile.

./src/index.js

Cannot find module: 'layouts/Admin.jsx'. Make sure this package is installed.

You can install this package by running: npm install layouts/Admin.jsx.

Файлы, к которым он обращается, находятся в каталоге. Вот пакет. json

{
  "name": "argon-dashboard-react",
  "version": "1.0.0",
  "description": "React version of Argon Dashboard by Creative Tim",
  "main": "index.js",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/creativetimofficial/argon-dashboard-react.git"
  },
  "keywords": [
    "react",
    "reactjs",
    "argon",
    "argon-react",
    "dashboard",
    "dashboard-react",
    "argon-dashboard",
    "argon-dashboard-react"
  ],
  "author": "Creative Tim",
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/creativetimofficial/argon-dashboard-react/issues"
  },
  "homepage": "https://demos.creative-tim.com/argon-dashboard-react/",
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "install:clean": "rm -rf node_modules/ && rm -rf package-lock.json && npm install && npm start",
    "compile-sass": "node-sass src/assets/scss/argon-dashboard-react.scss src/assets/css/argon-dashboard-react.css",
    "minify-sass": "node-sass src/assets/scss/argon-dashboard-react.scss src/assets/css/argon-dashboard-react.min.css --output-style compressed",
    "map-sass": "node-sass src/assets/scss/argon-dashboard-react.scss src/assets/css/argon-dashboard-react.css --source-map true"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ],
  "dependencies": {
    "@material-ui/core": "^4.6.1",
    "@material-ui/icons": "^4.5.1",
    "chart.js": "2.7.3",
    "classnames": "2.2.6",
    "firebase": "^6.6.2",
    "firebase-admin": "^8.8.0",
    "http2": "^3.3.7",
    "moment": "2.24.0",
    "node-sass": "4.11.0",
    "nouislider": "13.1.1",
    "react": "16.9.0",
    "react-bootstrap-table-next": "^3.2.1",
    "react-chartjs-2": "2.7.4",
    "react-copy-to-clipboard": "5.0.1",
    "react-data-table-component": "4.0.1",
    "react-datepicker": "^2.9.6",
    "react-datetime": "2.16.3",
    "react-dom": "16.9.0",
    "react-google-maps": "9.4.5",
    "react-loading-screen": "0.0.17",
    "react-router-dom": "4.3.1",
    "react-scripts": "2.1.8",
    "reactstrap": "7.1.0",
    "recompose": "^0.30.0",
    "styled-components": "^4.4.1",
    "sweetalert2": "^9.5.4",
    "sweetalert2-react-content": "^2.0.2"
  },
  "devDependencies": {
    "@types/googlemaps": "3.30.18",
    "@types/markerclustererplus": "2.1.33",
    "@types/react": "16.8.7",
    "typescript": "3.3.3333"
  }
}

Есть идеи, что с этим происходит?

Answer 1

Проблема была связана с тем, как я использовал пути импорта для компонентов. Например, в настоящее время у меня есть:

import UserHeader from "components/Headers/UserHeader.jsx";

Правильный способ их установки был:

import UserHeader from "../../components/Headers/UserHeader.jsx";

Что меня оттолкнуло, так это то, что локально это работало.