How to hide or Fix; `typescript: File is a CommonJS module; it may be converted to an ES module.`

In the case of a file written in the CommonJS syntax, TypeScript may display the following message:

File is a CommonJS module; it may be converted to an ES module.

This message is neither an error nor a warning, but simply indicates that TypeScript may convert the file written in CommonJS syntax to ES syntax.

Therefore, there is no need to make any modifications, but you may not necessarily want to see this message.

How can you hide it or resolve it completely? Here are the steps:

• VSCode

  • Converting from CJS to ES

    • When you hover over the three dots, the following QuickFix should appear.

    

    • Click on the light bulb icon to convert to ES syntax.

      //-- CommonJS --//
      module.exports = {
        plugins: {
          tailwindcss: {},
          autoprefixer: {},
        },
      }
    
      //-- ES --//
      export const plugins = {
        tailwindcss: {},
        autoprefixer: {},
      };
    

    • Note
      • Converting to ES syntax may cause the code to stop working.
      • For example, a file named next.config.js will not start Next's development server in ES syntax.
      • Please refer to the official explanation

  • Disabling the feature

    • If you simply want to hide the message, set the following configuration to False. From Stack Overflow.

    

• Neovim

  • Converting from CJS to ES

    • Use the LSP code action. The following screenshot is from my environment.

    

    • It will convert from CommonJS to ES.

      //-- CommonJS --//
      module.exports = {
        plugins: {
          tailwindcss: {},
          autoprefixer: {},
        },
      }
    
      //-- ES --//
      export const plugins = {
        tailwindcss: {},
        autoprefixer: {},
      };
    

    • Note when converting
      • Converting to ES syntax may cause the code to stop working.
      • For example, a file named next.config.js will not start Next's development server in ES syntax.
      • Please refer to the official explanation

  • Disabling the feature

    • I couldn't find if there is a feature to disable the message like in VSCode.

• Summary
  • I explained how to resolve the message: typescript: File is a CommonJS module; it may be converted to an ES module.
  • There are two ways to resolve this message:
    • Convert from CommonJS to ES.
    • Disable the message display (VSCode only).
  • However, since it is not a critical message that requires immediate action, ignoring it and continuing would be the best approach in the end.