Angular14 for unocss

[sixinyiyu]

how to use unocss with angular 14, without vite

[sadeghbarati]

use UnoCSS cli

https://github.com/unocss/unocss/issues/1842

[sixinyiyu]

i want to use Tailwind CSS

[itpropro]

The @unocss/cli package has everything you need to use TailwindCSS syntax.

[sixinyiyu]

1、

 npm -i  -D unocss @unocss/webpack

version : 0.46.5

2、config webpack.config.js

const UnoCSS = require('@unocss/webpack').default

module.exports = {
  plugins: [
    UnoCSS({ /* options */ }),
  ],
  optimization: {
    realContentHash: true,
  },
}

3、 add uncoss config

import {
    defineConfig,
    presetAttributify,
    presetIcons,
    presetUno,
  } from 'unocss'

  export default defineConfig({
    rules: [
      ['custom-rule', { color: 'red' }]
    ],
    shortcuts: {
      'custom-shortcut': 'text-lg text-orange hover:text-teal'
    },
    presets: [
      presetUno(),
      presetAttributify(),
      presetIcons({
        scale: 1.2,
        cdn: 'https://esm.sh/'
      }),
    ]
  })

4、import 'uno.css'

try import at main.ts or gloabl style.css 

result: it's not work

[Shyam-Chen]

Use @nitedani/vite-plugin-angular

[sadeghbarati]

https://analogjs.org/

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.