11ty/eleventy-plugin-vue

Does not work in @11ty/eleventy 2.0.1

Opened this issue · 1 comments

Maximvdw commented

Using version 0.8.0
Using tested node versions 16, 20

Error on startup when .vue file present:
Using cross-env ELEVENTY_EXPERIMENTAL=true eleventy --serve

[11ty] Problem writing Eleventy templates: (more in DEBUG output)
[11ty] The "id" argument must be of type string. Received undefined (via TypeError)
[11ty]
[11ty] Original error stack trace: TypeError [ERR_INVALID_ARG_TYPE]: The "id" argument must be of type string. Received undefined
[11ty]     at Module.require (node:internal/modules/cjs/loader:1304:3)
[11ty]     at require (node:internal/modules/helpers:179:18)
[11ty]     at EleventyVue.getComponent (D:\Data\workspace\...\node_modules\@11ty\eleventy-plugin-vue\EleventyVue.js:528:21)   
[11ty]     at Object.getInstanceFromInputPath (D:\Data\workspace\...\node_modules\@11ty\eleventy-plugin-vue\.eleventy.js:190:26)
[11ty]     at CustomEngine.getExtraDataFromFile (D:\Data\workspace\...\node_modules\@11ty\eleventy\src\Engines\Custom.js:143:33)
[11ty]     at async D:\Data\workspace\...\node_modules\@11ty\eleventy\src\TemplateContent.js:280:27
[11ty] Wrote 0 files in 0.09 seconds (v2.0.1)

Troubleshooting:

  1. The path returned by getJavaScriptComponentFile is undefined while localVuePath is defined as the .vue file. The vue file is not compiled to the cache and is not present in the mapping of vueFileToJavaScriptFilenameMap.

  2. When I rename the vue file to something else and start eleventy with serve - then change it back to a vue file - it will throw the error. After the error is thrown the files are compiled and added to vueFileToJavaScriptFilenameMap but too late.

  3. Compile https://github.com/11ty/eleventy-plugin-vue/blob/0.x/.eleventy.js#L224 is never called. The getInstanceFromInputPath is called before the compile function is executed

Assumption of issue:
runBundle is executed at the start. However, the listed files are empty https://github.com/11ty/eleventy-plugin-vue/blob/0.x/.eleventy.js#L145-L163 because changedVueFilesOnWatch is empty as it only populates these files after file changes on the inital start.

Maximvdw commented

To clarify : I get the same issue when using npm run sample in this repository.