mern-starter icon indicating copy to clipboard operation
mern-starter copied to clipboard

Issues composing CSS Modules

Open brosewarne opened this issue 8 years ago • 1 comments

Hey guys, awesome work on the boilerplate :+1:

However there are a few issues with using composes and CSS modules.

  1. Issue 193 is still valid. Repro:
  2. Node 6.2.2 + npm 3.9.5 + Windows (I only have windows to test on at the moment)
  3. clone current repo and run npm install
  4. Move the contents of the .container class from client/modules/App.css to client/modules/test.css as .test {...} and change client/modules/App.css to .container { composes: test from "./test.css" }
  5. npm run start - same error as issue 193 regarding __webpack_require__ appears However... If you start the project using the code from the repo and then make the above changes, it works after the hot module reloader has done it's thing, but it won't work if you stop and restart.

This seems like a recent issue as our project that's based off a slightly older version of Mern doesn't display this issue. However it was present when using the latest Mern repo to get this bug report together for the issues below.

  1. import vs requires for css After installing the new extract-text-webpack-plugin and making the change from entry to hasRuntime() in chunk-manifest-webpack-plugin, trying to run the bs command results in Module parse failed for each css import by a js file.

Changing the imports to require() fixes this error, but seems like a step back.

  1. After changing css imports to requires, running bs seems to build fine, but the built app won't start. You get errors like:
"container": "App__container__15uqt " + __webpack_require__(0).locals["test"] + ""
                                                                   ^
TypeError: Cannot read property 'test' of undefined
    at Object.<anonymous> (C:\ctm\mern-starter-master\dist\server.bundle.js:1057:72)

The production css seems to build correctly, but instead of adding the generated css classname for .test in the server bundle it's trying to look it up from a module - in this case __webpack_require__(0) is react.

This is the error I was initially going to raise, the others appeared whilst trying to replicate the issue on the lasted Mern repo. Any help or guidance that anyone can provide will be most appreciated :+1:

brosewarne avatar Jul 18 '16 05:07 brosewarne

@rosariorussell you wan to take a look at this one?

mannyhenri avatar Jun 02 '18 05:06 mannyhenri