how theme/template connected/related to each other for example, I have:


module id: module_id (file: module_id.info.yml)
FieldType ID: FieldTypeID (file: /src/plugin/Field/FieldType/FieldType.php)
FieldWidget: FieldDefaultWidget (file: /src/plugin/Field/FieldWidget/FieldDefaultWidget.php)
FieldFormatter: FieldDefaultFormatter (file: /src/plugin/Field/FieldWidget/FieldDefaultFormatter.php)


and inside my field formatter:

public function viewElements(FieldItemListInterface $items, $langcode) {
    $elements = [];
    foreach ($items as $delta =&gt; $item) {
      $elements[$delta] = [
        '#theme' =&gt; 'my_field',
        '#type' =&gt; 'markup',
        // etc...
      ];
    }

    return $elements;
  }



I have file: my_field.module


with function:

function my_field_theme() {
  return array(
    'location_field' =&gt; array(
      'variables' =&gt; array(
        'x' =&gt; NULL,
        'y' =&gt; NULL,
        'z' =&gt; NULL,
      ),
      'template' =&gt; 'my_field',
    ),
  );
}



and I have template file: /templates/my_field.html.twig


as simple as:

&lt;section class="class"&gt;
  &lt;h2&gt;name&lt;/h2&gt;
  &lt;div class="cls" data-x="x" data-y="y" data-z="z"&gt;content&lt;/div&gt;
&lt;/section&gt;


with that, seems like i can't see my template, which i don't have any idea why?

how is theme or template name relate with the filename (or ID or anything)? - how are they connected each other?

what is the rule for that?

Thank you,

AnD
If your code is only in one module with the name module_id, then in
5. the file should be named module_id.module and the function module_id_theme()