react-generic-app throws webpack unexpected token error on HelloWorld.module.css

[noahspan]

Category

[ ] Question
[x] Bug
[ ] Enhancement

Expected or Desired Behavior

Trying to run react-generic-app after initial download and install of npm packages.

Observed Behavior

Error - [webpack] 'dist':
./lib/components/HelloWorld/HelloWorld.module.css
Module parse failed: C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\lib\components\HelloWorld\HelloWorld.module.css Unexpected token (1:0)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (1:0)
at Parser.pp$4.raise (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\acorn\dist\acorn.js:2221:15)
at Parser.pp.unexpected (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\acorn\dist\acorn.js:603:10)
at Parser.pp$3.parseExprAtom (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\acorn\dist\acorn.js:1822:12)
at Parser.pp$3.parseExprSubscripts (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\acorn\dist\acorn.js:1715:21)
at Parser.pp$3.parseMaybeUnary (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\acorn\dist\acorn.js:1692:19)
at Parser.pp$3.parseExprOps (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\acorn\dist\acorn.js:1637:21)
at Parser.pp$3.parseMaybeConditional (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\acorn\dist\acorn.js:1620:21)
at Parser.pp$3.parseMaybeAssign (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\acorn\dist\acorn.js:1597:21)
at Parser.pp$3.parseExpression (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\acorn\dist\acorn.js:1573:21)
at Parser.pp$1.parseStatement (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\acorn\dist\acorn.js:727:47)
at Parser.pp$1.parseTopLevel (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\acorn\dist\acorn.js:638:25)
at Parser.parse (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\acorn\dist\acorn.js:516:17)
at Object.parse (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\acorn\dist\acorn.js:3098:39)
at Parser.parse (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\webpack\lib\Parser.js:902:15)
at DependenciesBlock. (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\webpack\lib\NormalModule.js:104:16)
at DependenciesBlock.onModuleBuild (C:\Users\SpannbN\Documents\Visual Studio 2015\Projects\react-generic-app2\node_modules\webpack-core\lib\NormalModuleMixin.js:310:10)
@ ./lib/components/HelloWorld/HelloWorld.module.scss.js 4:0-34

Steps to Reproduce

Downloaded react-generic-app, ran 'npm install', ran 'gulp serve'

[waldekmastykarz]

The sample code misses CSS loader for webpack. I've submitted a PR with the fix.

[ronaldborman]

@waldekmastykarz Isn't style-loader required as well? In my case although the error is resolved the styles are not applied. After installing and referencing style-loader the component is displayed properly.