vite-plugin-style-import插件的使用

vite-plugin-style-import介绍:是一款Vite插件,它可以帮助我们在使用element-plus组件库时,自动引入组件的样式。

1.先使用 npm install consola -D ,解决插件所需的依赖

2.再安装 npm install vite-plugin-style-import -D

3.在vite.config.ts配置插件,即可成功使用

// vite.config.ts
import {
  createStyleImportPlugin,
  ElementPlusResolve
} from 'vite-plugin-style-import'
 
export default {
  plugins: [
    createStyleImportPlugin({
      resolves: [ElementPlusResolve()],
      libs: [
        {
          libraryName: 'element-plus',
          esModule: true,
          resolveStyle: (name: string) => {
            return `element-plus/theme-chalk/${name}.css`
          }
        }
      ]
    })
  ]
};

 

 

 

 

 

你可能感兴趣的:(TypeScript,项目集,vue3,前端,javascript,vue.js,typescript)