import @lingui/loader return empty object

Question

I am using lingui for my translation in my refine app. I a po file inside locales folder that has some key and the translation like this

#: ../internal-tools/pages/dashboard/index.tsx:332
msgid "greeting"
msgstr "Helo"

and the function that load the .po file is look like this

const loadCatalogMessages = async (locale: string) => {
  const { messages } = await import(`@lingui/loader!./locales/id.po`);
  console.log('--- LOAD MESSAGE ---', messages);
  return messages;
}

when I try to log it out, it return an empty object. This is strange because I have tried this syntax in another project and it runs without problem

I am expecting the variable messages to return the actual result of the .po file not an empty object