unocss 0.45.21 → 0.45.23

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.
Files changed (2) hide show
  1. package/README.md +12 -76
  2. package/package.json +20 -20
package/README.md CHANGED
@@ -42,67 +42,9 @@ Inspired by [Windi CSS](http://windicss.org/), [Tailwind CSS](https://tailwindcs
42
42
  - [VS Code extension](https://marketplace.visualstudio.com/items?itemName=antfu.unocss)
43
43
  - Code-splitting for CSS - ships minimal CSS for MPA.
44
44
 
45
- ###### Benchmark
46
-
47
- ```
48
- 2022/9/3 22:40:50
49
- 1656 utilities | x200 runs (75% build time)
50
-
51
- none 20.01 ms / delta. 0.00 ms
52
- unocss v0.45.14 199.76 ms / delta. 179.75 ms (x1.00)
53
- tailwindcss v3.1.8 875.51 ms / delta. 855.50 ms (x4.76)
54
- windicss v3.5.6 1342.37 ms / delta. 1322.36 ms (x7.36)
55
- ```
56
-
57
45
  ## Installation
58
46
 
59
- ### Vite
60
-
61
- ```bash
62
- npm i -D unocss
63
- ```
64
-
65
- ```ts
66
- // vite.config.ts
67
- import Unocss from 'unocss/vite'
68
-
69
- export default {
70
- plugins: [
71
- Unocss({ /* options */ }),
72
- ],
73
- }
74
- ```
75
-
76
- Add `uno.css` to your main entry:
77
-
78
- ```ts
79
- // main.ts
80
- import 'uno.css'
81
- ```
82
-
83
- That's it, have fun.
84
-
85
- Learn more at [@unocss/vite](https://github.com/unocss/unocss/blob/main/packages/vite).
86
-
87
- See [all packages](https://github.com/unocss/unocss/tree/main/packages).
88
-
89
- ### Nuxt
90
-
91
- ```bash
92
- npm i -D @unocss/nuxt
93
- ```
94
-
95
- ```ts
96
- // nuxt.config.js
97
-
98
- export default {
99
- modules: [
100
- '@unocss/nuxt',
101
- ],
102
- }
103
- ```
104
-
105
- Learn more at [@unocss/nuxt](https://github.com/unocss/unocss/tree/main/packages/nuxt)
47
+ [Vite](https://github.com/unocss/unocss/blob/main/packages/vite) | [Nuxt](https://github.com/unocss/unocss/blob/main/packages/nuxt) | [Astro](https://github.com/unocss/unocss/blob/main/packages/astro) | [Webpack](https://github.com/unocss/unocss/blob/main/packages/webpack) | [CDN Runtime](https://github.com/unocss/unocss/blob/main/packages/runtime) | [CLI](https://github.com/unocss/unocss/blob/main/packages/cli) | [VS Code extension](https://github.com/unocss/unocss/blob/main/packages/vscode)
106
48
 
107
49
  ## Configurations
108
50
 
@@ -110,17 +52,6 @@ UnoCSS is an atomic-CSS engine instead of a framework. Everything is designed wi
110
52
 
111
53
  By default, UnoCSS applies [the default preset](https://github.com/unocss/unocss/tree/main/packages/preset-uno), which provides a common superset of the popular utilities-first frameworks Tailwind CSS, Windi CSS, Bootstrap, Tachyons, etc.
112
54
 
113
- For example: `ml-3` (Tailwind), `ms-2` (Bootstrap), `ma4` (Tachyons), and `mt-10px` (Windi CSS) are all valid.
114
-
115
- ```css
116
- .ma4 { margin: 1rem; }
117
- .ml-3 { margin-left: 0.75rem; }
118
- .ms-2 { margin-inline-start: 0.5rem; }
119
- .mt-10px { margin-top: 10px; }
120
- ```
121
-
122
- Learn more about [the default preset](https://github.com/unocss/unocss/tree/main/packages/preset-uno).
123
-
124
55
  ### Presets
125
56
 
126
57
  Presets are the heart of UnoCSS. They let you make your own custom framework in minutes.
@@ -147,7 +78,12 @@ Presets are the heart of UnoCSS. They let you make your own custom framework in
147
78
  - [unocss-preset-heropatterns](https://github.com/Julien-R44/unocss-preset-heropatterns) - Preset that integrates [Hero Patterns](https://heropatterns.com/) by [@Julien-R44](https://github.com/Julien-R44).
148
79
  - [unocss-preset-flowbite](https://github.com/Julien-R44/unocss-preset-flowbite) - Port of of [Flowbite Tailwind plugin](https://github.com/themesberg/flowbite) for UnoCSS by [@Julien-R44](https://github.com/Julien-R44).
149
80
  - [unocss-preset-forms](https://github.com/Julien-R44/unocss-preset-forms) - Port of [@tailwindcss/forms](https://github.com/tailwindlabs/tailwindcss-forms) for UnoCSS by [@Julien-R44](https://github.com/Julien-R44).
150
- - [unocss-preset-extra](https://github.com/MoomFE/unocss-preset-extra) - [Animate.css](https://animate.style) Preset and some other rules by [@Zhang-Wei-666](https://github.com/Zhang-Wei-666)
81
+ - [unocss-preset-extra](https://github.com/MoomFE/unocss-preset-extra) - [Animate.css](https://animate.style) Preset and some other rules by [@Zhang-Wei-666](https://github.com/Zhang-Wei-666).
82
+ - [unocss-preset-daisy](https://github.com/kidonng/unocss-preset-daisy) - daisyUI Preset by [@kidonng](https://github.com/kidonng).
83
+
84
+ ###### Community Frameworks
85
+
86
+ - [Anu](https://github.com/jd-solanki/anu) - DX focused utility based vue component library by [@jd-solanki](https://github.com/jd-solanki)
151
87
 
152
88
  ### Using Presets
153
89
 
@@ -410,7 +346,7 @@ preflights: [
410
346
  {
411
347
  getCSS: ({ theme }) => `
412
348
  * {
413
- color: ${theme.colors.gray?.[700] ?? '#333'}
349
+ color: ${theme.colors.gray?.[700] ?? '#333'};
414
350
  padding: 0;
415
351
  margin: 0;
416
352
  }
@@ -454,7 +390,7 @@ Let's have a tour of what happened when matching for `hover:m-2`:
454
390
  - the result `m-2` will be used for the next round of variants matching
455
391
  - if no other variant is matched, `m-2` will then goes to match the rules
456
392
  - our first rule get matched and generates `.m-2 { margin: 0.5rem; }`
457
- - finally, we apply our variants transformation to the generated CSS. In this case, we prepended `:hover` to the `selector` hook
393
+ - finally, we apply our variants' transformation to the generated CSS. In this case, we prepended `:hover` to the `selector` hook
458
394
 
459
395
  As a result, the following CSS will be generated:
460
396
 
@@ -468,7 +404,7 @@ The variant system is very powerful and can't be covered fully in this guide, yo
468
404
 
469
405
  ### Extend Theme
470
406
 
471
- UnoCSS also supports the theming system that you might be familiar with in Tailwind / Windi. At the user level, you can specify the `theme` property in your config and it will be deep merged to the default theme.
407
+ UnoCSS also supports the theming system that you might be familiar with in Tailwind / Windi. At the user level, you can specify the `theme` property in your config, and it will be deep merged to the default theme.
472
408
 
473
409
  <!--eslint-skip-->
474
410
 
@@ -593,7 +529,7 @@ preprocess(matcher) {
593
529
 
594
530
  Please note that UnoCSS works **at build time**, meaning only statically presented utilities will be generated and shipped to your app. Utilities that used dynamically or fetched from external resources at runtime might not be applied.
595
531
 
596
- By default UnoCSS will extract the utilities usage from files in your build pipeline with extension `.jsx`, `.tsx`, `.vue`, `.md`, `.html`, `.svelte`, `.astro`. And then generate the CSS on demand.
532
+ By default, UnoCSS will extract the utilities usage from files in your build pipeline with extension `.jsx`, `.tsx`, `.vue`, `.md`, `.html`, `.svelte`, `.astro`. And then generate the CSS on demand.
597
533
 
598
534
  `.js` and `.ts` files are **NOT included by default**. You can add `@unocss-include`, per-file basis, anywhere in the file that you want UnoCSS to scan, or add `*.js` or `*.ts` in the configuration to include all js/ts files as scan targets. Similarly, you can also add `@unocss-ignore` to bypass the scanning and transforming for a file.
599
535
 
@@ -611,7 +547,7 @@ Due the fact that UnoCSS works in build time using static extracting, at the com
611
547
  safelist: 'p-1 p-2 p-3 p-4'.split(' ')
612
548
  ```
613
549
 
614
- the corresponding CSS will be always generated:
550
+ the corresponding CSS will always be generated:
615
551
 
616
552
  ```css
617
553
  .p-1 { padding: 0.25rem; }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "unocss",
3
- "version": "0.45.21",
3
+ "version": "0.45.23",
4
4
  "description": "The instant on-demand Atomic CSS engine.",
5
5
  "author": "Anthony Fu <anthonyfu117@hotmail.com>",
6
6
  "license": "MIT",
@@ -98,7 +98,7 @@
98
98
  "node": ">=14"
99
99
  },
100
100
  "peerDependencies": {
101
- "@unocss/webpack": "0.45.21"
101
+ "@unocss/webpack": "0.45.23"
102
102
  },
103
103
  "peerDependenciesMeta": {
104
104
  "@unocss/webpack": {
@@ -106,26 +106,26 @@
106
106
  }
107
107
  },
108
108
  "dependencies": {
109
- "@unocss/astro": "0.45.21",
110
- "@unocss/cli": "0.45.21",
111
- "@unocss/core": "0.45.21",
112
- "@unocss/preset-attributify": "0.45.21",
113
- "@unocss/preset-icons": "0.45.21",
114
- "@unocss/preset-mini": "0.45.21",
115
- "@unocss/preset-tagify": "0.45.21",
116
- "@unocss/preset-typography": "0.45.21",
117
- "@unocss/preset-uno": "0.45.21",
118
- "@unocss/preset-web-fonts": "0.45.21",
119
- "@unocss/preset-wind": "0.45.21",
120
- "@unocss/reset": "0.45.21",
121
- "@unocss/transformer-attributify-jsx": "0.45.21",
122
- "@unocss/transformer-compile-class": "0.45.21",
123
- "@unocss/transformer-directives": "0.45.21",
124
- "@unocss/transformer-variant-group": "0.45.21",
125
- "@unocss/vite": "0.45.21"
109
+ "@unocss/astro": "0.45.23",
110
+ "@unocss/cli": "0.45.23",
111
+ "@unocss/core": "0.45.23",
112
+ "@unocss/preset-attributify": "0.45.23",
113
+ "@unocss/preset-icons": "0.45.23",
114
+ "@unocss/preset-mini": "0.45.23",
115
+ "@unocss/preset-tagify": "0.45.23",
116
+ "@unocss/preset-typography": "0.45.23",
117
+ "@unocss/preset-uno": "0.45.23",
118
+ "@unocss/preset-web-fonts": "0.45.23",
119
+ "@unocss/preset-wind": "0.45.23",
120
+ "@unocss/reset": "0.45.23",
121
+ "@unocss/transformer-attributify-jsx": "0.45.23",
122
+ "@unocss/transformer-compile-class": "0.45.23",
123
+ "@unocss/transformer-directives": "0.45.23",
124
+ "@unocss/transformer-variant-group": "0.45.23",
125
+ "@unocss/vite": "0.45.23"
126
126
  },
127
127
  "devDependencies": {
128
- "@unocss/webpack": "0.45.21"
128
+ "@unocss/webpack": "0.45.23"
129
129
  },
130
130
  "scripts": {
131
131
  "build": "unbuild",