2017-04-25 2 views
3

처음 몇 달 전에 Visual Studio 코드 편집기를 사용하여 Angular로 프로젝트를 시작했습니다.구성 요소의 사용자 정의 접두사 각도 및 WebStorm

오늘 WebStorm으로 전환했고 프로젝트를 Angular 4.0으로 업그레이드했습니다. 내 프로젝트가 오류없이 좋은 실행되는 동안

, 나는 WebStorm에서 다음과 같은 오류가 나타날 수

TSLint을 : 구성 요소 "ConnectionStatusComponent" 의 선택은 ( https://angular.io/docs/ts/latest/guide/style-guide.html#!#02-07)를 접두사 "응용 프로그램을"해야한다 (나는 그 prevent name collisions with components in other apps and with native HTML elements

에 구성 요소 선택에 사용자 정의 접두사를 추가하는 것이 좋습니다 실현에 링크 된 다음 구성 요소 선택)

그 점을 이해합니다. 제 질문은 왜 내가 app 접두사를 사용하고 다른 접두사를 사용하지 않는 이유입니까? 다른 접두어를 쓰면 app, WebStorm은 그 줄을 오류로 표시합니다. 링크의 스타일 가이드에 따르면

:

가 구성 요소 선택에 대한 사용자 지정 접두어를 사용하십니까. 예를 들어 접두어 toh는 Tour of Heroes를 나타내고 접두사 admin 은 관리 기능 영역을 나타냅니다.

내가 원하는 모든 접두어를 사용할 수 있습니다. 접두사 이름에 규칙이 있습니까?

+1

"component-selector"설정의 tslint 파일에서이 설정을 변경할 수 있습니다. 배열에서 "app"을 제거합니다. – galvan

+0

구성 요소마다 여러 접두사를 사용합니다. 첫 번째는 내 구성 요소를 차별화하는 앱입니다. 초는 지형지 물 모듈의 이름입니다. 세 번째는 상위 뷰입니다. 즉. 'app-core-login-footer'. 시간이 지나면 네 번째 레벨에 도달 할 것입니다. – darko99

답변

10

내가 아는 한, 접두어 이름에 대한 엄격한 규칙은 없습니다. CLI를 사용하는 경우 angular-cli.jsonapps 아래의 prefix 노드를 편집 할 수 있습니다. 이렇게하면 cli가 사용자가 결정한 접두사를 사용하여 새로운 구성 요소를 만들 수 있습니다. tslint.json의 경우 구성 요소 및 지시문 규칙을 모두 설정할 수 있습니다.

"directive-selector": [true, "attribute", "app", "camelCase"], 
"component-selector": [true, "element", "app", "kebab-case"], 

희망 사항. 하나 이상의 접두사를 사용하려면 수정이

,이 같은 배열 (example from here)에이를 지정할 수 있습니다

: 배열에서

//RULES: [ENABLED, "attribute" | "element", "selectorPrefix" | ["listOfPrefixes"], "camelCase" | "kebab-case"] 
    "directive-selector": [true, "attribute", ["dir-prefix1", "dir-prefix2"], "camelCase"], 
    "component-selector": [true, "element", ["cmp-prefix1", "cmp-prefix2"], "kebab-case"], 
  • , 첫 번째 인수 이 활성화되었는지 여부에 대한 부울입니다.
  • 두 번째 인수는 선택 항목이 attribute이거나 element 인 공용체 유형입니다.
  • 세 번째 인수는 단일 접두사에 대한 문자열이거나 접두사 목록에 대한 배열입니다.
  • 네 번째 인수는 kebab-case 또는 camelCase 중 하나의 공용 형식입니다.
+0

감사. 한 가지 더 묻습니다. "admin", "user"등과 같은 여러 접두사를 사용하려면 어떻게해야합니까? tslint.json에서 그렇게 할 수있는 방법이 있습니까? –

+0

예, 답변 표시 방법을 업데이트하겠습니다. –

+0

감사합니다. Webstorm에서 같은 문제가 발생했습니다. –

관련 문제