Message Boards
problem with angular dependencies
Anonymous Anonymous, modified 2 Years ago.
problem with angular dependencies
Regular Member Posts: 127 Join Date: 9/16/19 Recent Posts
Hello.
I'm developing angular npm portlet with Liferay 7.0. I'm trying to add Angular materials to my project with this guide (https://material.angular.io/guide/getting-started) I have added @angular/animations to the package.json file and imported them in my app.module.ts.
Gradle build and deploy to the portal is success and nothing goes wrong during them, but once I navigate to portal site, I get following error in browser console
And catalinaout says
This problem occurs not only with @angular/material but some other npm dependencies also. If anyone has a solution or even hint for fixing this they are appreciated!
Thanks alot in advance
-Jani
I'm developing angular npm portlet with Liferay 7.0. I'm trying to add Angular materials to my project with this guide (https://material.angular.io/guide/getting-started) I have added @angular/animations to the package.json file and imported them in my app.module.ts.
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
import { FormComponent } from './form/form.component';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { MatExpansionModule } from '@angular/material/expansion';
@NgModule({
imports: [
BrowserModule,
FormsModule,
NoopAnimationsModule
],
declarations: [
AppComponent,
FormComponent
],
entryComponents: [AppComponent],
bootstrap: [],
providers: []
})
export class AppModule {
ngDoBootstrap() { }
}
"dependencies": {
"@angular/common": "4.2.6",
"@angular/compiler": "4.2.6",
"@angular/compiler-cli": "4.2.6",
"@angular/core": "4.2.6",
"@angular/forms": "4.2.6",
"@angular/http": "4.2.6",
"@angular/platform-browser": "4.2.6",
"@angular/platform-browser-dynamic": "4.2.6",
"@angular/platform-server": "4.2.6",
"@angular/router": "4.2.6",
"@angular/tsc-wrapped": "4.2.6",
"@angular/upgrade": "4.2.6",
"angular-in-memory-web-api": "0.3.2",
"core-js": "2.5.1",
"reflect-metadata": "0.1.10",
"rxjs": "5.4.1",
"zone.js": "0.8.17",
"@angular/material": "5.2.5",
"@angular/cdk": "5.2.5",
"@angular/animations": "5.2.10"
},
Gradle build and deploy to the portal is success and nothing goes wrong during them, but once I navigate to portal site, I get following error in browser console
GET http://localhost:8080/combo/?browserId=other&minifierType=&languageId=en_US&b=7004&t=1521557570840&palaute-angular@1.0.0.js 500 (Internal Server Error)
Refused to execute script from 'http://localhost:8080/combo/?browserId=other&minifierType=&languageId=en_US&b=7004&t=1521557570840&palaute-angular@1.0.0.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.
And catalinaout says
java.lang.IllegalArgumentException: Path palaute-angular@1.0.0.js does not start with a "/" character
at org.apache.catalina.core.ApplicationContext.getRequestDispatcher(ApplicationContext.java:454)
at org.apache.catalina.core.ApplicationContextFacade.getRequestDispatcher(ApplicationContextFacade.java:221)
at com.liferay.portal.servlet.ComboServlet.getResourceRequestDispatcher(ComboServlet.java:426)
at com.liferay.portal.servlet.ComboServlet.doService(ComboServlet.java:238)
at com.liferay.portal.servlet.ComboServlet.service(ComboServlet.java:86)
at javax.servlet.http.HttpServlet.service(HttpServlet.java:729)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:292)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:207)
at org.apache.tomcat.websocket.server.WsFilter.doFilter(WsFilter.java:52)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:240)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:207)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.doFilter(InvokerFilterChain.java:119)
at com.liferay.portal.kernel.servlet.BaseFilter.processFilter(BaseFilter.java:142)
at com.liferay.portal.servlet.filters.uploadservletrequest.UploadServletRequestFilter.processFilter(UploadServletRequestFilter.java:93)
at com.liferay.portal.kernel.servlet.BaseFilter.doFilter(BaseFilter.java:48)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.processDoFilter(InvokerFilterChain.java:207)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.doFilter(InvokerFilterChain.java:112)
at com.liferay.portal.kernel.servlet.BaseFilter.processFilter(BaseFilter.java:142)
at com.liferay.portal.servlet.filters.language.LanguageFilter.processFilter(LanguageFilter.java:82)
at com.liferay.portal.kernel.servlet.BaseFilter.doFilter(BaseFilter.java:48)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.processDoFilter(InvokerFilterChain.java:207)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.doFilter(InvokerFilterChain.java:112)
at com.liferay.portal.kernel.servlet.BaseFilter.processFilter(BaseFilter.java:142)
at com.liferay.portal.servlet.filters.gzip.GZipFilter.processFilter(GZipFilter.java:125)
at com.liferay.portal.kernel.servlet.BaseFilter.doFilter(BaseFilter.java:48)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.processDoFilter(InvokerFilterChain.java:207)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.doFilter(InvokerFilterChain.java:112)
at com.liferay.portal.kernel.servlet.BaseFilter.processFilter(BaseFilter.java:142)
at com.liferay.portal.servlet.filters.jsoncontenttype.JSONContentTypeFilter.processFilter(JSONContentTypeFilter.java:42)
at com.liferay.portal.kernel.servlet.BaseFilter.doFilter(BaseFilter.java:48)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.processDoFilter(InvokerFilterChain.java:207)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.doFilter(InvokerFilterChain.java:112)
at com.liferay.portal.kernel.servlet.BaseFilter.processFilter(BaseFilter.java:142)
at com.liferay.portal.sharepoint.SharepointFilter.processFilter(SharepointFilter.java:88)
at com.liferay.portal.kernel.servlet.BaseFilter.doFilter(BaseFilter.java:48)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.processDoFilter(InvokerFilterChain.java:207)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.doFilter(InvokerFilterChain.java:112)
at com.liferay.portal.kernel.servlet.BaseFilter.processFilter(BaseFilter.java:142)
at com.liferay.portal.servlet.filters.virtualhost.VirtualHostFilter.processFilter(VirtualHostFilter.java:265)
at com.liferay.portal.kernel.servlet.BaseFilter.doFilter(BaseFilter.java:48)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.processDoFilter(InvokerFilterChain.java:207)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.doFilter(InvokerFilterChain.java:112)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.processDirectCallFilter(InvokerFilterChain.java:188)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.doFilter(InvokerFilterChain.java:96)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.processDirectCallFilter(InvokerFilterChain.java:188)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.doFilter(InvokerFilterChain.java:96)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.processDirectCallFilter(InvokerFilterChain.java:168)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.doFilter(InvokerFilterChain.java:96)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.processDirectCallFilter(InvokerFilterChain.java:168)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.doFilter(InvokerFilterChain.java:96)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.processDirectCallFilter(InvokerFilterChain.java:188)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilterChain.doFilter(InvokerFilterChain.java:96)
at com.liferay.portal.kernel.servlet.filters.invoker.InvokerFilter.doFilter(InvokerFilter.java:99)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:240)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:207)
at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:212)
at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:106)
at org.apache.catalina.authenticator.AuthenticatorBase.invoke(AuthenticatorBase.java:502)
at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:141)
at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:79)
at org.apache.catalina.valves.AbstractAccessLogValve.invoke(AbstractAccessLogValve.java:616)
at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:88)
at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:522)
at org.apache.coyote.http11.AbstractHttp11Processor.process(AbstractHttp11Processor.java:1095)
at org.apache.coyote.AbstractProtocol$AbstractConnectionHandler.process(AbstractProtocol.java:672)
at org.apache.tomcat.util.net.NioEndpoint$SocketProcessor.doRun(NioEndpoint.java:1500)
at org.apache.tomcat.util.net.NioEndpoint$SocketProcessor.run(NioEndpoint.java:1456)
at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1149)
at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:624)
at org.apache.tomcat.util.threads.TaskThread$WrappingRunnable.run(TaskThread.java:61)
at java.lang.Thread.run(Thread.java:748)
08:37:29,430 ERROR [http-nio-8080-exec-5][status_jsp:907] Path palaute-angular@1.0.0.js does not start with a "/" character
This problem occurs not only with @angular/material but some other npm dependencies also. If anyone has a solution or even hint for fixing this they are appreciated!
Thanks alot in advance
-Jani
Ivan Zaera, modified 5 Years ago.
RE: problem with angular dependencies
Regular Member Posts: 119 Join Date: 10/1/13 Recent Posts
Hi Jani:
What are the versions of portal, blade, liferay-npm-bundler and any other tools you may be using?
Cheers,
Ivan
What are the versions of portal, blade, liferay-npm-bundler and any other tools you may be using?
Cheers,
Ivan
Anonymous Anonymous, modified 2 Years ago.
RE: problem with angular dependencies
Regular Member Posts: 127 Join Date: 9/16/19 Recent Posts
Hi Ivan!
Portal version: Liferay Community Edition Portal 7.0.4 GA5 (Wilberforce / Build 7004 / October 23, 2017)
Blade version: 3.0.0.201803301449
liferay-npm-bundler: 1.6.1 (package.json devDependecies)
liferay-npm-bundler-preset-angular: 1.6.1 (package.json devDependecies)
here is full package.json file content
Portal version: Liferay Community Edition Portal 7.0.4 GA5 (Wilberforce / Build 7004 / October 23, 2017)
Blade version: 3.0.0.201803301449
liferay-npm-bundler: 1.6.1 (package.json devDependecies)
liferay-npm-bundler-preset-angular: 1.6.1 (package.json devDependecies)
here is full package.json file content
{
"dependencies": {
"@angular/common": "4.2.6",
"@angular/compiler": "4.2.6",
"@angular/compiler-cli": "4.2.6",
"@angular/core": "4.2.6",
"@angular/forms": "4.2.6",
"@angular/http": "4.2.6",
"@angular/platform-browser": "4.2.6",
"@angular/platform-browser-dynamic": "4.2.6",
"@angular/platform-server": "4.2.6",
"@angular/router": "4.2.6",
"@angular/tsc-wrapped": "4.2.6",
"@angular/upgrade": "4.2.6",
"angular-in-memory-web-api": "0.3.2",
"core-js": "2.5.1",
"reflect-metadata": "0.1.10",
"rxjs": "5.4.1",
"zone.js": "0.8.17",
"@angular/material": "5.2.5",
"@angular/cdk": "5.2.5",
"@angular/animations": "5.2.10"
},
"devDependencies": {
"@types/angular": "1.6.32",
"@types/angular-animate": "1.5.8",
"@types/angular-cookies": "1.4.5",
"@types/angular-mocks": "1.5.11",
"@types/angular-resource": "1.5.14",
"@types/angular-route": "1.3.4",
"@types/angular-sanitize": "1.3.6",
"@types/jasmine": "2.5.53",
"@types/node": "8.0.31",
"babel-cli": "6.26.0",
"babel-preset-liferay-amd": "1.6.1",
"canonical-path": "0.0.2",
"concurrently": "3.5.0",
"http-server": "0.10.0",
"jasmine": "2.6.0",
"jasmine-core": "2.6.4",
"karma": "1.7.1",
"karma-chrome-launcher": "2.2.0",
"karma-cli": "1.0.1",
"karma-jasmine": "1.1.0",
"karma-jasmine-html-reporter": "0.2.2",
"karma-phantomjs-launcher": "1.0.4",
"liferay-npm-bundler": "1.6.1",
"liferay-npm-bundler-preset-angular": "1.6.1",
"lite-server": "2.3.0",
"lodash": "4.17.4",
"phantomjs-prebuilt": "2.1.15",
"protractor": "5.1.2",
"source-map-explorer": "1.5.0",
"tslint": "5.7.0",
"typescript": "2.5.2"
},
"main": "js/angular-loader.js",
"name": "palaute-angular",
"scripts": {
"build": "tsc && babel --source-maps -d build/resources/main/META-INF/resources src/main/resources/META-INF/resources && liferay-npm-bundler"
},
"version": "1.0.0"
Ivan Zaera, modified 5 Years ago.
RE: problem with angular dependencies
Regular Member Posts: 119 Join Date: 10/1/13 Recent Posts
Sorry, I forgot this thread :-(.
We have just released liferay-npm-bundler 2.0 which should make angular builds much more stable (specially when dealing with peer dependencies). To use it you need to make some modifications to your project, but we have a running example (for 7.1.0B2) in this repo:
https://github.com/izaera/liferay-npm-bundler-2-example
Also, have a look at these blog posts to get some background on what has changed since bundler 1:
https://web.liferay.com/web/ivan.zaera/blog/-/blogs/why-we-need-a-new-liferay-npm-bundler-1-of-3-
https://web.liferay.com/web/ivan.zaera/blog/-/blogs/why-we-need-a-new-liferay-npm-bundler-2-of-3-
https://web.liferay.com/web/ivan.zaera/blog/-/blogs/why-we-need-a-new-liferay-npm-bundler-3-of-3-
We have tested bundler 2 with several angular examples and everything is working way more stable than bundler 1. Of course, there can be errors, but bundler 2 is definitely better than 1 and should be used instead of it. And since you are at the beginning... :-)
Cheers,
Ivan
We have just released liferay-npm-bundler 2.0 which should make angular builds much more stable (specially when dealing with peer dependencies). To use it you need to make some modifications to your project, but we have a running example (for 7.1.0B2) in this repo:
https://github.com/izaera/liferay-npm-bundler-2-example
Also, have a look at these blog posts to get some background on what has changed since bundler 1:
https://web.liferay.com/web/ivan.zaera/blog/-/blogs/why-we-need-a-new-liferay-npm-bundler-1-of-3-
https://web.liferay.com/web/ivan.zaera/blog/-/blogs/why-we-need-a-new-liferay-npm-bundler-2-of-3-
https://web.liferay.com/web/ivan.zaera/blog/-/blogs/why-we-need-a-new-liferay-npm-bundler-3-of-3-
We have tested bundler 2 with several angular examples and everything is working way more stable than bundler 1. Of course, there can be errors, but bundler 2 is definitely better than 1 and should be used instead of it. And since you are at the beginning... :-)
Cheers,
Ivan