11ty / eleventy-plugin-webc

Adds support for WebC *.webc files to Eleventy
https://www.11ty.dev/docs/languages/webc/
120 stars 10 forks source link

Allow npm: alias to resolve to node_modules in parent folder #70

Open redmagic opened 1 year ago

redmagic commented 1 year ago

I am trying to use webc components in an Nx monorepo. This means I do not have a ./node_modules in my eleventy project, but that the node_modules folder is located in the root of the monorepo.

I would like the npm: alias to support this.

The folder has been linked like so:

  "dependencies": {
      "@performance/webc": "libs/webc/src"
  }

Does not work:

    eleventyConfig.addPlugin(pluginWebc, {
        components: ['src/_components/**/*.webc', 'npm:@performance/webc/**/*.webc']
    });

Works:

    eleventyConfig.addPlugin(pluginWebc, {
        components: ['src/_components/**/*.webc', '../../libs/webc/src/**/*.webc']
    });
filmaj commented 3 months ago

I have the same issue. My eleventy project is in a public/ subdirectory relative to my entire web application project, but eleventy and other project dependencies as well as my project's package.json are in the root directory.

In my case I had trouble loading the is-land plugin (in fact, the is-land plugin code was quietly not being loaded at all) when I used the following eleventy configuration (taken straight from tugboat):

    eleventyConfig.addPlugin(pluginWebc, {
        components: [
            "./_components/**/*.webc",
            "npm:@11ty/is-land/*.webc"
        ]
    });

I then tried to change the above to:

    eleventyConfig.addPlugin(pluginWebc, {
        components: [
            "./_components/**/*.webc",
            "../node_modules/11ty/is-land/*.webc"
        ]
    });

... but that caused an exception to be raised during site building:

Invalid path ../node_modules/@11ty/is-land/is-land.js is not in the working directory. (via Error)

I was able to trace that code to this part of the 11ty/webc project - seems like there is a check to make sure that imports are always taken from subdirectories of the root of the eleventy project. When I added some logging inside isFileInProjectDirectory here is what came out:

working dir: /Users/filmaj/src/arc-oss-contributors/public
absolute file: /Users/filmaj/src/arc-oss-contributors/node_modules/@11ty/is-land/is-land.js

From my perspective, raising this exception when the working directory is not a prefix of the absolute file being imported seems unnecessary. To get my site building, I simply removed that check / exception, and things worked fine.

It would be great to go back to specifying "npm:@11ty/is-land/*.webc" as the component to load, but I think this code in the 11ty/webc repo makes an additional assumption about where the node_modules folder is relative to the project root. It would be nice if the webc repo could search up the file system tree for a package.json file in order to determine where that project root is, and then join the ./node_modules folder from that location instead. At least, that's what makes sense in my head as a relatively naive consumer of this plugin.