Why is Flutter not generating the internationalization files?

Question

I'm trying to follow the internationalization documentation in https://flutter.dev/docs/development/accessibility-and-localization/internationalization#dart-tools and https://docs.google.com/document/d/10e0saTfAv32OZLRmONy866vnaw0I2jwL8zukykpgWBc/edit#heading=h.upcu5w85cvc2 but it's not generating any files.

Basically it says to make these mods to the pub spec.yaml file:

dependencies:
  flutter:
    sdk: flutter
  flutter_localizations:
    sdk: flutter
  intl: ^0.17.0-nullsafety.2
flutter:
  generate: true

Then create a <project-root>/l10n.yaml file containing:

arb-dir: lib/l10n
template-arb-file: app_en.arb
output-localization-file: app_localizations.dart

And finally to create the app_en.arb with something like this:

{
  "@@locale": "en",

  "helloWorld": "Hello World!",
  "@helloWorld": {
    "description": "The conventional newborn programmer greeting"
  }
}

And from there the guides say that a flutter_gen/gen_l10n/app_localizations.dart file will be automatically generated.

Except that nothing happens. I'm working in Android Studio and did a pub get, and tried a flutter clean and flutter build ios and everything else I can't think of but nothing is building that file.

Any ideas?

Tibbs

For me, it was writing i10n instead of l10n for the file name and .yaml config name. – Overblouse

@Overblouse The name is indeed l10n (lowercase L) , not i10n. If that worked for you, that means you messed it up with the name somewhere else. – Mccaslin

OMG, I just noticed that my localization files were not being auto generated on app run because I had created the file l10n.yaml inside the lib/ folder. But it clearly says to the root directory of the Flutter project. I changed the location and now it works as expected. – Mccaslin

Answer 1

Ok. done some more digging and I've solved it. Basically the Flutter documentation is slightly out of date.

The files generated generated by flutter_localizations (by running flutter gen-l10n) are being generated, but they're in <project_dir>.dart_tools/flutter_gen/gen_l10n. Unless specified otherwise in the l10n.yaml, the generator creates a synthetic package that is automatically available to the project so there is no need for any further changes in pubspec.yaml.

Secondly, your main.dart has to look like this:

import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';

class MyApp extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      localizationsDelegates: AppLocalizations.localizationsDelegates,
      supportedLocales: AppLocalizations.supportedLocales,
      title: 'My app',
      home: ... ,
    );
  }
}

Two things here:

1. The importing of the app_localizations.dart generated file (which the docs do mention but perhaps not explain well) and ...
2. Changing the localizationsDelegates and supportedLocales. You don't need to list all the delegates and locales mentioned in the docs as the generated localisation files automatically include them. Just switch to the two properties of AppLocalizations.

PS

After writing the above I attempted to internationalise the app's title:

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      localizationsDelegates: AppLocalizations.localizationsDelegates,
      supportedLocales: AppLocalizations.supportedLocales,
      title: AppLocalizations.of(context).applicationTitle,
      home: ... ,
    );
  }

Epic fail - The reason is that at the time it goes to resolve the title, the delegates and locales have not yet been set so what comes back from AppLocalizations.of(context) is a null. Instead you need to change to the onGeneratedTitle like this:

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      localizationsDelegates: AppLocalizations.localizationsDelegates,
      supportedLocales: AppLocalizations.supportedLocales,
      onGenerateTitle: (context) => AppLocalizations.of(context).applicationTitle,
      home: ... ,
    );
  }
```.  

`onGeneratedTitle` is called after the widget is setup which means localisation is available.

Tibbs

I gave up the native solution and changed to use IDE plugin like (localizely.com/flutter-localization-workflow). Do Dart intl tools also generate translation code automatically? – Dabchick

Not that I can see. Nothing obviously in there about handling translations. After I got it working, I downloaded an app Babel which is an editor for *arb files. It's a little quirky, in places but on the whole seems to work well and I like the fact it automatically runs google translate for me. Kinda like cheating without having to learn the language first. Hopefully it's reasonable accurate :-) – Tibbs

Answer 2

Addition to @drekka answer,

You need to run

flutter gen-l10n

If it's not generated automatically.

Saskatchewan

Thank you! It is not so well documented as in my case translations were automatically generated but i wanted to generate them without having to run the app. – Beberg

actually when there are missing translations, running the app through vscode is not possible until generating the l10n files manually gets done, TY – Mouse

$ flutter gen-l10n Because l10n.yaml exists, the options defined there will be used instead. To use the command line arguments, delete the l10n.yaml file in the Flutter project. – Alchemist

Answer 3

Faced similar issue when needed to generate these files through CLI without IDE at all (on CircleCI).

First, you should have intl_utils either as project dependency or activated globally.

To install it as a dependency (and manage its version per project) - just add intl_utils: ^2.1.0 to the dependencies section of your pubspec.yaml (don't forget to set the version you need). After that, from the project directory run:

flutter gen-l10n --template-arb-file=intl_en.arb
flutter pub run intl_utils:generate

(change intl_en.arb to your actual .arb file name or omit the whole parameter in case it matches the default app_en.arb)

To activate intl_utils globally (and use a single version of intl_utils on all your projects), do the following:

dart pub global activate intl_utils 2.1.0

And then run this from the project directory:

flutter gen-l10n --template-arb-file=intl_en.arb
dart pub global run intl_utils:generate

In my case, since the project hasn't yet migrated to use null safety, having intl_utils as project dependency led to null safety issues, so the trick was to use intl_utils 1.9.0 globally.

Celebrate

How can you then use the text in the original case we use AppLocalizations.of(context).helloWorld – Pictorial

Answer 4

Run this on your terminal or command-line:
dart pub global activate intl_utils 2.1.0
OR
dart pub global run intl_utils:generate

Bluestone

Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center. – Anchorage

Answer 5

I've run into this same issue right now. I don't know why this is happening, but I've found this post providing the same information and decided to try using the plugin it mentions.

The plugin is called "Flutter Intl" and is available for Android Studio and VSCode. You'll need to install it in your IDE and run the "Flutter Intl: initialize" command. This action should create the "lib/generated" folder with all the needed boilerplate.

Lottery

Yep, I've seen that, but I need to build the app on Bitrise which means building without Android studio. So I don't think that will work. :-( – Tibbs

See my response above as to how to fix this. – Tibbs

i install plugin in android studio IDE but not getting "lib/generated" – Lynxeyed

Answer 6

Had the same problem. Accidentally found out that I had created l10n.yaml in the lib dir instead of base dir. Moved it where it should be, and everything worked!

Superelevation

lol I just noticed this was my issue right before reading your answer. – Mccaslin

Answer 7

If you add this code in pubspec.yaml it is automatically generated

flutter_intl:
  enabled: true
  class_name: AppLocalizations

Dalenedalenna

Answer 8

flutter pub cache clean helped in this case

Repent

Answer 9

If you have the intl plugin in your code editor (Android Studio) then you should have this generated folder (lib/generated/l10n.dart).

Run this command in your terminal

flutter pub run intl_utils:generate

then after it will be work.

Heliolatry

Answer 10

After some research, it seems that VsCode (for my case) doesn't see the recent update of the generated app_localizations.dart file.

To solve this issue, simply open the generated file located here :

.dart_tool/flutter_gen/gen_l10n/app_localizations.dart

You should see your app_localizations.dart file updated

As a reminder, after editing your .arb file, you need to launch flutter pub get to get the latest changes.

Draper

Answer 11

At home, there was a connection problem, I have tools > Flutter > flutter upgrade

Abdul

Answer 12

I had the same problem because I imported the project from another developer and none of the solutions helped me. You have to delete everything after adding the dependency and start the program once. Then this file is created. Only then can you import the file into the class and work with it.

Baudelaire

Answer 13

I had the same problem , I was using vs code, just restart vs code and everything will work just fine.

Paperback

Answer 14

For me the problem what is that vscode could not find the path for class, so I added import manually like this:

import 'package:flutter_gen/gen_l10n/app_localizations.dart';

Regine

Answer 15

Don't miss in pubspec.yaml

flutter:
  generate: true

Audsley