Every time I compile my SCSS files, I get this error message:
Browserslist: caniuse-lite is outdated. Please run next command npm update caniuse-lite browserslist
After seeing the message, I ran the command npm update caniuse-lite browserslist, but the error remains. I’ve also attempted the following troubleshooting steps:
Deleted the entire node_modules directory and reinstalled
Used npm update to refresh all packages
Reinstalled both autoprefixer and browserslist
Edited package.json to the latest versions of the packages
Interestingly, when I remove this section from my compilerconfig.json file:
"options": {
"autoPrefix": "> 1%"
}
The compilation goes through without any problems. This hints that it might be an issue with autoprefixer. Has anyone encountered this situation and discovered a solution?
try npx browserslist@latest --update-db instead of npm update. it helps refresh the caniuse database properly when the normal updates don’t do the trick. that’s why ur error keeps showing up, ur local db isn’t syncing right even after updating everything.
I experienced a similar issue previously. A potential solution is to clear your npm cache using npm cache clean --force. After that, you should delete the node_modules folder and package-lock.json, then reinstall your dependencies. Npm cache can sometimes retain outdated data that can lead to errors. Additionally, verify that you don’t have conflicting versions of autoprefixer installed both globally and locally, which can complicate things. If these steps don’t resolve the issue, consider downgrading autoprefixer to a stable earlier version as a temporary fix.
Had this exact problem last month. The issue was my package manager mixing up global and local browserslist configs. Check if you’ve got a .browserslistrc file in your project root or browserslist config in package.json that’s conflicting with your autoprefixer settings. Your > 1% syntax in compilerconfig.json should work fine, but multiple browserslist configs can clash. Run npx browserslist in your project directory to see what browsers you’re actually targeting. If the results look weird, you’ve probably got overlapping configs. Also check your autoprefixer version - I had to rollback from 10.4.x to 10.3.x because of similar database sync issues.