pattern-lab / patternlab-node

The Node version of Pattern Lab
http://patternlab.io
MIT License
2.05k stars 405 forks source link

False Positives for Missing Templates outside of `pattern-lab` #1116

Open joekarasek opened 4 years ago

joekarasek commented 4 years ago

I am using "@pattern-lab/cli": "^0.0.3", "@pattern-lab/core": "^3.0.5", "@pattern-lab/engine-twig-php": "^3.0.6", "@pattern-lab/starterkit-twig-demo": "^4.1.1", "@pattern-lab/uikit-workshop": "^1.0.8", on a linux docker container, on a mac (this behaviour occurs both in the container, as well as in OSX). Webpack is bundling my assets for me.

Expected Behavior

When I run a build of pattern-lab, it should only report a missing or broken reference if that twig template is actually missing.

Actual Behavior

For every twig file outside of the pattern-lab directory, I am getting an error along the following lines:

[watch:pl] Could not find pattern referenced with partial syntax components/breadcrumb/breadcrumb.twig.
[watch:pl]       This can occur when a pattern was renamed, moved, or no longer exists but it still referenced within a different template or within data as a link.

However, this file is present. Furthermore, the build does not fail and the patterns all render just fine.

Steps to Reproduce

Place a twig template outside of the pattern-lab directory. Add an appropriate namespace to reference to the config. Then reference that pattern from within pattern-lab. Run a build. It should report that file as missing, but still render its page in PL.

cbirdsong commented 4 years ago

I'm having this issue as well, I think. Here's my versions:

"@pattern-lab/cli": "^5.4.0",
"@pattern-lab/core": "^5.4.0",
"@pattern-lab/engine-twig-php": "^5.6.0",
"@pattern-lab/uikit-workshop": "^5.6.0",

I define these namespaces in my patternlab-config.json:

"namespaces": [
    {
        "id": "image",
        "recursive": true,
        "paths": [
            "images"
        ]
    },
    {
        "id": "icons",
        "recursive": true,
        "paths": [
            "templates/00-global/30-icons"
        ]
    },
    {
        "id": "atoms",
        "recursive": true,
        "paths": [
            "templates/10-atoms"
        ]
    },
    {
        "id": "molecules",
        "recursive": true,
        "paths": [
            "templates/20-molecules"
        ]
    },
    {
        "id": "organisms",
        "recursive": true,
        "paths": [
            "templates/30-organisms"
        ]
    },
    {
        "id": "templates",
        "recursive": true,
        "paths": [
            "templates/40-templates"
        ]
    },
    {
        "id": "pages",
        "recursive": true,
        "paths": [
            "templates/50-pages"
        ]
    },
    {
        "id": "macros",
        "recursive": true,
        "paths": [
            "source/_macros"
        ]
    }
],

The only ones I get complaints about are in icons, and every new icon I {% include %} in a twig file elsehwere in the project gets added to this list:

Could not find pattern referenced with partial syntax 30-icons/general/star.twig.
      This can occur when a pattern was renamed, moved, or no longer exists but it still referenced within a different template or within data as a link.
Could not find pattern referenced with partial syntax 30-icons/general/star.twig.
      This can occur when a pattern was renamed, moved, or no longer exists but it still referenced within a different template or within data as a link.
Could not find pattern referenced with partial syntax 30-icons/general/search.twig.
      This can occur when a pattern was renamed, moved, or no longer exists but it still referenced within a different template or within data as a link.
Could not find pattern referenced with partial syntax 30-icons/social/facebook.twig.
      This can occur when a pattern was renamed, moved, or no longer exists but it still referenced within a different template or within data as a link.
Could not find pattern referenced with partial syntax 30-icons/social/twitter.twig.
      This can occur when a pattern was renamed, moved, or no longer exists but it still referenced within a different template or within data as a link.
Could not find pattern referenced with partial syntax 30-icons/social/instagram.twig.
      This can occur when a pattern was renamed, moved, or no longer exists but it still referenced within a different template or within data as a link.
Could not find pattern referenced with partial syntax 30-icons/general/phone.twig.
      This can occur when a pattern was renamed, moved, or no longer exists but it still referenced within a different template or within data as a link.

I don't get these for other {% include %}s, so I wonder if it might have something to do with the icons namespace being one directory deeper?

houblon commented 4 years ago

@cbirdsong Seconding your observation that directory depth might have something to do with it, and thanks for it. I'm running the same package versions as you.

ex:

"namespaces": [
  {
    "id": "layouts",
    "recursive": true,
    "paths": [
      "source/_patterns/_layouts",      // doesn't produce the message
      "source/_patterns/test/_layouts", // produces it
      "source/_layouts"                 // also produces it, so it's not just subdirectories that are the issue
    ]
  }
]
ringods commented 4 years ago

I recently have been working on @pattern-lab/engine-twig, the JS version of Twig rendering. I also bump into these warnings. My observation so far is that it is related to Twig namespaces.

When I reference (@include, @extend, @embed) a template using a relative path directly in the patterns folder, it doesn't complain. When I reference it via a namespace, it does.

Probably, this is because the namespace support is something from the core Twig engine and not from PL.

gwagroves commented 2 years ago

The twig engine parses the files using regex (engine_twig_php.js > findPartials) to extract the names of included and embedded patterns. Patternlab uses the result to generate the pattern hierarchy.

Patternlab throws a warning when it can't find the pattern.