@seed-design/tailwind3-plugin 2.4.0 → 2.4.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +12 -8
- package/package.json +11 -2
package/README.md
CHANGED
|
@@ -4,23 +4,27 @@ SEED 디자인 시스템의 디자인 토큰을 Tailwind CSS 3.x에서 쉽게
|
|
|
4
4
|
|
|
5
5
|
## 설치
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
npm install @seed-design/tailwind3-plugin
|
|
9
|
-
```
|
|
10
|
-
|
|
11
|
-
또는
|
|
7
|
+
웹에서는 `@seed-design/css`, Lynx에서는 `@seed-design/lynx-css`를 함께 설치하세요. 두 패키지는 optional peer이므로 패키지 매니저가 둘 중 하나의 설치를 강제하지 않습니다. 플랫폼에 맞는 패키지를 직접 설치하고 토큰 CSS를 import해야 합니다.
|
|
12
8
|
|
|
13
9
|
```bash
|
|
14
|
-
|
|
10
|
+
# 웹
|
|
11
|
+
bun add @seed-design/tailwind3-plugin @seed-design/css tailwindcss@3
|
|
12
|
+
|
|
13
|
+
# Lynx
|
|
14
|
+
bun add @seed-design/tailwind3-plugin @seed-design/lynx-css tailwindcss@3
|
|
15
15
|
```
|
|
16
16
|
|
|
17
|
+
Lynx의 전체 설정과 제한사항은 [Lynx Tailwind 가이드](https://seed-design.io/lynx/getting-started/styling/tailwind-css-3)를 참고하세요. 아래 예제는 웹 기준입니다.
|
|
18
|
+
|
|
17
19
|
## 사용 방법
|
|
18
20
|
|
|
19
21
|
1. 프로젝트에 SEED 디자인 토큰 CSS 파일이 먼저 로드되어 있어야 합니다.
|
|
20
22
|
```js
|
|
21
23
|
import '@seed-design/css/base.css';
|
|
22
|
-
//
|
|
24
|
+
// 또는 컴포넌트 스타일까지 포함
|
|
23
25
|
import '@seed-design/css/all.css';
|
|
26
|
+
// Lynx에서는 위 웹 CSS 대신 사용
|
|
27
|
+
// import '@seed-design/lynx-css/base.css';
|
|
24
28
|
```
|
|
25
29
|
|
|
26
30
|
2. Tailwind CSS 구성 파일에 플러그인을 추가합니다.
|
|
@@ -121,4 +125,4 @@ SEED 디자인 시스템의 모든 디자인 토큰은 다음과 같은 유틸
|
|
|
121
125
|
|
|
122
126
|
## 버전 호환성
|
|
123
127
|
|
|
124
|
-
이 패키지는 Tailwind CSS 3.x 버전에서 사용할 수 있습니다. Tailwind CSS 4.0 이상 버전은 `@seed-design/tailwind4`를 사용하세요.
|
|
128
|
+
이 패키지는 Tailwind CSS 3.x 버전에서 사용할 수 있습니다. Tailwind CSS 4.0 이상 버전은 `@seed-design/tailwind4-theme`를 사용하세요.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@seed-design/tailwind3-plugin",
|
|
3
|
-
"version": "2.4.
|
|
3
|
+
"version": "2.4.2",
|
|
4
4
|
"description": "Tailwind3 CSS plugin for Seed Design tokens",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -49,9 +49,18 @@
|
|
|
49
49
|
},
|
|
50
50
|
"peerDependencies": {
|
|
51
51
|
"@seed-design/css": "^2.2.0",
|
|
52
|
-
"tailwindcss": "3"
|
|
52
|
+
"tailwindcss": "3",
|
|
53
|
+
"@seed-design/lynx-css": "^0.11.0 || ^0.12.0"
|
|
53
54
|
},
|
|
54
55
|
"publishConfig": {
|
|
55
56
|
"access": "public"
|
|
57
|
+
},
|
|
58
|
+
"peerDependenciesMeta": {
|
|
59
|
+
"@seed-design/css": {
|
|
60
|
+
"optional": true
|
|
61
|
+
},
|
|
62
|
+
"@seed-design/lynx-css": {
|
|
63
|
+
"optional": true
|
|
64
|
+
}
|
|
56
65
|
}
|
|
57
66
|
}
|