Flutter辅助开发工具插件sidekick的使用

发布于 1周前 作者 caililin 来自 Flutter

Flutter辅助开发工具插件Sidekick的使用

什么是Sidekick?

重复的命令行任务可以通过多种方式组织：README文件、bash脚本、别名、运行配置、CI/CD管道等。但所有这些方法都有各自的缺点。更好的方法是创建一个针对项目的定制CLI。

Sidekick CLI生成器帮助你做到这一点！

自定义Sidekick CLI的优点：

  • 内嵌文档：命令行内的命令文档，不再担心过时的文档。
  • 易用语言：用Dart编写命令而不是复杂的Bash魔法。
  • 可测试/可调试：更容易进行测试和调试。
  • 项目范围：只包含你需要的命令。
  • 通过仓库共享CLI：新团队成员可以轻松安装和使用。

开始使用 - 为你的项目生成自己的Sidekick CLI

创建自己的Sidekick CLI很简单。按照以下简单步骤开始：

安装Sidekick CLI生成器

确保你已经安装了sidekick CLI生成器（这个包）。

dart pub global activate sidekick

初始化新的Sidekick CLI

导航到你的项目目录并运行以下命令来初始化一个新的Sidekick CLI：

sidekick init

CLI生成器将引导你完成设置过程。你需要提供一些信息（例如CLI的名称），然后就完成了！

你现在可以通过命令行调用它来运行你自己的Sidekick CLI。

全局安装Sidekick CLI并启用Tab补全

为了让Sidekick CLI在系统上的任何地方都可用，并启用方便的Tab补全，请运行以下命令：

<your-cli-name> sidekick install-global

现在重新启动你的终端或重新加载你的shell配置文件（例如source ~/.bashrc或source ~/.zshrc），你可以从任何地方运行CLI并使用Tab补全。

可用的默认命令和插件

Sidekick CLI附带了一组默认命令，可以帮助你快速上手。此外，它还支持可以轻松集成以扩展其功能的插件。

默认命令

以下是新生成的Sidekick CLI中可用的一些命令：

  • deps：获取所有包（包括嵌套包）的依赖项。
  • format：格式化所有Dart文件（包括嵌套包）。
  • sidekick create-command：创建一个新的命令模板并将其添加到你的CLI。
  • sidekick plugins create：从某些模板创建一个新的Sidekick插件。
  • sidekick plugins install：从pub.dev/Github/本地路径安装一个Sidekick插件到你的CLI。

推荐插件

增强你的Sidekick CLI的推荐插件：

你可以在这里找到所有可用的Sidekick插件。

你可以在这里找到与Sidekick相关的所有其他包。

使用以下命令安装插件到你的CLI：

<your-cli-name> sidekick plugins install <plugin-name>

学习更多关于Sidekick的内容

如果你有兴趣深入了解Sidekick并发现高级技巧和技术，请观看我们的综合演讲：

示例Demo

下面是一个简单的示例，展示如何创建和使用一个基本的Sidekick CLI：

创建一个新的Sidekick CLI

  1. 在项目目录中运行以下命令：

    sidekick init my_cli

    这将创建一个新的CLI名为my_cli。

  2. 添加一个新的命令：

    my_cli sidekick create-command greet

    这将在lib/commands/greet.dart中创建一个新的命令文件。

  3. 编辑greet.dart文件，添加以下代码：

    import 'package:sidekick_core/sidekick_core.dart';

class GreetCommand extends Command {
  @override
  final String description = 'Greets the user';

  @override
  final String name = 'greet';

  @override
  void run() {
    print('Hello, welcome to Sidekick!');
  }
}

void main(List<String> args) {
  GreetCommand().run();
}

  4. 运行命令：

    my_cli greet

    输出：

    Hello, welcome to Sidekick!

通过这种方式，你可以根据需要创建和管理多个命令，简化开发流程。希望这个示例能帮助你更好地理解和使用Sidekick！


更多关于Flutter辅助开发工具插件sidekick的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

Harmonyos Next教程
1 回复

更多关于Flutter辅助开发工具插件sidekick的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然，以下是如何在Flutter项目中使用Sidekick插件的一些代码案例和说明。Sidekick是一个流行的Flutter和Dart开发工具插件，它提供了丰富的功能来加速开发过程，包括代码生成、模板管理、项目配置等。虽然Sidekick本身可能不是一个直接在代码中引用的库，但它是通过IDE（如VSCode或Android Studio）的插件形式提供服务。

安装Sidekick插件

首先，你需要在你的IDE中安装Sidekick插件。以下是在VSCode中安装的方法：

  1. 打开VSCode。
  2. 进入扩展市场（Extensions），搜索“Flutter Sidekick”。
  3. 点击安装（Install）按钮。

使用Sidekick生成代码

一旦安装了Sidekick插件，你就可以开始使用它来生成代码了。例如，生成一个Flutter的Bloc模式的基本结构：

生成Bloc和Event类

假设你正在开发一个计数器应用，你可以使用Sidekick快速生成Bloc和Event类。

  1. 在你的项目中，右键点击lib文件夹。
  2. 选择“Flutter Sidekick” > “Generate” > “Bloc”。
  3. 在弹出的对话框中，输入Bloc的名称，例如CounterBloc。
  4. Sidekick将自动为你生成counter_bloc.dart、counter_event.dart和counter_state.dart文件。

生成的代码可能类似于：

counter_event.dart

part of 'counter_bloc.dart';

@immutable
abstract class CounterEvent {}

class IncrementEvent extends CounterEvent {}
class DecrementEvent extends CounterEvent {}

counter_state.dart

part of 'counter_bloc.dart';

class CounterState {
  final int count;

  CounterState({required this.count});

  factory CounterState.initial() => CounterState(count: 0);

  CounterState copyWith({int? count}) {
    return CounterState(
      count: count ?? this.count,
    );
  }

  @override
  bool operator ==(Object other) {
    if (identical(this, other)) return true;
    final listEquals = const DeepCollectionEquality().equals;

    return other is CounterState && listEquals(other.count, count);
  }

  @override
  int get hashCode => count.hashCode;
}

counter_bloc.dart

import 'package:bloc/bloc.dart';
import 'package:equatable/equatable.dart';
part 'counter_event.dart';
part 'counter_state.dart';

class CounterBloc extends Bloc<CounterEvent, CounterState> {
  CounterBloc() : super(CounterState.initial());

  @override
  Stream<CounterState> mapEventToState(CounterEvent event) async* {
    if (event is IncrementEvent) {
      yield state.copyWith(count: state.count + 1);
    } else if (event is DecrementEvent) {
      yield state.copyWith(count: state.count - 1);
    }
  }
}

使用Sidekick管理模板

Sidekick还允许你创建和管理自己的代码模板。例如，你可以创建一个自定义的Widget模板来加速UI组件的开发。

  1. 打开Sidekick的配置（通常在VSCode中通过命令面板搜索“Flutter Sidekick: Open Configuration”）。
  2. 添加一个新的模板，例如一个自定义的Button组件模板。
{
  "templates": [
    {
      "name": "MyCustomButton",
      "description": "A custom button widget",
      "content": [
        "import 'package:flutter/material.dart';",
        "",
        "class MyCustomButton extends StatelessWidget {",
        "  final String text;",
        "  final VoidCallback onPressed;",
        "",
        "  const MyCustomButton({Key? key, required this.text, required this.onPressed}) : super(key: key);",
        "",
        "  @override",
        "  Widget build(BuildContext context) {",
        "    return ElevatedButton(",
        "      onPressed: onPressed,",
        "      child: Text(text),",
        "    );",
        "  }",
        "}"
      ]
    }
  ]
}
  1. 保存配置后，你可以在项目中通过Sidekick快速生成这个自定义Button组件。

结论

虽然Sidekick不直接通过代码引用，但它作为一个强大的IDE插件，极大地简化了Flutter开发中的许多常见任务。通过安装和使用Sidekick插件，你可以快速生成代码模板、管理项目配置，从而加速开发流程。希望这些示例能帮助你更好地利用Sidekick来提升你的Flutter开发效率。

回到顶部