The 'postcss-import plugin cannot parse the @import syntax in LESS styles within Vue files'

[ly-yewu]

It can parse LESS variables but cannot recognize the @import syntax

My part configuration of rollup.config.js:

alias({
  entries: [{ find: '@', replacement: resolvePath('alias','../src') }]
}),
vue({
  css: true,
  compileTemplate: true,

}),
postcss({
  extensions: ['.css','.less'],
  plugins:[
    postcssImport({
      resolve(id){
        console.log(id)
        if(id.startsWith('@/')){
          const resolvedPath = resolvePath('../src/' + id.slice(2));
          console.log(`Resolving @ path: ${id} -> ${resolvedPath}`);
          return resolvedPath;
        }
        return resolvePath('no@',id)
      }
    })
  ],
  use:[
    ['less',{
      modifyVars: {
        hack: `true; @import (reference) "${resolvePath('../src/style/variable.less')}";`
      },
      javascriptEnabled: true,
    }]
  ],
}),

[ly-yewu]

Why does the console.log(id) statement in resolve function not execute?