search

gajus / babel-plugin-react-css-modules

Transforms styleName to className using compile time CSS module resolution.
Other
2.05k stars 162 forks source link

"ParseError: Unexpected token" - using v3.3.3 + Browserify v16.1.0 #162

Open basher opened 6 years ago

basher commented 6 years ago

Please see https://github.com/basher/react-no-webpack

This is a simple React UI library POC. I want to use CSS Modules without using Webpack.

The error happens when parsing https://github.com/basher/react-no-webpack/blob/master/src/lib/components/WidgetCSS/WidgetCSS.css

This is imported inside https://github.com/basher/react-no-webpack/blob/master/src/lib/components/WidgetCSS/WidgetCSS.js

I'm simply executing build or watch commands from "package.json" - e.g. browserify ./src/index.js -o ./build/bundle.js -t babelify

KITSKevinBonett commented 6 years ago

The docs for this plugin clearly state: Note: The default configuration should work out of the box with the css-loader.

So do I need to still add any other config options in my .babelrc to parse CSS files?

I've done some more investigation...

"npm run lib" ouptuts https://github.com/basher/react-no-webpack/blob/master/lib/components/WidgetCSS/WidgetCSS.js with generated className property. So Babel works OK.

The issue is with "run build" and "run watch" commands which use Browserify + Babelify.

KITSKevinBonett commented 6 years ago

I have a workaround now - I've replaced babel-plugin-react-css-modules with css-modulesify.

"package.json" setup here - https://github.com/basher/react-no-webpack/blob/master/package.json