I18n Plugin: Cannot read properties of undefined (reading 'configFunction')

[dajuno]

Describe the bug

I tried to activate the new internationalization plugin with v2.0.0-canary.14. Simply adding it to the .eleventy.js file as explained on https://www.11ty.dev/docs/plugins/i18n/#add-to-your-configuration-file and running DEBUG=Eleventy* npx @11ty/eleventy@v2.0.0-canary.14 gives the following error:

[11ty] Eleventy CLI Fatal Error:
[11ty] Cannot read properties of undefined (reading 'configFunction') (via TypeError)
  Eleventy:EleventyErrorHandler (error stack): TypeError: Cannot read properties of undefined (reading 'configFunction')
  Eleventy:EleventyErrorHandler     at UserConfig._getPluginName (/home/david/dev/eleventy-base-blog/node_modules/@11ty/eleventy/src/UserConfig.js:357:14)
  Eleventy:EleventyErrorHandler     at TemplateConfig.processPlugins (/home/david/dev/eleventy-base-blog/node_modules/@11ty/eleventy/src/TemplateConfig.js:222:36)
  Eleventy:EleventyErrorHandler     at TemplateConfig.mergeConfig (/home/david/dev/eleventy-base-blog/node_modules/@11ty/eleventy/src/TemplateConfig.js:317:10)
  Eleventy:EleventyErrorHandler     at TemplateConfig.getConfig (/home/david/dev/eleventy-base-blog/node_modules/@11ty/eleventy/src/TemplateConfig.js:138:26)
  Eleventy:EleventyErrorHandler     at new Eleventy (/home/david/dev/eleventy-base-blog/node_modules/@11ty/eleventy/src/Eleventy.js:76:39)
  Eleventy:EleventyErrorHandler     at Object.<anonymous> (/home/david/dev/eleventy-base-blog/node_modules/@11ty/eleventy/cmd.js:70:16)
  Eleventy:EleventyErrorHandler     at Module._compile (node:internal/modules/cjs/loader:1120:14)
  Eleventy:EleventyErrorHandler     at Module._extensions..js (node:internal/modules/cjs/loader:1174:10)
  Eleventy:EleventyErrorHandler     at Module.load (node:internal/modules/cjs/loader:998:32)
  Eleventy:EleventyErrorHandler     at Module._load (node:internal/modules/cjs/loader:839:12) +0ms

I tried this for my own small project and for https://github.com/11ty/eleventy-base-blog Probably I missed something. I'm new to all this, please indulge me...

To Reproduce Steps to reproduce the behavior:

1. clone https://github.com/11ty/eleventy-base-blog
2. edit .eleventy.js, adding at the top

   const { EleventyI18nPlugin } = require("@11ty/eleventy");

   and in the body of module.exports = function(eleventyConfig) { ... }, add

   eleventyConfig.addPlugin(EleventyI18nPlugin, {
    defaultLanguage: "en",
   });

3. execute DEBUG=Eleventy* npx @11ty/eleventy@v2.0.0-canary.14
4. See error

Expected behavior

Project should have been built without error.

Environment:

• OS and Version: Linux
• Eleventy Version: 2.0.0-canary.14

[thinkverse]

This is a sort of an interesting one in that the version used by the config and what is used internally in your project i.e your .eleventy.js file, will be whatever version is specified as a dependency and installed in your node_modules. But the actual building/generating will happen with the version defined in npx.

This can be viewed by adding a piece of global data to your .eleventy.js that returns the version used by the config.

const Eleventy = require("@11ty/eleventy");

eleventyConfig.addGlobalData("config", () => {
  return { version: Eleventy.getVersion() };
});

Then you can output both versions to check which version is used to build and which is used by the config.

<meta name="build.version" content="{{ eleventy.version }}">
<meta name="config.version" content="{{ config.version }}">

When this is generated you'll either see both versions matching or not. Using your reproduction steps to check, shows two mismatching versions.

<meta name="build.version" content="2.0.0">
<meta name="config.version" content="1.0.1">

This means that when your .eleventy.js adds EleventyI18nPlugin as a plugin, and tries to merge and process the plugin config it cannot. Because EleventyI18nPlugin doesn't actually exist and is interpreted as undefined.

To solve this issue, install 2.0.0-canary.13 or above as a dependency in your project, preferably matching the version you use to generate your site.

npm install @11ty/eleventy@2.0.0-canary.14

[dajuno]

Thank you for the advice! In my case (maybe in addition to version conflicts), I had a dumb typo in name of the i18n plugin... it's working now.