Create Angular 6+ Applications Working with Local Resources
|Product||Progress® Telerik® Reporting|
How can I integrate the Telerik Angular Report Viewer in an Angular 6 or higher application that works with local resources and doesn't reference any CDNs?
After upgrading to Angular 6, the
angular-cli.json is replaced with the
In addition, the local stylesheet which, by default, represents CDN links, must be loaded as local files that should be placed in the
assets folder. For more information, refer to the Unable to load the CSS file in Angular 6 applications Stackoverflow thread.
You need to download the stylesheet files (e.g.
kendo.blueopal.min.css), for example, from the corresponding CDNs and save them in the
src\assets folder of the Angular application.
Then, you have to load the styles in the
index.html of the application from the local folder like shown below:
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>DreamApp</title> <base href="/"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="icon" type="image/x-icon" href="favicon.ico"> <link rel="stylesheet" type="text/css" href="assets/kendo.common.min.css"> <link rel="stylesheet" type="text/css" href="assets/kendo.blueopal.min.css"> </head> <body> <app-root></app-root> </body> </html>
To download the sample application, go to our Angular 6 Sample.