Movatterモバイル変換


[0]ホーム

URL:


docs.flutter.dev uses cookies from Google to deliver and enhance the quality of its services and to analyze traffic.Learn more.

Skip to main content
Using packages

Using packages

Flutter supports using shared packages contributed by other developers to the Flutter and Dart ecosystems. This allows quickly building an app without having to develop everything from scratch.

Difference between packages and plugins

A plugin is atype of package—the full designation isplugin package, which is generally shortened toplugin.

Packages
At a minimum, a Dart package is a directory containing apubspec.yaml file. Additionally, a package can contain dependencies (listed in the pubspec), Dart libraries, apps, resources, tests, images, fonts, and examples. Thepub.dev site lists many packages—developed by Google engineers and generous members of the Flutter and Dart community— that you can use in your app.
Plugins
A plugin package is a special kind of package that makes platform functionality available to the app. Plugin packages can be written for Android (using Kotlin or Java), iOS (using Swift or Objective-C), web, macOS, Windows, Linux, or any combination thereof. For example, a plugin might provide Flutter apps with the ability to use a device's camera.

Watch on YouTube in a new tab: "Packages versus plugins | Decoding Flutter"

Existing packages enable many use cases—for example, making network requests (http), navigation/route handling (go_router), integration with device APIs (url_launcher andbattery_plus), and using third-party platform SDKs like Firebase (FlutterFire).

To write a new package, seedeveloping packages. To add assets, images, or fonts, whether stored in files or packages, seeAdding assets and images.

Using packages

#

The following section describes how to use existing published packages.

Searching for packages

#

Packages are published topub.dev.

TheFlutter landing page on pub.dev displays top packages that are compatible with Flutter (those that declare dependencies generally compatible with Flutter), and supports searching among all published packages.

TheFlutter Favorites page on pub.dev lists the plugins and packages that have been identified as packages you should first consider using when writing your app. For more information on what it means to be a Flutter Favorite, see theFlutter Favorites program.

You can also browse the packages on pub.dev by filtering onAndroid,iOS,web,Linux,Windows,macOS, or any combination thereof.

Adding a package dependency to an app usingflutter pub add

#

To add the packagecss_colors to an app:

  1. Use thepub add command from inside the project directory

    • flutter pub add css_colors
  2. Import it

    • Add a correspondingimport statement in the Dart code.
  3. Stop and restart the app, if necessary

    • If the package brings platform-specific code (Kotlin/Java for Android, Swift/Objective-C for iOS), that code must be built into your app. Hot reload and hot restart only update the Dart code, so a full restart of the app might be required to avoid errors likeMissingPluginException when using the package.

Adding a package dependency to an app

#

To add the packagecss_colors to an app:

  1. Depend on it

    • Open thepubspec.yaml file located inside the app folder, and addcss_colors: ^1.0.0 underdependencies.
  2. Install it

    • From the terminal: Runflutter pub get.
      OR
    • From VS Code: ClickGet Packages located in right side of the action ribbon at the top ofpubspec.yaml indicated by the Download icon.
    • From Android Studio/IntelliJ: ClickPub get in the action ribbon at the top ofpubspec.yaml.
  3. Import it

    • Add a correspondingimport statement in the Dart code.
  4. Stop and restart the app, if necessary

    • If the package brings platform-specific code (Kotlin/Java for Android, Swift/Objective-C for iOS), that code must be built into your app. Hot reload and hot restart only update the Dart code, so a full restart of the app might be required to avoid errors likeMissingPluginException when using the package.

Removing a package dependency to an app usingflutter pub remove

#

To remove the packagecss_colors from an app:

  1. Use thepub remove command from inside the project directory
    • flutter pub remove css_colors

TheInstalling tab, available on any package page on pub.dev, is a handy reference for these steps.

For a complete example, see thecss_colors example below.

Conflict resolution

#

Suppose you want to usesome_package andanother_package in an app, and both of these depend onurl_launcher, but in different versions. That causes a potential conflict. The best way to avoid this is for package authors to useversion ranges rather than specific versions when specifying dependencies.

yaml
dependencies:  url_launcher:^5.4.0    # Good, any version >= 5.4.0 but < 6.0.0  image_picker:'5.4.3'   # Not so good, only version 5.4.3 works.

Ifsome_package declares the dependencies above andanother_package declares a compatibleurl_launcher dependency like'5.4.6' or^5.5.0, pub resolves the issue automatically. Platform-specific dependencies onGradle modules and/orCocoaPods are solved in a similar way.

Even ifsome_package andanother_package declare incompatible versions forurl_launcher, they might actually useurl_launcher in compatible ways. In this situation, the conflict can be resolved by adding a dependency override declaration to the app'spubspec.yaml file, forcing the use of a particular version.

For example, to force the use ofurl_launcher version5.4.0, make the following changes to the app'spubspec.yaml file:

yaml
dependencies:  some_package:  another_package:dependency_overrides:  url_launcher:'5.4.0'

If the conflicting dependency is not itself a package, but an Android-specific library likeguava, the dependency override declaration must be added to Gradle build logic instead.

To force the use ofguava version28.0, make the following changes to the app'sandroid/build.gradle file:

groovy
configurations.all {    resolutionStrategy {        force'com.google.guava:guava:28.0-android'    }}

CocoaPods doesn't currently offer dependency override functionality.

Developing new packages

#

If no package exists for your specific use case, you canwrite a custom package.

Managing package dependencies and versions

#

To minimize the risk of version collisions, specify a version range in thepubspec.yaml file.

Package versions

#

All packages have a version number, specified in the package'spubspec.yaml file. The current version of a package is displayed next to its name (for example, see theurl_launcher package), as well as a list of all prior versions (seeurl_launcher versions).

To ensure that the app doesn't break when you update a package, specify a version range using one of the following formats.

  • Ranged constraints: Specify a minimum and maximum version.

    yaml
    dependencies:  url_launcher:'>=5.4.0 <6.0.0'
  • Ranged constraints using thecaret syntax: Specify the version that serves as the inclusive minimum version. This covers all versions from that version to the next major version.

    yaml
    dependencies:  collection:'^5.4.0'

    This syntax means the same as the one noted in the first bullet.

To learn more, check out thepackage versioning guide.

Updating package dependencies

#

When runningflutter pub get for the first time after adding a package, Flutter saves the concrete package version found in thepubspec.locklockfile. This ensures that you get the same version again if you, or another developer on your team, runflutter pub get.

To upgrade to a new version of the package, for example to use new features in that package, runflutter pub upgrade to retrieve the highest available version of the package that is allowed by the version constraint specified inpubspec.yaml. Note that this is a different command fromflutter upgrade orflutter update-packages, which both update Flutter itself.

Dependencies on unpublished packages

#

Packages can be used even when not published on pub.dev. For private packages, or for packages not ready for publishing, additional dependency options are available:

Path dependency

A Flutter app can depend on a package using a file systempath: dependency. The path can be either relative or absolute. Relative paths are evaluated relative to the directory containingpubspec.yaml. For example, to depend on a package, packageA, located in a directory next to the app, use the following syntax:

yaml
  dependencies:  packageA:    path:../packageA/
Git dependency

You can also depend on a package stored in a Git repository. If the package is located at the root of the repo, use the following syntax:

yaml
  dependencies:    packageA:      git:        url:https://github.com/flutter/packageA.git
Git dependency using SSH

If the repository is private and you can connect to it using SSH, depend on the package by using the repo's SSH url:

yaml
  dependencies:    packageA:      git:        url:git@github.com:flutter/packageA.git
Git dependency on a package in a folder

Pub assumes the package is located in the root of the Git repository. If that isn't the case, specify the location with thepath argument. For example:

yaml
dependencies:  packageA:    git:      url:https://github.com/flutter/packages.git      path:packages/packageA

Finally, use theref argument to pin the dependency to a specific git commit, branch, or tag. For more details, seePackage dependencies.

Examples

#

The following examples walk through the necessary steps for using packages.

Example: Using the css_colors package

#

Thecss_colors package defines color constants for CSS colors, so use the constants wherever the Flutter framework expects theColor type.

To use this package:

  1. Create a new project calledcssdemo.

  2. Openpubspec.yaml, and add thecss-colors dependency:

    yaml
    dependencies:  flutter:    sdk:flutter  css_colors:^1.0.0
  3. Runflutter pub get in the terminal, or clickGet Packages in VS Code.

  4. Openlib/main.dart and replace its full contents with:

    dart
    import 'package:css_colors/css_colors.dart';import 'package:flutter/material.dart';void main() {  runApp(const MyApp());}class MyApp extends StatelessWidget {  const MyApp({super.key});  @override  Widget build(BuildContext context) {    return const MaterialApp(home:DemoPage());  }}class DemoPage extends StatelessWidget {  const DemoPage({super.key});  @override  Widget build(BuildContext context) {    return Scaffold(body:Container(color:CSSColors.orange));  }}
  1. Run the app. The app's background should now be orange.

Example: Using the url_launcher package to launch the browser

#

Theurl_launcher plugin package enables opening the default browser on the mobile platform to display a given URL, and is supported on Android, iOS, web, Windows, Linux, and macOS. This package is a special Dart package called aplugin package (orplugin), which includes platform-specific code.

To use this plugin:

  1. Create a new project calledlaunchdemo.

  2. Openpubspec.yaml, and add theurl_launcher dependency:

    yaml
    dependencies:  flutter:    sdk:flutter  url_launcher:^5.4.0
  3. Runflutter pub get in the terminal, or clickGet Packages get in VS Code.

  4. Openlib/main.dart and replace its full contents with the following:

    dart
    import 'package:flutter/material.dart';import 'package:path/path.dart' as p;import 'package:url_launcher/url_launcher.dart';void main() {  runApp(const MyApp());}class MyApp extends StatelessWidget {  const MyApp({super.key});  @override  Widget build(BuildContext context) {    return const MaterialApp(home:DemoPage());  }}class DemoPage extends StatelessWidget {  const DemoPage({super.key});  void launchURL() {    launchUrl(p.toUri('https://flutter.dev'));  }  @override  Widget build(BuildContext context) {    return Scaffold(      body:Center(        child:ElevatedButton(          onPressed: launchURL,          child:const Text('Show Flutter homepage'),        ),      ),    );  }}
  5. Run the app (or stop and restart it, if it was already running before adding the plugin). ClickShow Flutter homepage. You should see the default browser open on the device, displaying the homepage for flutter.dev.

Was this page's content helpful?
Thank you for your feedback!
Provide details
Thank you for your feedback! Please let us know what we can do to improve.
Provide details

Unless stated otherwise, the documentation on this site reflects the latest stable version of Flutter. Page last updated on 2025-02-12.View sourceorreport an issue.


[8]ページ先頭

©2009-2025 Movatter.jp