Heroku部署，没有找到css错误的模块

Question

找不到模块:错误：无法解析'./app.css‘中的'/tmp/build_c558f866/src'错误。我正在使用css-加载程序包来解决。此外，我使用了https://github.com/mars/create-react-app-buildpack这个构建包。然而，没有运气。这似乎是一个愚蠢的问题，但我并没有得到完美的解决办法。

我想知道是否有人能帮我。

谢谢

Package.json

{
  "name": "code-design",
  "version": "0.1.0",
  "engines": {
    "node": "16.13.1",
    "npm": "8.1.2"
  },
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.1",
    "@testing-library/react": "^12.1.2",
    "@testing-library/user-event": "^13.5.0",
    "normalize.css": "^8.0.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-hook-form": "^7.24.2",
    "react-icons": "^4.3.1",
    "react-router-dom": "^6.2.1",
    "react-scripts": "5.0.0",
    "web-vitals": "^2.1.3"
  },
  "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"
    ]
  },
  "devDependencies": {
    "css-loader": "^6.5.1"
  }
}

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        test: /\.css$/i,
        loader: "css-loader",
        options: {
          import: true,
        },
      },
    ],
  },
};

来自Heroku的错误日志

-----> Building on the Heroku-20 stack
-----> Using buildpack: https://github.com/mars/create-react-app-buildpack.git
-----> React.js (create-react-app) multi app detected
=====> Downloading Buildpack: https://github.com/heroku/heroku-buildpack-multi.git
=====> Detected Framework: Multipack
=====> Downloading Buildpack: https://github.com/heroku/heroku-buildpack-nodejs.git
=====> Detected Framework: Node.js
       
-----> Creating runtime environment
       
       NPM_CONFIG_LOGLEVEL=error
       USE_YARN_CACHE=true
       NODE_VERBOSE=false
       NODE_ENV=production
       NODE_MODULES_CACHE=true
       
-----> Installing binaries
       engines.node (package.json):  16.13.1
       engines.npm (package.json):   8.1.2
       engines.yarn (package.json):  unspecified (use default)
       
       Resolving node version 16.13.1...
       Downloading and installing node 16.13.1...
       npm 8.1.2 already installed with node
       Resolving yarn version 1.22.x...
       Downloading and installing yarn (1.22.17)
       Installed yarn 1.22.17
       
-----> Installing dependencies
       Installing node modules (yarn.lock)
       yarn install v1.22.17
       [1/4] Resolving packages...
       [2/4] Fetching packages...
       [3/4] Linking dependencies...
       warning " > @testing-library/user-event@13.5.0" has unmet peer dependency "@testing-library/dom@>=7.21.4".
       warning " > css-loader@6.5.1" has unmet peer dependency "webpack@^5.0.0".
       warning "react-scripts > tailwindcss@3.0.15" has unmet peer dependency "autoprefixer@^10.0.2".
       warning "react-scripts > eslint-config-react-app > eslint-plugin-flowtype@8.0.3" has unmet peer dependency "@babel/plugin-syntax-flow@^7.14.5".
       warning "react-scripts > eslint-config-react-app > eslint-plugin-flowtype@8.0.3" has unmet peer dependency "@babel/plugin-transform-react-jsx@^7.14.9".
       warning "react-scripts > react-dev-utils > fork-ts-checker-webpack-plugin@6.5.0" has unmet peer dependency "typescript@>= 2.7".
       warning "react-scripts > eslint-config-react-app > @typescript-eslint/eslint-plugin > tsutils@3.21.0" has unmet peer dependency "typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta".
       [4/4] Building fresh packages...
       Done in 29.23s.
       
-----> Build
       Running build (yarn)
       yarn run v1.22.17
       $ react-scripts build
       Creating an optimized production build...
       Failed to compile.
       
       Module not found: Error: Can't resolve './app.css' in '/tmp/build_c558f866/src'
       
       
error Command failed with exit code 1.
       info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
-----> Build failed
       
       We're sorry this build is failing! You can troubleshoot common issues here:
       https://devcenter.heroku.com/articles/troubleshooting-node-deploys
       
       If you're stuck, please submit a ticket so we can help:
       https://help.heroku.com/
       
       Love,
       Heroku
       
 !     Push rejected, failed to compile React.js (create-react-app) multi app.
 !     Push failed

Answer 1

需要CSS预处理器。不过，我没有用那个。我添加了sass软件包来进行反应，然后就完成了。

感谢所有