Haz todo lo posible por comprender el código de forma correcta previamente a usarlo a tu trabajo y si ttienes algo que aportar puedes decirlo en los comentarios.
Solución:
Tenía un requisito similar para tener un proyecto de origen que tenga un proyecto de servicios web java, así como un proyecto angular (un proyecto basado en angular-cli) y la compilación de maven debería crear una guerra con todos los archivos angulares en él. Usé maven-frontend-plugin con pocos cambios de configuración para la ruta base.
El objetivo era crear un archivo war con todo el código java más todo el código angular compilado aot en la carpeta raíz de war, todo esto con un solo comando mvn clean package.
Una cosa más para que todo esto funcione es evitar conflictos entre las URL del enrutador de la aplicación angular y las URL de su aplicación Java. Debe usar HashLocationStrategy. de una manera configúrelo en app.module.ts como a continuación
app.module.ts –
providers: [
provide: LocationStrategy, useClass: HashLocationStrategy ,
]
La estructura de carpetas para la aplicación angular se encuentra a continuación:
proyecto angular
- dist
- e2e
- módulos_nodo
- público
- src
- aplicación
- activos
- ambientes
- favicon.ico
- index.html
- main.ts
- polyfills.ts
- style.css
- tsconfig.json
- tipings.d.ts
- etcétera etcétera
- tmp
- .angular-cli.json
- .gitignore
- karma.conf.js
- package.json
- README.md
- tslint.json
- etcétera etcétera
Proyecto Maven –
- src
- principal
- Java
- recursos
- Aplicación Web
- WEB-INF
- web.xml
- principal
- proyecto angularcoloque su proyecto angular aquí)
- instalación_nodo
- pom.xml
Agregue la configuración de maven-frontend-plugin a pom.xml
angular-project
node_installation
com.github.eirslett
frontend-maven-plugin
1.0
$angular.project.location
$angular.project.nodeinstallation
install node and npm
install-node-and-npm
v6.10.0
3.10.10
npm install
npm
install
npm build
npm
run build
org.apache.maven.plugins
maven-resources-plugin
2.4.2
default-copy-resources
process-resources
copy-resources
true
$project.build.directory/$project.artifactId-$project.version/
$project.basedir/$angular.project.location/dist
Como el complemento anterior llama ‘npm run build’ internamente, asegúrese de que package.json debe tener el comando de compilación en el script como se muestra a continuación:
package.json
"scripts":
-----//-----,
"build": "ng build --prod",
-----//------
index.html siempre debe cargarse cuando alguien accede a la aplicación desde el navegador, por eso conviértalo en un archivo de bienvenida. Para los servicios web, digamos que tenemos la ruta / rest-services / * lo explicaremos más adelante.
web.xml –
index.html
restservices
/restservices/*
La configuración anterior es suficiente si su aplicación no tiene ninguna ruta de contexto y está implementada en la ruta raíz del servidor. Pero si su aplicación tiene una ruta de contexto como http: // localhost: 8080 / myapplication /, haga cambios también en el archivo index.html –
angular-project / src / index.html: aquí document.location será mi aplicación / (la ruta de contexto de su aplicación de lo contrario / si la aplicación no tiene una ruta de contexto)
El propósito de hacer de la ruta de contexto una ruta base para la aplicación angular es que cada vez que realice una llamada http ajax desde angular, antepondrá la ruta base a la URL. por ejemplo, si intento llamar a ‘restservices / persons’, en realidad hará llamadas a ‘http: // localhost: 8080 / myapplication / restservices / persons’
index.html
E2E
Después de todos los cambios anteriores una vez que se ejecuta mvn clean package creará la guerra requerida. Compruebe si todo el contenido de la carpeta angular ‘dist’ está en la raíz del archivo war.
Sección de Reseñas y Valoraciones
Nos encantaría que puedieras difundir este post si te fue de ayuda.