添加 Tailwind 和 CRACO 后 Heroku 错误

如何解决添加 Tailwind 和 CRACO 后 Heroku 错误

我最近按照以下步骤将 TailwindCSS 添加到我的 React 应用程序：https://tailwindcss.com/docs/guides/create-react-app

现在的挑战是，当我部署到安装了 buildpack https://github.com/mars/create-react-app-buildpack 的 Heroku 时，出现错误： Error injecting runtime env: bundle not found '/app/build/static/js/*.js' 来自

因为我必须将 package.json 中的构建脚本更改为

"build": "craco build"

我的问题是，CRACO 是否将我的应用程序构建到与 Heroku 期望的文件夹不同的文件夹中？还是我的问题可能是由其他原因引起的？

这是我的 package.json

{
  "name": "nantoo-react","version": "0.1.0","private": true,"scripts": {
    "start": "craco start","build": "craco build","test": "react-scripts test","eject": "react-scripts eject","flow": "flow","format": "prettier --write 'src/**/*.{js,jsx}'","heroku-postbuild": "npm rebuild node-sass"
  },"dependencies": {
    "@craco/craco": "^6.1.2","@material-ui/core": "^4.11.2","@material-ui/icons": "^4.11.2","@testing-library/jest-dom": "^5.11.6","@testing-library/react": "^11.2.2","@testing-library/user-event": "^12.3.0","autoprefixer": "^9.8.6","axios": "^0.21.1","body-scroll-lock": "^3.1.5","bootstrap": "^4.5.2","browser-image-compression": "^1.0.14","cropperjs": "^1.5.9","env-cmd": "^10.1.0","eslint": "^7.27.0","eslint-config-prettier": "^8.3.0","eslint-plugin-prettier": "^3.4.0","eslint-plugin-react": "^7.23.2","flow-bin": "^0.151.0","jquery": "^3.5.1","mobile-detect": "^1.4.5","node-sass": "^4.14.1","p-sleep": "^1.1.0","postcss": "^7.0.35","prettier": "^2.3.0","prettier-eslint": "^12.0.0","react": "^17.0.1","react-dom": "^17.0.1","react-facebook-login": "^4.1.1","react-modal": "^3.12.1","react-router-dom": "^5.2.0","react-scripts": "4.0.1","react-slick": "^0.27.13","react-tinder-card": "^1.3.1","react-toastify": "^6.2.0","react-tour-onboarding": "^1.15.63","reactour": "^1.18.1","slick-carousel": "^1.8.1","socket.io-client": "^3.0.4","styled-components": "^5.2.1","tailwind-scrollbar-hide": "^1.0.3","tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.1.4","web-vitals": "^0.2.4"
  },"browserslist": {
    "production": [
      ">0.2%","not dead","not op_mini all"
    ],"development": [
      "last 1 chrome version","last 1 firefox version","last 1 safari version"
    ]
  },"engines": {
    "node": "14.x","npm": "7.x"
  },"devDependencies": {}
}

而我的 craco.config.js 是

module.exports = {
  style: {
    postcss: {
      plugins: [require("tailwindcss"),require("autoprefixer")],},};

我将不胜感激。