unplugin-inspector-lib-css

将库模式下的unocss样式打包注入到bundle

Why

在使用tsx写vue组件时，vite build将css注入js中，但unocss并未生产对应转换的css被一起注入,才有了这个库

Install

npm i unplugin-inspector-lib-css -D

🌈 Usage

// vite.config.ts
import { vitePlugn as vitePluginTransformToUnocss } from 'unplugin-inspector-lib-css'
export default defineConfig({
  plugins: [vitePluginTransformToUnocss(/* options */)],
})

// rollup.config.js
import { resolve } from 'path'
import { vitePlugn as rollupTransformToUnocss } from 'unplugin-inspector-lib-css'
export default {
  plugins: [rollupTransformToUnocss(/* options */)],
}

// webpack.config.js
module.exports = {
  /* ... */
  plugins: [
    require('unplugin-inspector-lib-css').webpackPlugin({
      /* options */
    }),
  ],
}

// vue.config.js
module.exports = {
  configureWebpack: {
    plugins: [
      require('unplugin-inspector-lib-css').webpackPlugin({
        /* options */
      }),
    ],
  },
}

// esbuild.config.js
import { build } from 'esbuild'
import { vitePlugn as esbuilPlugin } from 'unplugin-inspector-lib-css'

build({
  plugins: [esbuilPlugin(/* options */)],
})

Warning

• ts | js | tsx | jsx 文件中头部需要加上// @unocss-include否则不会被注入

:coffee:

:question: 问题

issues

依赖

unocss