我正在尝试部署我的springboot & &;的反应,Mongodb应用到Heroku，但我无法这样做。我在终端上看到错误记录。
当我运行git push heroku main时，我得到以下错误:
Module not found: Error: cannot resolve 'React' in '/tmp/build_565ab5c4/src/main/js/components'
我试过npm install react&npm install react-dom，并将所有内容推送到远程主干。
remote: [INFO] WARNING in configuration
remote: [INFO] The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
remote: [INFO] You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/configuration/mode/
remote: [INFO]
remote: [INFO] ERROR in ./src/main/js/components/recipesHub.js
remote: [INFO] Module not found: Error: Can't resolve 'React' in '/tmp/build_565ab5c4/src/main/js/components'
remote: [INFO] @ ./src/main/js/components/recipesHub.js 7:13-29
remote: [INFO] @ ./src/main/js/components/session.js
remote: [INFO] @ ./src/main/js/app.js
remote: [INFO] ------------------------------------------------------------------------
remote: [INFO] BUILD FAILURE
remote: [INFO] ------------------------------------------------------------------------
remote: [INFO] Total time: 02:46 min
remote: [INFO] Finished at: 2021-08-06T23:54:05Z
remote: [INFO] ------------------------------------------------------------------------
remote: [ERROR] Failed to execute goal com.github.eirslett:frontend-maven-plugin:1.9.1:webpack (webpack build) on project KitchenHelperProject: Failed to run task: 'webpack.js ' failed. org.apache.commons.exec.ExecuteException: Process exited with an error: 2 (Exit value: 2) -> [Help 1]
remote: [ERROR]
remote: [ERROR] To see the full stack trace of the errors, re-run Maven with the -e switch.
remote: [ERROR] Re-run Maven using the -X switch to enable full debug logging.
remote: [ERROR]
remote: [ERROR] For more information about the errors and possible solutions, please read the following articles:
remote: [ERROR] [Help 1] http://cwiki.apache.org/confluence/display/MAVEN/MojoFailureException
remote:
remote: ! ERROR: Failed to build app with Maven
remote: We're sorry this build is failing! If you can't find the issue in application code,
remote: please submit a ticket so we can help: https://help.heroku.com/
remote:
remote: ! Push rejected, failed to compile Java app.
remote:
remote: ! Push failed
remote: Verifying deploy...
remote:
remote: ! Push rejected to myApp.
remote:
我的pom.xml文件:
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
<configuration>
<excludes>
<exclude>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
</exclude>
</excludes>
</configuration>
</plugin>
<plugin>
<groupId>com.github.eirslett</groupId>
<artifactId>frontend-maven-plugin</artifactId>
<version>1.9.1</version>
<configuration>
<installDirectory>target</installDirectory>
</configuration>
<executions>
<execution>
<id>install node and npm</id>
<goals>
<goal>install-node-and-npm</goal>
</goals>
<configuration>
<nodeVersion>v16.5.0</nodeVersion>
<npmVersion>7.19.1</npmVersion>
</configuration>
</execution>
<execution>
<id>npm install</id>
<goals>
<goal>npm</goal>
</goals>
<configuration>
<arguments>install</arguments>
</configuration>
</execution>
<execution>
<id>webpack build</id>
<goals>
<goal>webpack</goal>
</goals>
</execution>
</executions>
</plugin>
<plugin>
<groupId>org.asciidoctor</groupId>
<artifactId>asciidoctor-maven-plugin</artifactId>
<version>1.5.8</version>
<executions>
<execution>
<id>generate-docs</id>
<phase>prepare-package</phase>
<goals>
<goal>process-asciidoc</goal>
</goals>
<configuration>
<backend>html</backend>
<doctype>book</doctype>
</configuration>
</execution>
</executions>
<dependencies>
<dependency>
<groupId>org.springframework.restdocs</groupId>
<artifactId>spring-restdocs-asciidoctor</artifactId>
<version>${spring-restdocs.version}</version>
</dependency>
</dependencies>
</plugin>
</plugins>
</build>
我的包。json文件:
{
"name": "myApp",
"version": "1.0.0",
"description": "My app project",
"main": "index.js",
"dependencies": {
"@fontsource/roboto": "^4.5.0",
"@material-ui/core": "latest",
"@material-ui/icons": "latest",
"@material-ui/styles": "4.11.4",
"axios": "^0.21.1",
"babel-core": "^6.26.3",
"babel-loader": "^7.1.4",
"babel-polyfill": "^6.26.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"bootstrap": "^5.0.2",
"clsx": "latest",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router-dom": "^5.2.0",
"react-scripts": "latest",
"rest": "^2.0.0",
"webpack": "^4.10.2",
"webpack-cli": "^3.1.1"
},
"devDependencies": {
"jest": "^23.1.0"
},
"scripts": {
"start": "npm run webpack",
"webpack": "webpack -d --watch",
"heroku-postbuild": "npm run build"
}
我的项目结构:项目设置
我发现了为什么我得到了错误-一个队友犯的愚蠢的错误，我没有意识到，直到我仔细观察导致错误的文件，即recipesHub.js
我在这个文件中有以下行:
import React from 'React';
然后改成:
import React from 'react';
一个小错字，我花了24小时才注意到:))
随后成功部署到Heroku。D
在我的情况下，我的package.json没有直接依赖于react!我的本地开发很顺利，因为我通过react-hot-loader间接依赖，这是我没有意识到的;我检查了下面的命令:
$ npm list react
cards@1.0.0 ~/Learning/react/cards
├─┬ react-hot-loader@4.13.0
│ ├─┬ react-dom@17.0.2
│ │ └── react@17.0.2 deduped
│ └── react@17.0.2
└─┬ react-router-dom@4.3.1
├─┬ react-router@4.3.1
│ └── react@17.0.2 deduped
└── react@17.0.2 deduped
Heroku在没有直接依赖react的情况下运行应用程序失败(无论如何，直接依赖是最佳实践!)，在op中出现同样的错误。在我直接安装依赖项后，它成功了:
npm install react react-dom