adding js and css to custom templates i created a custom module, which renderes a custom template. 

i followed this tutorial 

now basically i want to add, bootstrap, jquery, and some custom stling and scripts, 

I read this article, 

and i am not able to attach any files to my timplate..

my file structure: 

 - product_tree
  - templates  
     - products-tree.html.twig
  - src
     - Controller
         - productTreeController.php
  - js
     - bootstrap.min.js
     - customScripts.js
     - ...

  - css
     - customStyles.css
     - bootstrap.min.css
     - ...

  - product_tree.libraries.yml
  - product_tree.info.yml
  - product_tree.module


this is my libraries file:

# producttree.libraries.yml
product-tree-libraries:
 version: 1.x
  css:
   theme:
    css/customStyles.css: {}
  js:
   js/customScripts.js: {}
  dependencies:
   - core/jquery


this is my hook:

function product_tree_theme($existing, $type, $theme, $path) {
  return array(
    'products_tree' =&gt; array(
      'variables' =&gt; array('items' =&gt; array(), 'title' =&gt; '')
    )
  );
}


i tried attaching it through the renfer array 

$build =  array(
    'page' =&gt; array (
        '#theme' =&gt; 'products_tree',
        '#items' =&gt; $items,
        '#title' =&gt; 'products', 
        '#attached' =&gt; array(
            'library' =&gt; array(
              'product_tree/product-tree-libraries',
            ),
        ),
    )
);


and in the twig template:

{{ attach_library('product_tree/product-tree-libraries') }}


but still no luck,

in the twig i call the css and scripts 

&lt;link href="css/style.css" rel="stylesheet"&gt;


i dont know if that is needed, but i tried with and with out, when i include it, i see in the browser inspector that the css file being uploaded, but then "canceled"



can any one tell me what should i do? or what am i doing wrong ?

EDIT:
in the controller, I am renderiung the page like this: 

$items = array(
    array('name' =&gt; 'product one'),
    array('name' =&gt; 'product two'),
    array('name' =&gt; 'product three'),
    array('name' =&gt; 'product four')
);  
$build =  array(
    'page' =&gt; array (
        '#theme' =&gt; 'products_tree',
        '#items' =&gt; $items,
        '#title' =&gt; 'products', 
    )
);

$html = \Drupal::service('renderer')-&gt;renderRoot($build);
$response = new Response();
$response-&gt;setContent($html);

return $response;


i made This according to this answer

because i want it to be separated from drupal.
maybe this is the problem?

when i use BareHtmlPageRenderer to render the page (according to this answer). i see drupal imports and the page looks more alive, but still my custom css and js are not there!
I Found the Solution for this.. and it is by using the BareHtmlPageRenderer (found it here) and then attach the files in the controller php file like this 

$build['#attached']['library'][] = 'product_tree/product-tree-libraries';


with out the attachments hook function.

so the controller would look like:

    $build =  array(
        'page' =&gt; array (
            '#theme' =&gt; 'products_tree',
            '#items' =&gt; $term_data,
            '#title' =&gt; 'products', 
        )
    );

    $build['#attached']['library'][] = 'product_tree/product-tree-libraries';



    $attachments = \Drupal::service('html_response.attachments_processor');
    $renderer = \Drupal::service('renderer');

    $bareHtmlPageRenderer = new BareHtmlPageRenderer($renderer, $attachments);

    $response = $bareHtmlPageRenderer-&gt;renderBarePage($build, 'Page Title', 'markup');
    return $response;


it could also be in the $build array it self i think.. but this way its better when looking at it..

and still no need for:

{{ attach_library('product_tree/product-tree-libraries') }}


Or

&lt;link href="css/style.css" rel="stylesheet"&gt;