vite-plugin-filter-css-moudle
TypeScript icon, indicating that this package has built-in type declarations

1.2.9 • Public • Published

vite-plugin-filter-css-moudle

主要解决 vite 在 react 和 preact 中的使用,主要解决增加.module.xx 的问题,同时可以对不同目录下的 css-module 进行处理,解决样式覆盖问题,目前已经可以设置正常热更新和打包

#安装 pnpm add -D vite-plugin-filter-css-moudle

npm i -D vite-plugin-filter-css-moudle

#使用 例如,对于 src 目录下的 components 这些公用组件,我想覆盖样式,那文件名就不能有 hash 值 其它的业务中的文件我不需要覆盖此时要加上 hash 防止重复

import vitePluginTransformFilterCssModule from 'vite-plugin-filter-css-moudle';
plugins:[
  vitePluginTransformCssModule([
      {
        test: /src\/components\/([a-z\-]+\/)*[a-z\-]+\.s[ac]ss$/i,
        modules: {
          generateScopedName: 'cy_[local]',
        },
      },
      {
        test: /\.s[ac]ss$/i,
        modules: {
          generateScopedName: '[path]___[local]___[hash:base64:5]',
        },
      }
  ])
]

注意:目前开发环境和打包都可以正常使用,没有加 souremap,优先级按照配置顺序进行,希望能帮助大家

Package Sidebar

Install

npm i vite-plugin-filter-css-moudle

Weekly Downloads

2

Version

1.2.9

License

ISC

Unpacked Size

951 kB

Total Files

5

Last publish

Collaborators

  • crazy-code