Skip to content

Commit 37d5c72

Browse files
AndreyYolkinJ-Sek
AndreyYolkin
and
J-Sek
authored
feat: tailwind preset
Co-authored-by: J-Sek <J-Sek@users.noreply.github.com>
1 parent 954c7c9 commit 37d5c72

79 files changed

Lines changed: 12867 additions & 137 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎packages/create/src/commands/presets.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ export const presets = defineCommand({
2020
description: i18n.t('commands.presets.description'),
2121
},
2222
args: {
23-
...projectArgs(),
23+
...projectArgs({ exclude: ['type'] }),
2424
list: {
2525
type: 'boolean',
2626
description: 'List available presets',
@@ -127,6 +127,7 @@ export const presets = defineCommand({
127127
await createVuetify({
128128
...args,
129129
preset: (preset as any).key || join(presetsDir, (preset as any).file!),
130+
type: 'vuetify',
130131
version,
131132
} as any, { intro: false })
132133
} else {

‎packages/create/src/index.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export const main = defineCommand({
1414
description: i18n.t('cli.create.description'),
1515
},
1616
args: {
17-
...projectArgs(),
17+
...projectArgs({ exclude: ['type'] }),
1818
cwd: {
1919
type: 'string',
2020
description: 'The current working directory',
@@ -26,6 +26,7 @@ export const main = defineCommand({
2626
}
2727
await createVuetify({
2828
...args,
29+
type: 'vuetify',
2930
version,
3031
})
3132
},

‎packages/shared/src/completion.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,8 @@ export function registerProjectArgsCompletion (completion: any) {
2828
if (cssOption) {
2929
cssOption.handler = (complete: any) => {
3030
complete('unocss', 'UnoCSS')
31+
complete('unocss-wind4', 'UnoCSS (Wind4)')
32+
complete('unocss-vuetify', 'UnoCSS (Vuetify)')
3133
complete('tailwindcss', 'Tailwind CSS')
3234
complete('none', 'None')
3335
}

‎packages/shared/src/features/css-none.ts‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,14 @@ export const cssNone: Feature = {
66
name: 'css-none',
77
apply: async ({ cwd, isNuxt }) => {
88
// Cleanup from tailwindcss.ts
9-
const unocssConfig = join(cwd, 'unocss.config.ts')
10-
if (existsSync(unocssConfig)) {
11-
rmSync(unocssConfig)
9+
const unocssConfigs = [
10+
join(cwd, 'unocss.config.ts'),
11+
join(cwd, 'uno.config.ts'),
12+
]
13+
for (const configPath of unocssConfigs) {
14+
if (existsSync(configPath)) {
15+
rmSync(configPath)
16+
}
1217
}
1318

1419
// Cleanup from unocss.ts

‎packages/shared/src/features/dependencies/package.json‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,16 @@
1212
"unplugin-vue-router": "^0.19.1",
1313
"vite-plugin-vuetify": "^2.1.3",
1414
"unocss": "^66.5.12",
15+
"@unocss/transformer-directives": "^66.6.0",
1516
"@unocss/nuxt": "^66.5.12",
17+
"unocss-preset-vuetify": "^0.1.1",
1618
"tailwindcss": "^4.1.18",
1719
"@tailwindcss/vite": "^4.1.18",
1820
"@nuxtjs/tailwindcss": "^7.0.0-beta.1",
1921
"pathe": "^2.0.3",
2022
"@vuetify/loader-shared": "^2.1.1",
21-
"@intellectronica/ruler": "^0.3.18"
23+
"@intellectronica/ruler": "^0.3.18",
24+
"@fontsource/roboto": "^5.2.9",
25+
"@fontsource/roboto-mono": "^5.2.8"
2226
}
2327
}

‎packages/shared/src/features/index.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { mcp } from './mcp'
77
import { pinia } from './pinia'
88
import { fileRouter, router } from './router'
99
import { tailwindcss } from './tailwindcss'
10-
import { unocss } from './unocss'
10+
import { unocss, unocssVuetify, unocssWind4 } from './unocss'
1111
import { vuetifyNuxtManual } from './vuetify-nuxt-manual'
1212
import { vuetifyNuxtModule } from './vuetify-nuxt-module'
1313

@@ -33,6 +33,8 @@ export const features: Record<string, Feature> = {
3333
'vuetify-nuxt-module': vuetifyNuxtModule,
3434
'vuetify-nuxt-manual': vuetifyNuxtManual,
3535
unocss,
36+
'unocss-wind4': unocssWind4,
37+
'unocss-vuetify': unocssVuetify,
3638
tailwindcss,
3739
'css-none': cssNone,
3840
}

‎packages/shared/src/features/tailwindcss.ts‎

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,19 @@ import rootPkg from './dependencies/package.json' with { type: 'json' }
88

99
export const tailwindcss: Feature = {
1010
name: 'tailwindcss',
11-
apply: async ({ cwd, pkg, isTypescript, isNuxt }) => {
12-
const unocssConfig = join(cwd, 'unocss.config.ts')
11+
apply: async ({ cwd, pkg, isTypescript, isNuxt, type }) => {
12+
if (type === 'vuetify' && !isNuxt) {
13+
return
14+
}
1315

14-
if (existsSync(unocssConfig)) {
15-
rmSync(unocssConfig)
16+
const unocssConfigs = [
17+
join(cwd, 'unocss.config.ts'),
18+
join(cwd, 'uno.config.ts'),
19+
]
20+
for (const configPath of unocssConfigs) {
21+
if (existsSync(configPath)) {
22+
rmSync(configPath)
23+
}
1624
}
1725

1826
if (isNuxt) {
@@ -41,13 +49,11 @@ export const tailwindcss: Feature = {
4149

4250
await writeFile(viteConfigPath, mod.generate().code)
4351

44-
// Import in main.ts
4552
const mainFiles = ['src/main.ts', 'src/main.js']
4653
for (const file of mainFiles) {
4754
const filePath = join(cwd, file)
4855
if (existsSync(filePath)) {
4956
const mainFile = await readFile(filePath, 'utf8')
50-
// find // Styles and add import './main.css'; after it
5157
await writeFile(filePath, mainFile.replace(/\/\/ Styles/g, '// Styles\nimport \'./tailwind.css\';'))
5258
break
5359
}

‎packages/shared/src/features/unocss.ts‎

Lines changed: 70 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -1,62 +1,84 @@
1-
import type { Feature } from './types'
1+
import type { Feature, FeatureContext } from './types'
22
import { existsSync, rmSync } from 'node:fs'
33
import { readFile, writeFile } from 'node:fs/promises'
44
import { loadFile } from 'magicast'
55
import { addNuxtModule, addVitePlugin } from 'magicast/helpers'
66
import { join } from 'pathe'
77
import rootPkg from './dependencies/package.json' with { type: 'json' }
88

9-
export const unocss: Feature = {
10-
name: 'unocss',
11-
apply: async ({ cwd, pkg, isTypescript, isNuxt }) => {
12-
// Add UnoCSS dependencies
13-
pkg.devDependencies = pkg.devDependencies || {}
14-
pkg.devDependencies['unocss'] = rootPkg.dependencies['unocss']
9+
async function applyUnocssBase (
10+
{ cwd, pkg, isTypescript, isNuxt }: FeatureContext,
11+
options: { presetVuetify?: boolean } = {},
12+
) {
13+
pkg.devDependencies = pkg.devDependencies || {}
14+
pkg.devDependencies['unocss'] = rootPkg.dependencies['unocss']
15+
pkg.devDependencies['@unocss/transformer-directives'] = rootPkg.dependencies['@unocss/transformer-directives']
16+
if (options.presetVuetify) {
17+
pkg.devDependencies['unocss-preset-vuetify'] = rootPkg.dependencies['unocss-preset-vuetify']
18+
}
1519

16-
const tailwindCss = isNuxt ? join(cwd, 'app/assets/css/tailwind.css') : join(cwd, 'src/tailwind.css')
20+
const tailwindCss = isNuxt ? join(cwd, 'app/assets/css/tailwind.css') : join(cwd, 'src/tailwind.css')
1721

18-
if (existsSync(tailwindCss)) {
19-
rmSync(tailwindCss)
20-
}
22+
if (existsSync(tailwindCss)) {
23+
rmSync(tailwindCss)
24+
}
2125

22-
// Remove Tailwind dependencies
23-
if (pkg.devDependencies) {
24-
delete pkg.devDependencies['tailwindcss']
25-
delete pkg.devDependencies['@tailwindcss/vite']
26-
delete pkg.devDependencies['@nuxtjs/tailwindcss']
27-
}
26+
if (pkg.devDependencies) {
27+
delete pkg.devDependencies['tailwindcss']
28+
delete pkg.devDependencies['@tailwindcss/vite']
29+
delete pkg.devDependencies['@nuxtjs/tailwindcss']
30+
}
31+
32+
if (isNuxt) {
33+
pkg.devDependencies['@unocss/nuxt'] = rootPkg.dependencies['@unocss/nuxt']
34+
35+
const configPath = join(cwd, 'nuxt.config.ts')
36+
const mod = await loadFile(configPath)
37+
addNuxtModule(mod, '@unocss/nuxt')
38+
39+
await writeFile(configPath, mod.generate().code)
40+
return
41+
}
42+
43+
const ext = isTypescript ? 'ts' : 'js'
44+
const viteConfigPath = join(cwd, `vite.config.m${ext}`)
45+
const mod = await loadFile(viteConfigPath)
46+
47+
addVitePlugin(mod, {
48+
from: 'unocss/vite',
49+
constructor: 'UnoCSS',
50+
})
51+
52+
await writeFile(viteConfigPath, mod.generate().code)
2853

29-
if (isNuxt) {
30-
pkg.devDependencies['@unocss/nuxt'] = rootPkg.dependencies['@unocss/nuxt']
31-
32-
const configPath = join(cwd, 'nuxt.config.ts')
33-
const mod = await loadFile(configPath)
34-
addNuxtModule(mod, '@unocss/nuxt')
35-
36-
await writeFile(configPath, mod.generate().code)
37-
} else {
38-
const ext = isTypescript ? 'ts' : 'js'
39-
const viteConfigPath = join(cwd, `vite.config.m${ext}`)
40-
const mod = await loadFile(viteConfigPath)
41-
42-
addVitePlugin(mod, {
43-
from: 'unocss/vite',
44-
constructor: 'UnoCSS',
45-
})
46-
47-
await writeFile(viteConfigPath, mod.generate().code)
48-
49-
// Add import to main.ts
50-
// Try src/main.ts or src/index.ts
51-
const mainFiles = ['src/main.ts', 'src/main.js']
52-
for (const file of mainFiles) {
53-
const filePath = join(cwd, file)
54-
if (existsSync(filePath)) {
55-
const content = await readFile(filePath, 'utf8')
56-
await writeFile(filePath, content.replace(/\/\/ Styles/g, '// Styles\nimport \'virtual:uno.css\''))
57-
break
58-
}
59-
}
54+
const mainFiles = ['src/main.ts', 'src/main.js']
55+
for (const file of mainFiles) {
56+
const filePath = join(cwd, file)
57+
if (existsSync(filePath)) {
58+
const content = await readFile(filePath, 'utf8')
59+
await writeFile(filePath, content.replace(/\/\/ Styles/g, '// Styles\nimport \'virtual:uno.css\''))
60+
break
6061
}
62+
}
63+
}
64+
65+
export const unocss: Feature = {
66+
name: 'unocss',
67+
apply: async ctx => {
68+
await applyUnocssBase(ctx)
69+
},
70+
}
71+
72+
export const unocssWind4: Feature = {
73+
name: 'unocss-wind4',
74+
apply: async ctx => {
75+
await applyUnocssBase(ctx)
76+
},
77+
}
78+
79+
export const unocssVuetify: Feature = {
80+
name: 'unocss-vuetify',
81+
apply: async ctx => {
82+
await applyUnocssBase(ctx, { presetVuetify: true })
6183
},
6284
}

0 commit comments

Comments
 (0)