search

marcj / css-element-queries

CSS Element-Queries aka Container Queries. High-speed element dimension/media queries in valid css.
http://marcj.github.io/css-element-queries/
MIT License
4.27k stars 487 forks source link

What is correct way to integrate ElementQueries to React using Webpack,Typescript and SASS? #242

Closed bonniss closed 4 years ago

bonniss commented 5 years ago

Hi guys, I'm trying to integrate the library to my React project generated by JHipster. I add cdn version of the library at : https://cdnjs.com/libraries/css-element-queries; Then i add a script at the end of body section of index.html:

<script>
        window.addEventListener('DOMContentLoaded', function(event){
            ElementQueries.listen();
        });        
</script>

I have checked in the console, ElementQueries has loaded correctly; But when i change SASS file like the 1st example of the page: http://marcj.github.io/css-element-queries/ , nothing happens; Since I'm quite fresh to React and Typescript, any help would be appreciated!

marcj commented 5 years ago

Can you setup a jsfiddle somewhere to reproduce it?

marcj commented 5 years ago

listen() already listens on that event. So it would never be triggered. Try following instead.

<script>
    ElementQueries.listen();
</script>

However, if you <script src="ElementQueries.js"> it will listen automatically. If nothing happens, you should provide a jsfiddle, or I need to close that issue unfortunately.