I have a Rails app that has the languages English, French, and German. I have some JavaScript code that I need to translate. I used the i18n-js gem, but it doesn't work.

My setup:

Manifest.js:

//= require i18n
//= require i18n.js
//= require i18n/translations

config/application.rb:

config.i18n.available_locales = :de

I only want the German version right now, so this is correct.

config/i18n-js.yml:

 translations:
   - file: "app/assets/javascripts/i18n/translations.js"
     only: "*"
     pretty_print: true

Gemfile:

gem 'i18n-js'

Package.json:

 "i18n-js": "^3.8.0",

application.js:

import I18n from 'i18n-js'

window.I18n = I18n
I18n.defaultLocale = "de";
I18n.locale = "de";

My translations.js file looks like this:

I18n.translations || (I18n.translations = {});
I18n.translations["de"] = I18n.extend((I18n.translations["de"] || {}), {
  "activerecord": {
    "attributes": {
      "booking": {
        "comments": "Bemerkungen",
etc.

I can access the I18n object in the console, but as soon as I try to display a translation, it doesn't work:

Running rake tmp:clear and/or adding config.middleware.use I18n::JS::Middleware to my application.rb doesn't work.

Why isnt't it working?