[Flutter/플러터] flutter_lints 알아보기 - 이쁜 코드 만들기

Formatter & Linter

• Formatter: 코드 작성의 구조적 규칙 (Style이라고 부름. 띄어쓰기, 탭 사용, 항상 comma 사용 등등)을 설정해놓은 값에 따라 자동적으로 바꿔줌 → javascript에서는 prettier
• Linter: 소스 코드를 전체적으로 분석하여 예상되는 논리적 오류, 버그를 검사하고 가능한 경우 자동으로 오류를 수정함. + 포맷터의 역할까지 수행 → javascript에서는 eslint

👍 플러터 코드를 자동으로 이쁘게 포맷하기

아래의 링크 참조

Code formatting

👍 플러터 코드에서 자동으로 수정 가능한 오류 고치기

아래의 링크 참조

Flutter Fix

lints 패키지와 flutter_lints 패키지

2주차에 언급했듯이 Flutter는 언어가 아니라 Dart가 언어이고, Flutter는 Dart 언어를 사용하는 프레임워크임. Dart 언어는 SDK를 설치하면 (Flutter 설치하면 같이 설치됨) 기본적으로 analyzer와 Dart analysis server 를 지원함.

Analyzer는 이름 그대로 “분석” 만을 수행함. Dart 언어를 사용하는 프로젝트는 (Flutter 포함) 프로젝트의 최상단 폴더에 analysis_options.yaml 파일을 생성하고 원하는 분석 규칙을 추가하고 수정할 수 있음. 분석을 위한 상세 옵션은 linter를 통해서 설정가능함.

초창기에는 pedantic이라는 패키지 하나만 기본적으로 제공되었으나, 이 패키지는 이제 폐지되었고, lints 와 flutter_lints 두 패키지를 제공함.

• lints 패키지 (링크 클릭 가능)는 Dart 언어로 작성하는 코드를 정적으로 분석하여 (코드 작성 시, 혹은 컴파일 시 분석) 코딩 스타일, 오탈자, 논리적 문제, 코드 포맷 등의 잘못 된 지점을 분석함.
• flutter_lints 패키지 (링크 클릭 가능)는 lints 패키지에 추가로 flutter 앱 개발시 유용하게 사용될 수 있는 추가적인 규칙들을 선언한 패키지임. 플러터 버전 2.3.0 이후에 생성한 프로젝트들은 자동으로 이 규칙이 추가되어있음. 구글 내부에서 사용하는 linter 룰과 동일한 규칙을 제공하므로, 이 패키지만 사용하면 굳이 규칙을 추가하거나 수정할 필요가 없음. 아래 스크린샷을 보면 실제로 lints 패키지의 기본 규칙에 몇가지만 추가한것을 볼 수 있음.

🤕 내 마음대로 린터 규칙을 수정 하고 싶다.

• analysis_options.yaml 파일 규칙 → Dart 홈페이지의 이 링크 참조
• 사용가능한 모든 린터 규칙 → Dart 홈페이지의 이 링크 참조
• analysis_options.yaml 에 사용하는 파일/폴더 지정 규칙 → 이 패키지 링크 설명 참조

⁇ 나만의 analyzer 툴을 만들고 싶다?!

린터 규칙에 내가 원하는 규칙이 없는 경우에는 요 링크를 참조하여 공식 linter 규칙에서 지원하지 않는 설정까지 하나의 프로그램으로 만들 수 있음 다

결론

그냥 플러터 프로젝트 생성하면 알아서 lint 룰이 생성되어서 그대로 쓰면 된다!!!

⚠️ 그런데 사실은 몇 가지를 추가하면 더 편합니다

하지만, 권장 코딩 스타일임에도 빠진 규칙이 있으니, 그건 바로

1. 코드의 마지막에 comma를 자동으로 추가해주지 않아서, 플러터에서 권장하는데로의 포맷팅이 되지 않는 다는 것! 위젯 코드가 길어질 수록 보기 불편해진다.
2. 내 프로젝트에서 구현한 위젯이, 클래스, 변수들 마저도 import "package:myproject/" 형태로 import 해버린다. 패키지 import 정렬도 불편하고, 이게 내가 pub add 로 추가한 패키지 인지 아닌지 알 수가 없다. 심지어 플러터 공식적으로 이걸 지양하라고 하고 있다.

더욱더 편한 개발을 위해서 analysis_options.yaml 파일을 아래와 같이 수정하자!

include: package:flutter_lints/flutter.yaml

linter:
  rules:
   - require_trailing_commas
	 - prefer_relative_imports

이렇게 두 줄을 추가하면 좀더 이쁘게 포맷팅이 된다! 다른 규칙을 추가하고 싶다면, 위쪽에 링크 걸어놓은 모든 린터 규칙을 보고 적용해보자.

lints 패키지와 flutter_lints 패키지의 전체 규칙 보기

• lints 패키지

linter:
  rules:
    - avoid_empty_else
    - avoid_relative_lib_imports
    - avoid_shadowing_type_parameters
    - avoid_types_as_parameter_names
    - await_only_futures
    - camel_case_extensions
    - camel_case_types
    - curly_braces_in_flow_control_structures
    - empty_catches
    - file_names
    - hash_and_equals
    - iterable_contains_unrelated_type
    - list_remove_unrelated_type
    - no_duplicate_case_values
    - non_constant_identifier_names
    - package_prefixed_library_names
    - prefer_generic_function_type_aliases
    - prefer_is_empty
    - prefer_is_not_empty
    - prefer_iterable_whereType
    - prefer_typing_uninitialized_variables
    - provide_deprecation_message
    - unnecessary_overrides
    - unrelated_type_equality_checks
    - valid_regexps
    - void_checks
		- always_require_non_null_named_parameters
    - annotate_overrides
    - avoid_function_literals_in_foreach_calls
    - avoid_init_to_null
    - avoid_null_checks_in_equality_operators
    - avoid_renaming_method_parameters
    - avoid_return_types_on_setters
    - avoid_returning_null_for_void
    - avoid_single_cascade_in_expression_statements
    - constant_identifier_names
    - control_flow_in_finally
    - empty_constructor_bodies
    - empty_statements
    - exhaustive_cases
    - implementation_imports
    - library_names
    - library_prefixes
    - null_closures
    - overridden_fields
    - package_names
    - prefer_adjacent_string_concatenation
    - prefer_collection_literals
    - prefer_conditional_assignment
    - prefer_contains
    - prefer_equal_for_default_values
    - prefer_final_fields
    - prefer_for_elements_to_map_fromIterable
    - prefer_function_declarations_over_variables
    - prefer_if_null_operators
    - prefer_initializing_formals
    - prefer_inlined_adds
    - prefer_is_not_operator
    - prefer_null_aware_operators
    - prefer_spread_collections
    - prefer_void_to_null
    - recursive_getters
    - slash_for_doc_comments
    - type_init_formals
    - unnecessary_brace_in_string_interps
    - unnecessary_const
    - unnecessary_getters_setters
    - unnecessary_new
    - unnecessary_null_in_if_null_operators
    - unnecessary_string_escapes
    - unnecessary_string_interpolations
    - unnecessary_this
    - use_function_type_syntax_for_parameters
    - use_rethrow_when_possible

• flutter_lints 패키지

include: package:lints/recommended.yaml

linter:
  rules:
    - avoid_print
    - avoid_unnecessary_containers
    - avoid_web_libraries_in_flutter
    - no_logic_in_create_state
    - prefer_const_constructors
    - prefer_const_constructors_in_immutables
    - prefer_const_declarations
    - prefer_const_literals_to_create_immutables
    - sized_box_for_whitespace
    - use_full_hex_values_for_flutter_colors
    - use_key_in_widget_constructors

더 다양한 코드 작성 규칙을 알고 싶다면?

코드를 이쁘게 만드는 규칙 (Style) 외에, 다양한 코드 작성 권장 규칙을 알고 싶다면 Dart 공식 홈페이지에서 제공하는 추천 규칙인 Effective Dart 를 (링크 클릭 됨) 정독해보자. 왜냐면 우리가 쓰는 언어는 Dart 이니까!

이펙티브 다트를 보면서 혹시나 빠진 린터 규칙은 없는지도 확인해보자! 그러면 나만의 프로젝트 템플릿을 만들기 좋다.