Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

problem in vite: isExcludeFile may not be correctly set #85

Open
dora-lemon opened this issue Jul 22, 2022 · 6 comments
Open

problem in vite: isExcludeFile may not be correctly set #85

dora-lemon opened this issue Jul 22, 2022 · 6 comments

Comments

@dora-lemon
Copy link

dora-lemon commented Jul 22, 2022

Part of my vite.config.js:

import postCssPxToRem from 'postcss-pxtorem'
{
  ...,
  css: {
    postcss: {
      plugins: [
        postCssPxToRem({
          rootValue: 16,
          propList: ['*'],
          exclude: function (file) { return file.indexOf('Register') === -1; },
        }),
        {
          postcssPlugin: 'internal:charset-removal',
          AtRule: {
            charset: (atRule) => {
              if (atRule.name === 'charset') {
                atRule.remove();
              }
            }
          }
        },
      ]
    }
  }
}

Once and Declaration callback execution order can be like this:

filePath: Register.vue
transforming (652) node_modules\@babel\runtime\helpers\esm\defineProperty.js
filePath: List.vue
transforming (671) node_modules\ant-design-vue\es\_util\warning.js
filePath: Risk.vue
filePath: Verify.vue
filePath: Role.vue
transforming (687) node_modules\ant-design-vue\es\_util\vnode.js
filePath: Detail.vue

Register.vue declaration:
<ref *1> Declaration {
  raws: { before: '\n  ', between: ': ' },
  type: 'decl',
  parent: Rule {
    raws: { before: '\n\n', between: ' ', semicolon: true, after: '\n' },
    type: 'rule',
    nodes: [ [Circular *1], [Declaration], [Declaration], [Declaration] ],
    parent: Root {
      raws: [Object],
      type: 'root',
      nodes: [Array],
      source: [Object],
      lastEach: 2,
      indexes: [Object],
      [Symbol(isClean)]: false,
      [Symbol(my)]: true
    },
    source: { start: [Object], input: [Input], end: [Object] },
    selector: '.pife1-card',
    lastEach: 2,
    indexes: { '2': 1 },
    [Symbol(isClean)]: true,
    [Symbol(my)]: true
  },
...

In my case, i just want to include Register.vue and exclude all other files. However, if Once callback is not directly followed by corresponding Declaration callback, isExcludeFile would be true, it's not as what i expected.
I have glanced at all issues, but i didn't got a similar one.
I’d appreciate some help.

@hemengke1997
Copy link

any reproduction?

@hemengke1997
Copy link

/^(?!\.pife1-).*/.test('.pife1-card')   // false

@dora-lemon
Copy link
Author

any reproduction?

I made a mistake, i have edited my description.

@hemengke1997
Copy link

I tested it, it can achieve what you want

Maybe that you made a small mistake

@hemengke1997
Copy link

hemengke1997 commented Aug 29, 2022

If you are still stuck in this situation, you could try my fork repository: https://github.com/hemengke1997/postcss-pxtorem

Use it like:

// postcss.config.js
module.exports = {
  plugins: [
    require('@minko-fe/postcss-pxtorem')({
      rootValue: 16,
      propList: ['*'],
      exclude: function (file) { return !file.includes('Register'); }
    })
  ]
}

@woodThunder
Copy link

exclude有的时候正常有的时候不能过滤正常转为了rem,源码打印文件style里面import引入的样式,是拿不到的,请问你是咋解决的

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants