Flutter模板生成插件flutter_templify的使用

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

Flutter模板生成插件flutter_templify的使用

flutter_templify 是一个可定制的CLI工具，用于通过YAML定义管理Flutter应用模板。它简化了新项目的创建过程，并支持跨平台开发。

目录

特性

  • 模板管理：轻松定义和重用Flutter项目模板。
  • 平台特定生成：在项目创建时指定Android、iOS或Web等平台。
  • 组织良好的目录结构：以预定义的文件夹和文件布局生成项目。
  • 自定义元数据：支持自定义项目名称、包标识符和组织域。
  • 交互式CLI：用户友好的提示，用于动态项目定制。
  • 跨平台支持：在Windows、macOS和Linux上无缝工作。
  • 模板共享：方便地导入/导出模板，以便快速分享。
  • 动态提示：通过定义额外变量来自定义模板。
  • 自定义创建后命令：指定在项目创建后运行的自定义命令。

安装

  1. 使用Dart的pub工具全局激活包：

    dart pub global activate flutter_templify

  2. 更新环境变量FLUTTER_TEMPLIFY_PATH指向保存模板的路径。如何设置环境变量。

激活后，您可以在终端中直接使用flutter_templify命令。

使用方法

1. 定义您的模板

使用简单的YAML文件配置来定义模板：

name: "awesome-template"
description: "A basic template for MVP Flutter apps"
domain: micazi.dev
platforms:
  - ios
  - android
  - web
isPackage: false

structure:
  - main.env
  - anotherFile.MD
  - pubspec.yaml: "src/templates/pubspec.yaml"
  - lib/:
      - screens/
      - models/
      - widgets/
  - assets/:
      - images/
      - fonts/:
          - someFont/

查看所有已定义的模板：

flutter_templify templates ls

2. 创建新的Flutter项目

快速启动并运行新项目：

flutter_templify create -t awesome-template -n my_awesome_project

无论终端位置在哪里，都会在当前位置创建一个新的项目文件夹，结构化、验证并准备好让您开始编码。

3. 自定义您的提示

使用extra_prompted_vars部分定义将在项目创建过程中提示的其他变量：

extra_prompted_vars:
  api_url:
    title: "API URL"
    description: "Enter the base API URL for the project."
    default: "https://api.example.com"
    pattern: "^(https?:\/\/).+"
  enable_analytics:
    title: "Enable Analytics?"
    description: "Would you like to enable analytics in your app? (yes/no)"
    default: "yes"

这些变量会在运行时提示输入，并可以动态注入到项目文件中。

示例Demo

1. 创建自己的模板

下面是一个使用flutter_templify配置格式定义Flutter应用程序模板的例子：

name: "awesome-template"
description: "A basic template for MVP Flutter apps"
version: "1.0.0"
platforms:
  - ios
  - android
  - web
isPackage: false

structure:
  main.env: "./ref/env/main.env.example"
  anotherFile.md: "./ref/docs/anotherFile.md.example"
  pubspec.yaml: "abs:/path/to/templates/pubspec.yaml"
  lib/:
    screens/
    models/
    widgets/
  assets/:
    images/
    fonts/:
      someFont/

2. 将模板添加到本地仓库

创建模板YAML文件后，使用以下命令将其添加到本地flutter_templify仓库：

flutter_templify templates add -f path/to/template.yaml

3. 创建您的项目！

一旦模板被添加，您可以使用它来生成一个新的Flutter项目：

flutter_templify create -t awesome-template -n awesome_project

关键点：

  • 必填字段：name, description, 和 version 字段是必需的，确保模板正确配置。

  • 结构部分中的路径：使用相对路径（如./ref/...）引用与YAML文件同目录或子目录中的文件或文件夹；使用绝对路径前缀abs:引用系统其他位置的文件或文件夹（如abs:/path/to/...）。

  • 模板中的变量：不要在extra_prompted_vars部分重新定义project_name和domain_name。对于自定义变量，可以使用extra_prompted_vars来提示用户在项目创建期间填写。

  • 自定义创建后命令：可以使用custom_commands字段定义项目创建后的运行命令，例如：

    custom_commands:
  - "flutter pub get"
  - "flutter analyze"

更多关于Flutter模板生成插件flutter_templify的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

Harmonyos Next教程
1 回复

更多关于Flutter模板生成插件flutter_templify的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然，以下是如何在Flutter项目中使用flutter_templify插件来生成模板代码的一个示例。flutter_templify是一个用于生成Flutter项目模板文件的工具，可以大大提高开发效率。以下是一个简单的代码案例来展示其基本用法。

安装flutter_templify

首先，你需要在你的Flutter项目中添加flutter_templify依赖。打开你的pubspec.yaml文件并添加以下依赖：

dependencies:
  flutter:
    sdk: flutter
  flutter_templify: ^最新版本号  # 请替换为最新版本号

然后运行flutter pub get来安装依赖。

创建模板文件

在项目的根目录下创建一个名为templates的文件夹，并在其中创建你的模板文件。例如，创建一个名为page_template.dart的文件，内容如下：

// page_template.dart
import 'package:flutter/material.dart';

class {{className}}Page extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('{{pageTitle}}'),
      ),
      body: Center(
        child: Text('This is the {{className}} page.'),
      ),
    );
  }
}

在这个模板中，{{className}}和{{pageTitle}}是占位符，它们将在生成文件时被替换为具体的值。

配置模板生成脚本

在项目的根目录下创建一个名为templify.yaml的配置文件，内容如下：

templates:
  - source: templates/page_template.dart
    target: lib/pages/{{className}}_page.dart
    variables:
      className: "{{className}}"
      pageTitle: "{{pageTitle}}"

这个配置文件告诉flutter_templify如何找到模板文件、在哪里生成目标文件以及如何将模板中的占位符替换为具体的值。

生成模板文件

在项目的根目录下打开终端，运行以下命令来生成模板文件：

flutter pub run flutter_templify

假设你想生成一个名为HomePage的页面，并且页面标题为Home，你可以在命令行中传递这些参数：

flutter pub run flutter_templify --className=HomePage --pageTitle=Home

运行这个命令后，flutter_templify会在lib/pages/目录下生成一个名为home_page.dart的文件，内容如下：

// home_page.dart
import 'package:flutter/material.dart';

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Home'),
      ),
      body: Center(
        child: Text('This is the HomePage page.'),
      ),
    );
  }
}

使用生成的页面

现在你可以在你的Flutter应用中导入并使用这个生成的页面。例如，在main.dart中：

import 'package:flutter/material.dart';
import 'pages/home_page.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomePage(),
    );
  }
}

这样，你就成功使用flutter_templify生成了一个Flutter页面模板并将其集成到了你的应用中。

希望这个示例能够帮助你理解如何使用flutter_templify来生成Flutter模板代码。如果你有任何其他问题，欢迎继续提问！

回到顶部