How to Disable Stylus
-
Hello guys, there is any way to disable the styl css files?
I’ve already removed the ‘app.styl’ from quasar.conf.js but the ‘quasar.mat.styl’ is still being included when the pages loads.
There is no description how to do it on the documentation and I feel like the usage of such thing as Stylus should be optional and easily enabled and disabled from quasar.conf.js. -
Welp, I still had not found a good way to disable it.
Anyone has any clue how to do it?
-
This is my current code to remove the insertion of the style from stylus mat/ios (and is atrocious the need of this kind of script to do that imo):
<script type=“text/javascript”>
window.onload = function(){
var tag = document.getElementsByTagName(“style”);
var searchText = “Edit /src/css/themes instead”;
for (var i = 0; i < tag.length; i++) {
if (tag[i].innerHTML.indexOf(searchText) !== -1) {
tag[i].remove()
break;
}
}
}
</script> -
Quasar’s components themselves use the Stylus system for CSS generation and it’s core to the components. If you remove the Stylus CSS, you end up most likely with a big mess.
Are you trying to redesign with a different CSS system like SASS? Maybe this is helpful? https://v1.quasar-framework.org/quasar-cli/cli-documentation/handling-webpack#SASS%2FSCSS
Scott
-
But the default stylus for mat/ios will still be applied, right?
I dont know if I was clear, but the main problem i’m facing is that the current css for mat/ios is messing with my own css, and since the stylus has priority when the page is loaded, I had 2 options:1 - The ugly one: The script above
2 - The time unecessary time consuming : rewrite the css on stylus and making adaptations because of the default stylusI was searching for a 3rd one: disabling the insertion of this style i removed with option 1
-
If you are using SFCs, you can override anything Quasar is doing with your own CSS.
Scott
-
Yea, but I have the need to override styles that I did not needed there on the first place.
-
Can you give a concrete example?
Scott