how to import or require CSS file conditionally eg(According to IOS version)

Viewed 26
checkVersion() {
        if (typeof window !== 'undefined' && window && window.navigator && window.navigator !== undefined) {
            let agent = window.navigator.userAgent, start = agent.indexOf("OS");
            if ((agent.indexOf("iPhone") > -1 || agent.indexOf("iPad") > -1) && start > -1) {
                return window.Number(agent.substr(start + 3, 3).replace("_", "."))
            }
            return 0;
        }
        },
const checkVersion = Common.checkVersion();
require("../assets/style.css");
require("../assets/style2.css");
require("../assets/sprite.css");
require("../assets/ondemandpagestyle.css");
require("../assets/newstyle.css");
require("../assets/landingpage.css");
     if (checkVersion <= 14) {
    require("../assets/styleIOSUpgrade.css");
}

Here u see I have require the last CSS file conditionally(according to IOS version) , here i have used CheckVersion function to detect the Ios version and according to it and i have require the different CSS file

1 Answers
checkVersion() {
        if (typeof window !== 'undefined' && window && window.navigator && window.navigator !== undefined) {
            let agent = window.navigator.userAgent, start = agent.indexOf("OS");
            if ((agent.indexOf("iPhone") > -1 || agent.indexOf("iPad") > -1) && start > -1) {
                return window.Number(agent.substr(start + 3, 3).replace("_", "."))
            }
            return 0;
        }
        },
const checkVersion = checkVersion();
require("../assets/style.css");
require("../assets/style2.css");
require("../assets/sprite.css");
require("../assets/ondemandpagestyle.css");
require("../assets/newstyle.css");
require("../assets/landingpage.css");
     if (checkVersion <= 14) {
    require("../assets/styleIOSUpgrade.css");
}

U can use above code to require CSS file conditionally

Related