No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    How to Disable Stylus

    CLI
    2
    8
    1001
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • A
      andrewl94 last edited by

      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.

      1 Reply Last reply Reply Quote 1
      • A
        andrewl94 last edited by

        Welp, I still had not found a good way to disable it.

        Anyone has any clue how to do it?

        1 Reply Last reply Reply Quote 0
        • A
          andrewl94 last edited by

          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>

          1 Reply Last reply Reply Quote 0
          • s.molinari
            s.molinari last edited by s.molinari

            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

            1 Reply Last reply Reply Quote 0
            • A
              andrewl94 last edited by

              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 stylus

              I was searching for a 3rd one: disabling the insertion of this style i removed with option 1

              1 Reply Last reply Reply Quote 0
              • s.molinari
                s.molinari last edited by

                If you are using SFCs, you can override anything Quasar is doing with your own CSS.

                Scott

                1 Reply Last reply Reply Quote 0
                • A
                  andrewl94 last edited by

                  Yea, but I have the need to override styles that I did not needed there on the first place.

                  1 Reply Last reply Reply Quote 0
                  • s.molinari
                    s.molinari last edited by

                    Can you give a concrete example?

                    Scott

                    1 Reply Last reply Reply Quote 0
                    • First post
                      Last post