ReferenceError: window is not defined import css

Question

Tried to import css in react js applciation but it throws below error

this is a dashboard application where node js at server side and react js in client side

webpack.base.js

  module.exports = {
    //Running babel to every file
    module: {
        rules: [
            {
                test: /\.js?$/,
                loader: 'babel-loader',
                exclude: /node_modules/,
                options: {
                    presets: [
                        'react',
                        'stage-0',
                        ['env', { targets: { browsers: ['last 2 versions'] } }]
                    ]
                }
            }, {
                test: /\.css$/,
                loader: "style-loader!css-loader"
            }, {
                test: /\.(jpe?g|png|gif|woff|woff2|eot|ttf|svg)(\?[a-z0-9=.]+)?$/,
                loader: 'url-loader?limit=100000'
            }

        ]
    }//end module
}

style.css

.segment {
    border-top:14px solid #14a767;
    border-bottom: 3px solid #14a767;
    margin: 2px 2px 2px 140px;
    width: 80%
 }

Home.js (component)

import '../../css/style.css'
        return window && document && document.all && !window.atob;
        ^

ReferenceError: window is not defined

What are you trying to achieve? The error is not related to your CSS, it is related to your JS code... — Bruno Monteiro, May 28 '19 at 04:50
Where did you put `return window && document && document.all && !window.atob;` inside the component — Tenusha Guruge, May 28 '19 at 04:58
@Tenusha :: ``` return window && document && document.all && !window.atob; ``` it's error — Kuppusamy k, May 28 '19 at 07:09
if you are using it inside a function like this, `f1 = function(){ return window && document && document.all && !window.atob }`. It will be executed successfully and returns `HTMLAllCollection` object. — Tenusha Guruge, May 28 '19 at 10:16

score 0 · Answer 1 · answered May 29 '19 at 02:13

Actual problem was i have used semantic UI react node module , and that have own style on each component. So that's y it didnt allow me to create a css with class styles,.,. so instead of class style , i have used ID and it's working cool .,

My exact problem is this one ::: custom className semantic ui react

ReferenceError: window is not defined import css

1 Answers1