title: Drupal 8 Custom Module Libraries
body: <p>I have the following 2 files in 2 different directoties in a custom module directory. </p>
  
  <p>modules/custom/calculator</p>
  
  <p>This is my info.yml file (calculator.info.yml)</p>
  
  <pre><code>name: calculator
  type: module
  description: Calculator
  core: 8.x
  package: Custom
  </code></pre>
  
  <p>My css is in  the directory modules/custom/calculator/css and js in the modules/custom/calculator/js directory</p>
  
  <p>My libaries file is this: (calculator.libraries.yml)</p>
  
  <pre><code>base-style:
    version: VERSION
    css:
      component:
        css/wunderpage.css: {}
    js:
      js/wunderpage.js: {}
      js/jquery.matchHeight-min.js: {}
  </code></pre>
  
  <p>I also have a calculator.module file :</p>
  
  <pre><code>&lt;?php
  
  /**
   * @file
   * Contains calculator.module..
   */
  
  use Drupal\Core\Routing\RouteMatchInterface;
  
  /**
   * Implements hook_help().
   */
  function calculator_help($route_name, RouteMatchInterface $route_match) {
    switch ($route_name) {
      // Main module help for the calculator module.
      case 'help.page.calculator':
        $output = '';
        $output .= '&lt;h3&gt;' . t('About') . '&lt;/h3&gt;';
        $output .= '&lt;p&gt;' . t('Calculator') . '&lt;/p&gt;';
        return $output;
  
      default:
    }
  
    function calculator_preprocess_page(&amp;$variables) {
      $variables['#attached']['library'][] = 'calculator/base-style';
    }
  }
  </code></pre>
  
  <p>Still my css and js etc is not being loaded. </p>
  
  <p>Somebody knows why my libraries are not being loaded?</p>