indexiatech / re-notif

Redux & React based Notifications center.
http://indexiatech.github.io/re-notif
BSD 3-Clause "New" or "Revised" License
148 stars 45 forks source link

Universal/Isomorphic server doesn't recognize the styles.css #52

Closed ViniciusTavares closed 7 years ago

ViniciusTavares commented 7 years ago

Hello guys!

I'm trying to use these notifications on a Universal React App, but when I try turning my server on, I get this error:

C:\Users\Natalia\Desktop\Vinicius\Dev\Real-Time-Notes-With-Universal-Redux-NodeJS-SocketIO-Mongoose\node_modules\redux-notifications\lib\styles.css:1 .notif-transition-enter { ^ ParseError: Unexpected token

My webpack apparently is working well, there isn't any warning / error on its process. Below my webpack loaders:

module: { loaders: [ { test: /.js?$/, loader: 'babel-loader' }, { test: /.css/, loaders: [ 'isomorphic-style-loader', css-loader?${JSON.stringify({ // CSS Loader https://github.com/webpack/css-loader importLoaders: 1, sourceMap: true, // CSS Modules https://github.com/css-modules/css-modules modules: true, localIdentName: true ? '[name]-[local]-[hash:base64:5]' : '[hash:base64:5]', // CSS Nano http://cssnano.co/options/ minimize: !true, discardComments: { removeAll: true }, })}, ], } ],

I've tested some css files importing them into a component and they've worked correctly.

hackjutsu commented 7 years ago

Same here, webpack + electron + react + redux

<some_path>/node_modules/redux-notifications/lib/styles.css:1 
Uncaught SyntaxError: Unexpected token .

Should we optimize how the code consumes the .css file? It looks like it is handled as JS code which introduces syntax error.

krvital commented 7 years ago

I think that right decision will be removing import and export styles.css from index.js People, who need this styles.css will just import styles.css directly by full path

Mlobaievskyi commented 7 years ago

I had this issue too with universal structure. I solved it by adding externals: [nodeExternals({ whitelist: [/^redux-notifications/] })], in server.config.js so this module can be parsed via webpack. Now everything works fine. nodeExternals - 'webpack-node-externals'

sattaman commented 7 years ago

I'm getting this error just using browserify + gulp since importing css files is not supported

sattaman commented 7 years ago

I've created a PR https://github.com/indexiatech/re-notif/pull/55

kylecesmat commented 7 years ago

closed by #56

kylecesmat commented 7 years ago

This has been released in 4.0.0