ReScript / VS Code 환경에서 tailwind 자동완성 설정하기

Jaeho Lee·2021년 12월 18일
3

tailwind css intellisense 익스텐션을 그냥 설치하면, ReScript-React 에서 테일윈드를 사용하더라도 자동완성이나 validation이 딱히 작동하지 않는다. 아래와 같은 설정을 따로 해 줘야 하는데, 당연히 해당 vs code 익스텐션을 fork해야 할 것이라고 (...) 생각했지만 회사 분의 도움으로 상당히 간단하게 설정만으로 해결이 가능했다.

(회사에서는tailwind-ppx를 사용하고 있어, %tw("...") 블럭 안에 사용하는 것이 가정되어 있지만, className 등을 타겟으로 정규식을 짤 수도 있겠다)

  "tailwindCSS.includeLanguages": {
    "plaintext": "javascript"
  },
  "css.validate": false,
  "editor.quickSuggestions": {
    "strings": true
  },
  "tailwindCSS.experimental.classRegex": ["%tw\\(\\s*\"([^\"]*)\"\\s*\\)"]
profile
개발자

1개의 댓글

comment-user-thumbnail
2022년 9월 3일

vue에서 tail wind 자동완성이 안되서 2시간 삽질했는데 이걸로 해결했습니다ㅜㅜ
감사합니다.

답글 달기