title: Telerik Kendo UI for JQuery Gantt Configuration for Angular 7 Web Application
body: <p>I am developing an Angular 7 web application which implements Angular Material controls throughout. I now need to include a Kendo UI for JQuery Gantt Chart. There appears to be two approaches to configuring this:</p>
  
  <ol>
  <li>Copy the <code>js</code> and the <code>styles</code> folders from the Kendo UI for JQuery installation directory into my <code>wwwroot</code> folder and reference them in my <code>index.html</code> file.</li>
  <li><code>npm install --save @progress/kendo-ui</code> and <code>npm install --save @progress/kendo-theme-material</code>.</li>
  </ol>
  
  <p>With approach 1, manually copying the folders into <code>wwwroot</code> the <code>js folder is approximately 77Mb and the</code>styles` folder approximately 20Mb. I don't want to be deploying these for every release.</p>
  
  <p>With approach 2, <code>npm install...</code> my webpack bundled <code>main.js</code> file is approximately 5.5Mb which is better, but on inspection still contains the entire Kendo UI suite of components when I only need the Gantt and it's dependant components. I also found that when I <code>npm install...</code> the Material theme and include a reference in my <code>angular.json</code> file, the styling on the components appears incorrect. The bars are coloured but almost everything else has no colour and the Gantt chart doesn't resize properly.</p>
  
  <p>My compromise has been to use the <code>npm install...</code> for the Kendo UI components and manually copy the required <code>.css</code> files into my <code>wwwroot</code> folder and reference them in my <code>index.html</code> file.</p>
  
  <p>Can anyone suggest a better approach for a lean, robust way of implementing these Gantt controls please?</p>