Flutter入门二——项目结构及配置文件简介

浅浅的花香味﹌ 2022-03-08 14:05 400阅读 0赞

## 前言 ##

环境搭建完成之后，我们来看看Flutter:New Project后生成的项目结构。  
具体环境搭建可以参考：[w7上使用VSCode配置Flutter开发环境][w7_VSCode_Flutter]

## 项目结构 ##

![clipboard.png][]

## pubspec.yaml配置文件说明 ##

1.  作用  
    每个发布包都需要一些元数据，以便能够指定它的依赖项。与他人共享的发布包还需要提供一些其他信息，以便用户能够发现它们。所有这些元数据都放在一个名为pubspec.yaml的yamll(YAML 是专门用来写配置文件的语言，非常简洁和强大，远比 JSON 格式方便)文件中。
2.  支持的字段  
    name,version,description,author/authors,homepage,repository,issue\_tracker,documentation,dependencies,dev\_dependcencies,dependency\_overrides,environment,excutables,publish\_to
3.  与Node.js的package.json文件的类比  
    （*因为我在web开发里是使用Node.js来做包管理的，所以类比nonde.js的package.json对于由web入门学习flutter的同学会比较容易理解。*）
    
    简单而言，pubspec.yaml文件的作用就相当于Node.js的package.json文件，是用来进行包管理的；  
    两者都分离了两个环境，dependencies和dev\_dependencies;  
    前者使用yaml语法来定义，后者使用json语法；  
    pubspec.yaml对版本的约束规则与package.json规则类似；
    
    <table> 
     <tbody> 
      <tr> 
       <td>安装依赖</td> 
       <td>npm install</td> 
       <td>flutter package get</td> 
      </tr> 
      <tr> 
       <td>升级依赖包版本</td> 
       <td>npm update</td> 
       <td>flutter packages upgrade</td> 
      </tr> 
      <tr> 
       <td>协同开发保证包版本一致</td> 
       <td>package-lock.json</td> 
       <td>pubspec.lock</td> 
      </tr> 
     </tbody> 
    </table>
    
    关于此后续可以再丰富~~
4.  默认的配置如下，有备注解释：

#包名
    name: todo_app
    #描述信息
    description: A new Flutter project.
    #版本号
    version: 1.0.0+1
    #指定环境
    environment:
      sdk: ">=2.0.0-dev.68.0 <3.0.0"
    #指定包依赖
    dependencies:
      flutter:
        sdk: flutter
    
      # The following adds the Cupertino Icons font to your application.
      # Use with the CupertinoIcons class for iOS style icons.
      cupertino_icons: ^0.1.2
      english_words: ^3.1.0
    #指定开发环境下的包依赖
    dev_dependencies:
      flutter_test:
        sdk: flutter
    
    
    # For information on the generic Dart part of this file, see the
    # following page: https://www.dartlang.org/tools/pub/pubspec
    
    # The following section is specific to Flutter.
    flutter:
    
      # The following line ensures that the Material Icons font is
      # included with your application, so that you can use the icons in
      # the material Icons class.
      uses-material-design: true

[w7_VSCode_Flutter]: https://segmentfault.com/a/1190000017963939?share_user=1030000015869996
[clipboard.png]: /images/20220308/f71cb94566454b1cb9d467f238053b4a.png