'How to disable "'flex' is not supported by Internet Explorer < 11. Add '-ms-flex' to support Internet Explorer 10+." in VS code?

My react project has a couple of "flex" compatibility errors. How to remove these errors in VS code? I already used postcss in my project.

enter image description here

'flex' is not supported by Internet Explorer < 11. Add '-ms-flex' to support Internet Explorer 10+.
'flex-direction' is not supported by Internet Explorer < 11. Add '-ms-flex-direction' to support Internet Explorer 10+.
'transform' is not supported by Internet Explorer < 10. Add '-ms-transform' to support Internet Explorer 9+.
cssvisual-studio-code


Solution 1:[1]

The Microsoft Edge Tools extension uses the webHint extension - which is apparently generating those error messages.

As suggested in installing edge generates warning messages from Webhints and offers no obvious recourse other than uninstalling it all you can try these methods to disable those warnings

  1. disable the setting Vscode-edge-devtools: Webhint but that will disable all error messages, not just those about IE11; or

After creating a hintrc file (https://webhint.io/docs/user-guide/configuring-webhint/summary/#create-a-hintrc-file):

You could turn off all CSS compat warnings with this .hintrc (pretty heavy-handed still):

{
    "extends": ["development"],
    "hints": {
        "compat-api/css": "off"
    }
}

Or you could adjust your target browsers to exclude browsers you don't care about (maybe Internet Explorer?) with this .hintrc:

{
    "extends": ["development"],
    "browserslist": ["defaults", "not IE 11"]
}

Or you could ignore just the backdrop-filter CSS property and still get feedback for others with this .hintrc:

{
    "extends": ["development"],
    "hints": {
        "compat-api/css": ["default", {
            "ignore": ["backdrop-filter"]
        }]
    }
}

Or you should be able to disable those error messages by setting an environment variable, see Setting properties using environment variables

Possibly this environment variable, but I haven't tried it:

"webhint_browserlist_" = ["defaults", "not IE 11"]

Solution 2:[2]

You can just uninstall the Microsoft edge tools and restart the editor.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Mark
Solution 2 Frr Aroua

Related Questions