I’m building my own theme to be used with Angular 4 and can’t tell where/why Drupal is deciding to import jQuery.
Here’s the code for my theme, loosely based off this Angular 1 theme:
ng.info.yml
name: ng type: theme libraries: - ng/base description: 'An theme that makes Angular do all the work' core: 8.x
ng.libraries.yml
base: version: 8.x js: js/inline.bundle.js: {} js/polyfills.bundle.js: {} js/styles.bundle.js: {} js/vendor.bundle.js: {} js/main.bundle.js: {}
ng.module
<?php function ng_theme() { return array( 'ng_view' => array( 'template' => 'view', 'variables' => array('title' => NULL), ), ); }
ng.routing.yml
ng.view: path: 'ng' defaults: _title: 'Drupal Angular' _controller: 'DrupalngControllerDrupalNgController::viewDrupalNg' requirements: _permission: 'access content'
src/Controller/DrupalNgController
namespace DrupalngController; use DrupalCoreControllerControllerBase; class DrupalNgController extends ControllerBase { public function viewDrupalNg() { $build['myelement'] = array( '#theme' => 'ng_view', ); $build['myelement']['#attached']['library'][] = 'ng/inline.bundle'; $build['myelement']['#attached']['library'][] = 'ng/polyfills.bundle'; $build['myelement']['#attached']['library'][] = 'ng/styles.bundle'; $build['myelement']['#attached']['library'][] = 'ng/vendor.bundle'; $build['myelement']['#attached']['library'][] = 'ng/main.bundle'; return $build; } }
templates/view.html.twig
<html{{ html_attributes }}> <head> <title>Angular app</title> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <meta name="HandheldFriendly" content="true" /> <meta name="apple-touch-fullscreen" content="YES" /> </head> <body> <app-root></app-root> </body> </html>