podo-ui 0.1.35 → 0.1.36
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/package.json +1 -1
- package/readme.md +23 -4
- package/vite-plugin.js +11 -5
package/package.json
CHANGED
package/readme.md
CHANGED
|
@@ -40,9 +40,28 @@ import 'podo-ui/global.scss';
|
|
|
40
40
|
|
|
41
41
|
### 3. Vite 프로젝트 설정 (필수)
|
|
42
42
|
|
|
43
|
-
⚠️ **Vite를 사용하는 경우
|
|
43
|
+
⚠️ **Vite를 사용하는 경우 추가 설정이 필요합니다!**
|
|
44
44
|
|
|
45
|
-
|
|
45
|
+
**방법 1: resolve.alias 사용 (권장)**
|
|
46
|
+
|
|
47
|
+
```javascript
|
|
48
|
+
// vite.config.js
|
|
49
|
+
import { defineConfig } from 'vite';
|
|
50
|
+
import react from '@vitejs/plugin-react';
|
|
51
|
+
import path from 'path';
|
|
52
|
+
|
|
53
|
+
export default defineConfig({
|
|
54
|
+
plugins: [react()],
|
|
55
|
+
resolve: {
|
|
56
|
+
alias: {
|
|
57
|
+
'podo-ui/mixin': path.resolve(__dirname, 'node_modules/podo-ui/mixin.scss'),
|
|
58
|
+
'podo-ui/system': path.resolve(__dirname, 'node_modules/podo-ui/system.scss'),
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
});
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
**방법 2: 플러그인 사용 (실험적)**
|
|
46
65
|
|
|
47
66
|
```javascript
|
|
48
67
|
// vite.config.js
|
|
@@ -53,12 +72,12 @@ import { podoUiVitePlugin } from 'podo-ui/vite-plugin';
|
|
|
53
72
|
export default defineConfig({
|
|
54
73
|
plugins: [
|
|
55
74
|
react(),
|
|
56
|
-
podoUiVitePlugin()
|
|
75
|
+
podoUiVitePlugin()
|
|
57
76
|
]
|
|
58
77
|
});
|
|
59
78
|
```
|
|
60
79
|
|
|
61
|
-
**Next.js나 CRA 등 다른 번들러는
|
|
80
|
+
**Next.js나 CRA 등 다른 번들러는 추가 설정 없이 사용 가능합니다.**
|
|
62
81
|
|
|
63
82
|
---
|
|
64
83
|
|
package/vite-plugin.js
CHANGED
|
@@ -14,9 +14,10 @@ export function podoUiVitePlugin() {
|
|
|
14
14
|
name: 'vite-plugin-podo-ui',
|
|
15
15
|
|
|
16
16
|
config(userConfig, { command }) {
|
|
17
|
-
// Get existing SCSS
|
|
18
|
-
const
|
|
19
|
-
const
|
|
17
|
+
// Get existing SCSS preprocessor options
|
|
18
|
+
const existingScssOptions = userConfig?.css?.preprocessorOptions?.scss || {};
|
|
19
|
+
const existingImporter = existingScssOptions.importer || [];
|
|
20
|
+
const importerArray = Array.isArray(existingImporter) ? existingImporter : [existingImporter].filter(Boolean);
|
|
20
21
|
|
|
21
22
|
// Create podo-ui importer
|
|
22
23
|
const podoUiImporter = function(url, prev, done) {
|
|
@@ -44,12 +45,17 @@ export function podoUiVitePlugin() {
|
|
|
44
45
|
return null;
|
|
45
46
|
};
|
|
46
47
|
|
|
48
|
+
// Only add importer if there are existing importers or podo-ui needs it
|
|
49
|
+
const finalImporter = importerArray.length > 0
|
|
50
|
+
? [podoUiImporter, ...importerArray]
|
|
51
|
+
: podoUiImporter;
|
|
52
|
+
|
|
47
53
|
return {
|
|
48
54
|
css: {
|
|
49
55
|
preprocessorOptions: {
|
|
50
56
|
scss: {
|
|
51
|
-
|
|
52
|
-
importer:
|
|
57
|
+
...existingScssOptions,
|
|
58
|
+
importer: finalImporter
|
|
53
59
|
}
|
|
54
60
|
}
|
|
55
61
|
}
|