Import and use protobufs outside of lib directory – dart


I am trying to build a web application with with Flutter for the frontend, go for the backend and gRPC as the communication protocol. In an effort to avoid using identical protobufs in 2 different directories, I refactored the protobufs and compiled them into a third directory outside of the client and server folders (all within the same repo). Now I’m having trouble accessing the compiled dart protobufs from the client code. Here is my folder structure:

|-- client/
  |-- pubspec.yaml
|-- protos/
  |-- dart_protos/
    |-- .dart_tool/
    |-- .packages
    |-- cards.pb.dart
    |-- cards.pbenum.dart
    |-- cards.pbjson.dart
    |-- cards.pbserver.dart
    |-- pubspec.lock
    |-- pubscpec.yaml
  |-- go_protos/
  |-- cards.proto

|-- server/

Here is how I am defining my dependencies in my client/pubspec.yaml

    sdk: flutter
  recase: ^4.0.0
  search_choices: ^2.0.7
    path: ../protos/dart_protos

My protos/dart_protos/pubspec.yaml:

name: tcb_protos
  sdk: ">=2.0.0-dev.68.0 <3.0.0"
  protobuf: ^1.1.4
  protoc_plugin: ^19.3.1

And how I am importing the protobuf:

import 'package:tcb_protos/cards.pb.dart';

So I am running into a couple of issues:

  1. I am getting Target of URI hasn't been generated: 'package:tcb_protos/cards.pb.dart'. on the import
  2. I am unable to use the protobuf based on the import, and VSCode’s intellisense isn’t working on the package (which I am assuming is because either the package definition or import is wrong)

How can I use the protobuf in my Flutter widgets?


You need to have the proto .pb.dart files inside a lib/ folder.

I made a small example here:

If you want to have protos in different packages that reference each other, that is currently not supported:

Answered By – Sigurd Meldgaard

Answer Checked By – Candace Johnson (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *