css-modules use case about webpack-isomorphic-tools HOT 49 CLOSED

  "assets": {
    "./assets/index.scss": "exports = module.exports = require(\"./../node_modules/css-loader/lib/css-base.js\")();\n// imports\nexports.i(require(\"-!./../node_modules/css-loader/index.js?modules&importLoaders=2&sourceMap&localIdentName=[local]___[hash:base64:5]!./../node_modules/autoprefixer-loader/index.js?browsers=last 2 version!./../node_modules/sass-loader/index.js?outputStyle=expanded&sourceMap=true&sourceMapContents=true!normalize.css/normalize.css\")

"./assets/index.scss":"// removed by extract-text-webpack-plugin"

-!./../node_modules/css-loader/index.js?modules&importLoaders=2&sourceMap&localIdentName=[local]___[hash:base64:5]!./../node_modules/autoprefixer-loader/index.js?browsers=last 2 version!./../node_modules/sass-loader/index.js?outputStyle=expanded&sourceMap=true&sourceMapContents=true!normalize.css/normalize.css

[webpack-isomorphic-tools] [debug] entering development mode
[webpack-isomorphic-tools] [debug] registering require() hooks for assets
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.jpeg
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.jpg
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.png
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.gif
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.svg
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.ttf
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.woff
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.woff2
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.svg
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.less
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.scss
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.sass
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.styl
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.css
[webpack-isomorphic-tools] [debug] require() called for C:\Users\david\www\projects\STI\v3.1\assets\index.scss
[webpack-isomorphic-tools] [debug]  requiring ./assets/index.scss
C:\Users\david\www\projects\STI\v3.1\assets\index.scss:9
; module.exports = exports.locals; module.exports._style = exports.toString()
                                                         ^

TypeError: Cannot set property '_style' of undefined
    at Object.<anonymous> (C:\Users\david\www\projects\STI\v3.1\assets\index.scss:9:58)
    at Module._compile (module.js:425:26)
    at Object.Module._extensions.(anonymous function) [as .scss] (C:\Users\david\www\projects\STI\v3.1\node_modules\webpack-isomorphic-tools\babel-transpiled-modules\tools\node-hook.js:100:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:311:12)
    at Module.require (module.js:366:17)
    at require (module.js:385:17)
    at Object.<anonymous> (C:/Users/david/www/projects/STI/v3.1/src/common/pages/App/App.react.js:3:38)
    at Module._compile (module.js:425:26)
    at normalLoader (C:\Users\david\www\projects\STI\v3.1\node_modules\babel-core\lib\api\register\node.js:199:5)
    at Object.require.extensions.(anonymous function) [as .js] (C:\Users\david\www\projects\STI\v3.1\node_modules\babel-core\lib\api\register\node.js:216:7)

npm install webpack-isomorphic-tools@latest --save

└── [email protected]

-!./../node_modules/css-loader/index.js?modules&importLoaders=2&sourceMap&localIdentName=[local]___[hash:base64:5]!./../node_modules/autoprefixer-loader/index.js?browsers=last 2 version!./../node_modules/sass-loader/index.js?outputStyle=expanded&sourceMap=true&sourceMapContents=true!normalize.css/normalize.css

Module not found: Error: Cannot resolve 'file' or 'directory' ./normalize.css/normalize.css in G:\work\webapp\assets\sty
les
resolve file
  G:\work\webapp\assets\styles\normalize.css\normalize.css.json doesn't exist
  G:\work\webapp\assets\styles\normalize.css\normalize.css.js doesn't exist
  G:\work\webapp\assets\styles\normalize.css\normalize.css doesn't exist
resolve directory
  G:\work\webapp\assets\styles\normalize.css\normalize.css doesn't exist (directory default file)
  G:\work\webapp\assets\styles\normalize.css\normalize.css\package.json doesn't exist (directory description file)
[G:\work\webapp\assets\styles\normalize.css\normalize.css.json]
[G:\work\webapp\assets\styles\normalize.css\normalize.css.js]
[G:\work\webapp\assets\styles\normalize.css\normalize.css]
 @ ./~/css-loader?importLoaders=2&sourceMap!./~/autoprefixer-loader?browsers=last 2 version!./~/sass-loader?outputStyle=
expanded&sourceMap=true&sourceMapContents=true!./assets/styles/style.scss 3:10-294
webpack built 0a864dbd15e95aead96c in 1297ms

// webpack.config.js

const developmentConfig = {
  context: __dirname,

  devtool: 'eval',

  entry: [
    // Hot reload
    'webpack-dev-server/client?http://localhost:8080',
    'webpack/hot/dev-server',

    // App entry
    path.join(__dirname, 'client/index.js')
  ],

  module: {
    loaders: [{
      test: /\.js$/,
      exclude: /node_modules/,
      loader: 'babel'
    }, {
      test: /\.css$/,
      loader: 'style-loader!css-loader!postcss-loader'
    }]
  },

  postcss: function() {
    return [rucksack, lost, autoprefixer, scss];
  },

  output: {
    path: path.join(__dirname, 'client/build'),
    filename: 'bundle.js',
    publicPath: '/build/'
  },

  // Hot module replacement
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    webpackIsomorphicToolsPlugin
  ]
};

// webpack.isomorphic.tools.configuration.js

import WebpackIsomorphicToolsPlugin from 'webpack-isomorphic-tools/plugin'

export default {
  debug: true,
  assets: {
    css: {
      extensions: ['css'],
      parser: WebpackIsomorphicToolsPlugin.css_loader_parser // see Configuration and API sections for more info on this parameter
    },
    images: {
      extensions: ['png', 'jpg', 'gif', 'ico', 'svg'],
      parser: WebpackIsomorphicToolsPlugin.url_loader_parser // see Configuration and API sections for more info on this parameter
    }
  }
}

[webpack-isomorphic-tools] [debug] entering development mode
[webpack-isomorphic-tools] [debug] registering require() hooks for assets
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.css
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.png
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.jpg
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.gif
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.ico
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.svg
[webpack-isomorphic-tools] [debug] require() called for /Users/christiansakai/Desktop/overreact/common/components/Todo/Filter/Filter.css
[webpack-isomorphic-tools] [debug]  requiring ./common/components/Todo/Filter/Filter.css
module.js:338
    throw err;
    ^

Error: Cannot find module '!!./../../../../node_modules/css-loader/index.js!./../../../../node_modules/postcss-loader/index.js!./Filter.css'
    at Function.Module._resolveFilename (module.js:336:15)
    at Function.Module._load (module.js:286:25)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/Users/christiansakai/Desktop/overreact/common/components/Todo/Filter/Filter.css:4:15)
    at Module._compile (module.js:434:26)
    at Object.Module._extensions.(anonymous function) [as .css] (/Users/christiansakai/Desktop/overreact/node_modules/webpack-isomorphic-tools/babel-transpiled-modules/tools/node-hook.js:100:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/Users/christiansakai/Desktop/overreact/common/components/Todo/Filter/Filter.js:23:3)

  // debug: true,

└── [email protected]

C:\Users\david\www\_github\babel-react-redux-universal [master +0 ~1 -0]> gulp
[18:30:37] Requiring external module babel-core/register
[18:30:38] Using gulpfile ~\www\_github\babel-react-redux-universal\gulpfile.babel.js
[18:30:39] Starting 'env'...
[18:30:39] Finished 'env' after 52 μs
[18:30:39] Starting 'server'...
[18:30:39] Starting 'webpack-server'...
[bg] Starting node ./bin/webpackDevServer.js
[18:30:39] Finished 'webpack-server' after 74 ms
[18:30:39] Starting 'server-nodemon'...
[18:30:39] Finished 'server-nodemon' after 1.05 ms
[18:30:39] Finished 'server' after 82 ms
[18:30:39] Starting 'default'...
[18:30:39] Finished 'default' after 3.61 μs
[require-hook] [warning] -------------------------------------------------------------
[require-hook] [warning] Overriding require() hook for file extension .svg
[require-hook] [warning] -------------------------------------------------------------
==> Webpack development server listening at http://localhost:8082
C:\Users\david\www\_github\babel-react-redux-universal\node_modules\webpack-isomorphic-tools\babel-transpiled-modules\index.js:376
                        source = 'module.exports = ' + _toolsSerializeJavascript2['default'](result);
                                                                                             ^

ReferenceError: result is not defined
    at webpack_isomorphic_tools.postprocess (C:\Users\david\www\_github\babel-react-redux-universal\node_modules\webpack-isomorphic-tools\babel-transpiled-modules\index.js:376:73)
    at webpack_isomorphic_tools.require (C:\Users\david\www\_github\babel-react-redux-universal\node_modules\webpack-isomorphic-tools\babel-transpiled-modules\index.js:355:15)
    at C:\Users\david\www\_github\babel-react-redux-universal\node_modules\webpack-isomorphic-tools\babel-transpiled-modules\index.js:297:18
    at Object._module3.default._extensions.(anonymous function) [as .scss] (C:\Users\david\www\_github\babel-react-redux-universal\node_modules\webpack-isomorphic-tools\babel-transpiled-modules\tools\require hacker.js:206:17)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:311:12)
    at Module.require (module.js:366:17)
    at require (module.js:385:17)
    at Object.<anonymous> (C:/Users/david/www/_github/babel-react-redux-universal/src/common/pages/App/App.react.js:3:38)
    at Module._compile (module.js:425:26)
 Hash: 789361d85c7f57858d3a
Version: webpack 1.12.2
Time: 4895ms
                      Asset     Size  Chunks             Chunk Names
app-789361d85c7f57858d3a.js  8.49 MB       0  [emitted]  app
######################## PATCHED ########################
######################## PATCHED ########################
webpack built 789361d85c7f57858d3a in 4895ms
[require-hook] [warning] -------------------------------------------------------------
[require-hook] [warning] Overriding require() hook for file extension .svg
[require-hook] [warning] -------------------------------------------------------------
==> Api is available at /api/v1
==> Frontend is available at /
==> Open http://localhost:8081 in a browser to view the app.

This one is ok from my point of view, because css-loader modules option only enable local scope by default, but you can use css-loader with modules off and then default is global, but you can use :local selector to "use css-modules"

[webpack-isomorphic-tools] [debug] instantiated webpack-isomorphic-tools with options {
  "debug": true,
  "assets": {
    "css": {
      "extensions": [
        "css"
      ]
    },
    "images": {
      "extensions": [
        "png",
        "jpg",
        "gif",
        "ico",
        "svg"
      ]
    }
  },
  "webpack_assets_file_path": "webpack-assets.json"
}
[webpack-isomorphic-tools] [debug] entering development mode
[webpack-isomorphic-tools] [debug] registering require() hooks for assets
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.css
[require-hook] [debug] Hooking into *.css files loading
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.png
[require-hook] [debug] Hooking into *.png files loading
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.jpg
[require-hook] [debug] Hooking into *.jpg files loading
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.gif
[require-hook] [debug] Hooking into *.gif files loading
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.ico
[require-hook] [debug] Hooking into *.ico files loading
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.svg
[require-hook] [debug] Hooking into *.svg files loading
[require-hook] [debug] Hooking into *.webpack-module files loading
[require-hook] [debug] Loading source code for /Users/christiansakai/Desktop/overreact/common/components/Todo/Filter/Filter.css
[webpack-isomorphic-tools] [debug] require() called for /Users/christiansakai/Desktop/overreact/common/components/Todo/Filter/Filter.css
[webpack-isomorphic-tools] [debug]  requiring ./common/components/Todo/Filter/Filter.css
/Users/christiansakai/Desktop/overreact/node_modules/core-js/modules/es6.symbol.js:127
  return _stringify.apply($JSON, args);
                    ^

RangeError: Maximum call stack size exceeded
    at Object.stringify (native)
    at Object.stringify (/Users/christiansakai/Desktop/overreact/node_modules/core-js/modules/es6.symbol.js:127:21)
    at Module._findPath (module.js:134:23)
    at Function.Require_hacker._module3.default._findPath (/Users/christiansakai/Desktop/overreact/node_modules/webpack-isomorphic-tools/babel-transpiled-modules/tools/require hacker.js:64:37)
    at Function.Module._resolveFilename (module.js:334:25)
    at Function.Module._load (module.js:286:25)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at /Users/christiansakai/Desktop/overreact/node_modules/webpack-isomorphic-tools/babel-transpiled-modules/index.js:239:24
    at Object.resolve (/Users/christiansakai/Desktop/overreact/node_modules/webpack-isomorphic-tools/babel-transpiled-modules/tools/require hacker.js:128:18)
    at Function.Require_hacker._module3.default._findPath (/Users/christiansakai/Desktop/overreact/node_modules/webpack-isomorphic-tools/babel-transpiled-modules/tools/require hacker.js:83:29)
    at Function.Module._resolveFilename (module.js:334:25)
    at Function.Module._load (module.js:286:25)

{
  "javascript": {
    "main": "/build/bundle.js"
  },
  "styles": {},
  "assets": {
    "./common/components/Todo/Filter/Filter.css": "var __webpack_public_path__ = \"/build/\"; // style-loader: Adds some css to the DOM by adding a <style> tag\n\n// load the styles\nvar content = require(\"!!./../../../../node_modules/css-loader/index.js!./../../../../node_modules/postcss-loader/index.js!./Filter.css\");\nif(typeof content === 'string') content = [[module.id, content, '']];\n// add the styles to the DOM\nvar update = require(\"!./../../../../node_modules/style-loader/addStyles.js\")(content, {});\nif(content.locals) module.exports = content.locals;\n// Hot Module Replacement\nif(module.hot) {\n\t// When the styles change, update the <style> tags\n\tif(!content.locals) {\n\t\tmodule.hot.accept(\"!!./../../../../node_modules/css-loader/index.js!./../../../../node_modules/postcss-loader/index.js!./Filter.css\", function() {\n\t\t\tvar newContent = require(\"!!./../../../../node_modules/css-loader/index.js!./../../../../node_modules/postcss-loader/index.js!./Filter.css\");\n\t\t\tif(typeof newContent === 'string') newContent = [[module.id, newContent, '']];\n\t\t\tupdate(newContent);\n\t\t});\n\t}\n\t// When the module is disposed, remove the <style> tags\n\tmodule.hot.dispose(function() { update(); });\n}",
    "./~/css-loader!./~/postcss-loader!./common/components/Todo/Filter/Filter.css": "var __webpack_public_path__ = \"/build/\"; exports = module.exports = require(\"./../../../../node_modules/css-loader/lib/css-base.js\")();\n// imports\n\n\n// module\nexports.push([module.id, \".filter {\\n  width: 600px;\\n  margin: 20px auto;\\n  display: block;\\n\\n}\\n\", \"\"]);\n\n// exports\n",
    "./common/components/Todo/Items/AddItem/AddItem.css": "var __webpack_public_path__ = \"/build/\"; // style-loader: Adds some css to the DOM by adding a <style> tag\n\n// load the styles\nvar content = require(\"!!./../../../../../node_modules/css-loader/index.js!./../../../../../node_modules/postcss-loader/index.js!./AddItem.css\");\nif(typeof content === 'string') content = [[module.id, content, '']];\n// add the styles to the DOM\nvar update = require(\"!./../../../../../node_modules/style-loader/addStyles.js\")(content, {});\nif(content.locals) module.exports = content.locals;\n// Hot Module Replacement\nif(module.hot) {\n\t// When the styles change, update the <style> tags\n\tif(!content.locals) {\n\t\tmodule.hot.accept(\"!!./../../../../../node_modules/css-loader/index.js!./../../../../../node_modules/postcss-loader/index.js!./AddItem.css\", function() {\n\t\t\tvar newContent = require(\"!!./../../../../../node_modules/css-loader/index.js!./../../../../../node_modules/postcss-loader/index.js!./AddItem.css\");\n\t\t\tif(typeof newContent === 'string') newContent = [[module.id, newContent, '']];\n\t\t\tupdate(newContent);\n\t\t});\n\t}\n\t// When the module is disposed, remove the <style> tags\n\tmodule.hot.dispose(function() { update(); });\n}",
    "./~/css-loader!./~/postcss-loader!./common/components/Todo/Items/AddItem/AddItem.css": "var __webpack_public_path__ = \"/build/\"; exports = module.exports = require(\"./../../../../../node_modules/css-loader/lib/css-base.js\")();\n// imports\n\n\n// module\nexports.push([module.id, \".input {\\n  width: 50%;\\n  margin-right: 2.5%;\\n}\\n\\n.button {\\n  width: 44.5%;\\n  border-radius: 5px;\\n\\n}\\n\\n.add-item {\\n  display: none;\\n}\\n\", \"\"]);\n\n// exports\n",
    "./common/components/Todo/Items/ItemsList/ItemsList.css": "var __webpack_public_path__ = \"/build/\"; // style-loader: Adds some css to the DOM by adding a <style> tag\n\n// load the styles\nvar content = require(\"!!./../../../../../node_modules/css-loader/index.js!./../../../../../node_modules/postcss-loader/index.js!./ItemsList.css\");\nif(typeof content === 'string') content = [[module.id, content, '']];\n// add the styles to the DOM\nvar update = require(\"!./../../../../../node_modules/style-loader/addStyles.js\")(content, {});\nif(content.locals) module.exports = content.locals;\n// Hot Module Replacement\nif(module.hot) {\n\t// When the styles change, update the <style> tags\n\tif(!content.locals) {\n\t\tmodule.hot.accept(\"!!./../../../../../node_modules/css-loader/index.js!./../../../../../node_modules/postcss-loader/index.js!./ItemsList.css\", function() {\n\t\t\tvar newContent = require(\"!!./../../../../../node_modules/css-loader/index.js!./../../../../../node_modules/postcss-loader/index.js!./ItemsList.css\");\n\t\t\tif(typeof newContent === 'string') newContent = [[module.id, newContent, '']];\n\t\t\tupdate(newContent);\n\t\t});\n\t}\n\t// When the module is disposed, remove the <style> tags\n\tmodule.hot.dispose(function() { update(); });\n}",
    "./~/css-loader!./~/postcss-loader!./common/components/Todo/Items/ItemsList/ItemsList.css": "var __webpack_public_path__ = \"/build/\"; exports = module.exports = require(\"./../../../../../node_modules/css-loader/lib/css-base.js\")();\n// imports\n\n\n// module\nexports.push([module.id, \".item-list {\\n  margin: 0;\\n  padding: 0;\\n}\\n\\n.item:after {\\n  content: '';\\n  display: table;\\n  clear: both;\\n}\\n\\n.item {\\n  list-style-type: none;\\n  padding: 10px;\\n}\\n\\n.item .text {\\n  display: block;\\n  float: left;\\n  margin-top: 10px;\\n  margin-left: 37px;\\n  font-weight: 400;\\n  color: rgba(0,0,0,0.8);\\n}\\n\\n.item .checkbox {\\n  display: block;\\n  float: left;\\n  width: auto;\\n  height: 100%;\\n  height: 40px;\\n}\\n\\n.item .button {\\n  display: block;\\n  width: 30px;\\n  height: 30px;\\n  float: right;\\n  background: none;\\n  border: 1px solid rgba(0,0,0,0.5);\\n  border-radius: 50%;\\n}\\n\\n.item .button:focus {\\n  outline: none;\\n}\\n\", \"\"]);\n\n// exports\n",
    "./common/components/Todo/Todo.css": "var __webpack_public_path__ = \"/build/\"; // style-loader: Adds some css to the DOM by adding a <style> tag\n\n// load the styles\nvar content = require(\"!!./../../../node_modules/css-loader/index.js!./../../../node_modules/postcss-loader/index.js!./Todo.css\");\nif(typeof content === 'string') content = [[module.id, content, '']];\n// add the styles to the DOM\nvar update = require(\"!./../../../node_modules/style-loader/addStyles.js\")(content, {});\nif(content.locals) module.exports = content.locals;\n// Hot Module Replacement\nif(module.hot) {\n\t// When the styles change, update the <style> tags\n\tif(!content.locals) {\n\t\tmodule.hot.accept(\"!!./../../../node_modules/css-loader/index.js!./../../../node_modules/postcss-loader/index.js!./Todo.css\", function() {\n\t\t\tvar newContent = require(\"!!./../../../node_modules/css-loader/index.js!./../../../node_modules/postcss-loader/index.js!./Todo.css\");\n\t\t\tif(typeof newContent === 'string') newContent = [[module.id, newContent, '']];\n\t\t\tupdate(newContent);\n\t\t});\n\t}\n\t// When the module is disposed, remove the <style> tags\n\tmodule.hot.dispose(function() { update(); });\n}",
    "./~/css-loader!./~/postcss-loader!./common/components/Todo/Todo.css": "var __webpack_public_path__ = \"/build/\"; exports = module.exports = require(\"./../../../node_modules/css-loader/lib/css-base.js\")();\n// imports\n\n\n// module\nexports.push([module.id, \".wrapper {\\n  width: 100%;\\n  height: 100%;\\n  background: #F5F5F5;\\n}\\n\\n.wrapper h1 {\\n  margin-top: 0;\\n  padding-top: 20px;\\n  text-align: center;\\n}\\n\\n.todo-list {\\n  width: 600px;\\n  margin: 0px auto;\\n  background: white;\\n  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 25px 50px 0 rgba(0, 0, 0, 0.1);\\n  position: relative;\\n}\\n\\n.todo-list input {\\n  width: 100%;\\n  box-shadow: inset 0 -2px 1px rgba(0,0,0,0.03);\\n  background: rgba(0, 0, 0, 0.003);\\n  padding: 16px 16px 16px 60px;\\n  border: none;\\n}\\n\\n.todo-list input:focus {\\n  outline: none;\\n}\\n\", \"\"]);\n\n// exports\n",
    "./client/assets/css/grid.css": "var __webpack_public_path__ = \"/build/\"; // style-loader: Adds some css to the DOM by adding a <style> tag\n\n// load the styles\nvar content = require(\"!!./../../../node_modules/css-loader/index.js!./../../../node_modules/postcss-loader/index.js!./grid.css\");\nif(typeof content === 'string') content = [[module.id, content, '']];\n// add the styles to the DOM\nvar update = require(\"!./../../../node_modules/style-loader/addStyles.js\")(content, {});\nif(content.locals) module.exports = content.locals;\n// Hot Module Replacement\nif(module.hot) {\n\t// When the styles change, update the <style> tags\n\tif(!content.locals) {\n\t\tmodule.hot.accept(\"!!./../../../node_modules/css-loader/index.js!./../../../node_modules/postcss-loader/index.js!./grid.css\", function() {\n\t\t\tvar newContent = require(\"!!./../../../node_modules/css-loader/index.js!./../../../node_modules/postcss-loader/index.js!./grid.css\");\n\t\t\tif(typeof newContent === 'string') newContent = [[module.id, newContent, '']];\n\t\t\tupdate(newContent);\n\t\t});\n\t}\n\t// When the module is disposed, remove the <style> tags\n\tmodule.hot.dispose(function() { update(); });\n}",
    "./~/css-loader!./~/postcss-loader!./client/assets/css/grid.css": "var __webpack_public_path__ = \"/build/\"; exports = module.exports = require(\"./../../../node_modules/css-loader/lib/css-base.js\")();\n// imports\n\n\n// module\nexports.push([module.id, \".container {\\n  *zoom: 1;\\n  max-width: 980px;\\n  margin-left: auto;\\n  margin-right: auto;\\n}\\n\\n.container:before {\\n  content: '';\\n  display: table;\\n}\\n\\n.container:after {\\n  content: '';\\n  display: table;\\n  clear: both;\\n}\\n\\n.row {\\n  *zoom: 1;\\n}\\n\\n.row:before {\\n  content: '';\\n  display: table;\\n}\\n\\n.row:after {\\n  content: '';\\n  display: table;\\n  clear: both;\\n}\\n\\n.column {\\n  width: calc(99.99% * 1/3 - (30px - 30px * 1/3));\\n  margin-left: calc(99.99% * (-1/3 * -1) - (30px - 30px * (-1/3 * -1)) + 30px) !important;\\n}\\n\\n.column:nth-child(n) {\\n  float: left;\\n  margin-right: 30px;\\n  clear: none;\\n}\\n\\n.column:last-child {\\n  margin-right: 0;\\n}\\n\\n.column:nth-child(3n) {\\n  margin-right: 0;\\n}\\n\\n.column:nth-child(3n + 1) {\\n  clear: left;\\n}\\n\\n\", \"\"]);\n\n// exports\n",
    "./client/assets/css/style.css": "var __webpack_public_path__ = \"/build/\"; // style-loader: Adds some css to the DOM by adding a <style> tag\n\n// load the styles\nvar content = require(\"!!./../../../node_modules/css-loader/index.js!./../../../node_modules/postcss-loader/index.js!./style.css\");\nif(typeof content === 'string') content = [[module.id, content, '']];\n// add the styles to the DOM\nvar update = require(\"!./../../../node_modules/style-loader/addStyles.js\")(content, {});\nif(content.locals) module.exports = content.locals;\n// Hot Module Replacement\nif(module.hot) {\n\t// When the styles change, update the <style> tags\n\tif(!content.locals) {\n\t\tmodule.hot.accept(\"!!./../../../node_modules/css-loader/index.js!./../../../node_modules/postcss-loader/index.js!./style.css\", function() {\n\t\t\tvar newContent = require(\"!!./../../../node_modules/css-loader/index.js!./../../../node_modules/postcss-loader/index.js!./style.css\");\n\t\t\tif(typeof newContent === 'string') newContent = [[module.id, newContent, '']];\n\t\t\tupdate(newContent);\n\t\t});\n\t}\n\t// When the module is disposed, remove the <style> tags\n\tmodule.hot.dispose(function() { update(); });\n}",
    "./~/css-loader!./~/postcss-loader!./client/assets/css/style.css": "var __webpack_public_path__ = \"/build/\"; exports = module.exports = require(\"./../../../node_modules/css-loader/lib/css-base.js\")();\n// imports\n\n\n// module\nexports.push([module.id, \"/*! normalize.css v2.1.3 | MIT License | git.io/normalize */\\n/* ==========================================================================\\n   HTML5 display definitions\\n   ========================================================================== */\\n/**\\n * Correct `block` display not defined in IE 8/9.\\n */\\narticle, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {\\n    display: block\\n}\\n/**\\n * Correct `inline-block` display not defined in IE 8/9.\\n */\\naudio, canvas, video {\\n    display: inline-block\\n}\\n/**\\n * Prevent modern browsers from displaying `audio` without controls.\\n * Remove excess height in iOS 5 devices.\\n */\\naudio:not([controls]) {\\n    display: none;\\n    height: 0\\n}\\n/**\\n * Address `[hidden]` styling not present in IE 8/9.\\n * Hide the `template` element in IE, Safari, and Firefox < 22.\\n */\\n[hidden], template {\\n    display: none\\n}\\n/* ==========================================================================\\n   Base\\n   ========================================================================== */\\n/**\\n * 1. Set default font family to sans-serif.\\n * 2. Prevent iOS text size adjust after orientation change, without disabling\\n *    user zoom.\\n */\\nhtml {\\n    font-family: sans-serif;\\n    /* 1 */\\n    -ms-text-size-adjust: 100%;\\n    /* 2 */\\n    -webkit-text-size-adjust: 100%\\n    /* 2 */\\n}\\n/**\\n * Remove default margin.\\n */\\nbody {\\n    margin: 0\\n}\\n/* ==========================================================================\\n   Links\\n   ========================================================================== */\\n/**\\n * Remove the gray background color from active links in IE 10.\\n */\\na {\\n    background: transparent\\n}\\n/**\\n * Address `outline` inconsistency between Chrome and other browsers.\\n */\\na:focus {\\n    outline: thin dotted\\n}\\n/**\\n * Improve readability when focused and also mouse hovered in all browsers.\\n */\\na:active, a:hover {\\n    outline: 0\\n}\\n/* ==========================================================================\\n   Typography\\n   ========================================================================== */\\n/**\\n * Address variable `h1` font-size and margin within `section` and `article`\\n * contexts in Firefox 4+, Safari 5, and Chrome.\\n */\\nh1 {\\n    font-size: 2em;\\n    margin: 0.67em 0\\n}\\n/**\\n * Address styling not present in IE 8/9, Safari 5, and Chrome.\\n */\\nabbr[title] {\\n    border-bottom: 1px dotted\\n}\\n/**\\n * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.\\n */\\nb, strong {\\n    font-weight: bold\\n}\\n/**\\n * Address styling not present in Safari 5 and Chrome.\\n */\\ndfn {\\n    font-style: italic\\n}\\n/**\\n * Address differences between Firefox and other browsers.\\n */\\nhr {\\n    -moz-box-sizing: content-box;\\n    box-sizing: content-box;\\n    height: 0\\n}\\n/**\\n * Address styling not present in IE 8/9.\\n */\\nmark {\\n    background: #ff0;\\n    color: #000\\n}\\n/**\\n * Correct font family set oddly in Safari 5 and Chrome.\\n */\\ncode, kbd, pre, samp {\\n    font-family: monospace, serif;\\n    font-size: 1em\\n}\\n/**\\n * Improve readability of pre-formatted text in all browsers.\\n */\\npre {\\n    white-space: pre-wrap\\n}\\n/**\\n * Set consistent quote types.\\n */\\nq {\\n    quotes: \\\"\\\\201C\\\" \\\"\\\\201D\\\" \\\"\\\\2018\\\" \\\"\\\\2019\\\"\\n}\\n/**\\n * Address inconsistent and variable font size in all browsers.\\n */\\nsmall {\\n    font-size: 80%\\n}\\n/**\\n * Prevent `sub` and `sup` affecting `line-height` in all browsers.\\n */\\nsub, sup {\\n    font-size: 75%;\\n    line-height: 0;\\n    position: relative;\\n    vertical-align: baseline\\n}\\nsup {\\n    top: -0.5em\\n}\\nsub {\\n    bottom: -0.25em\\n}\\n/* ==========================================================================\\n   Embedded content\\n   ========================================================================== */\\n/**\\n * Remove border when inside `a` element in IE 8/9.\\n */\\nimg {\\n    border: 0\\n}\\n/**\\n * Correct overflow displayed oddly in IE 9.\\n */\\nsvg:not(:root) {\\n    overflow: hidden\\n}\\n/* ==========================================================================\\n   Figures\\n   ========================================================================== */\\n/**\\n * Address margin not present in IE 8/9 and Safari 5.\\n */\\nfigure {\\n    margin: 0\\n}\\n/* ==========================================================================\\n   Forms\\n   ========================================================================== */\\n/**\\n * Define consistent border, margin, and padding.\\n */\\nfieldset {\\n    border: 1px solid #c0c0c0;\\n    margin: 0 2px;\\n    padding: 0.35em 0.625em 0.75em\\n}\\n/**\\n * 1. Correct `color` not being inherited in IE 8/9.\\n * 2. Remove padding so people aren't caught out if they zero out fieldsets.\\n */\\nlegend {\\n    border: 0;\\n    /* 1 */\\n    padding: 0\\n    /* 2 */\\n}\\n/**\\n * 1. Correct font family not being inherited in all browsers.\\n * 2. Correct font size not being inherited in all browsers.\\n * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.\\n */\\nbutton, input, select, textarea {\\n    font-family: inherit;\\n    /* 1 */\\n    font-size: 100%;\\n    /* 2 */\\n    margin: 0\\n    /* 3 */\\n}\\n/**\\n * Address Firefox 4+ setting `line-height` on `input` using `!important` in\\n * the UA stylesheet.\\n */\\nbutton, input {\\n    line-height: normal\\n}\\n/**\\n * Address inconsistent `text-transform` inheritance for `button` and `select`.\\n * All other form control elements do not inherit `text-transform` values.\\n * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.\\n * Correct `select` style inheritance in Firefox 4+ and Opera.\\n */\\nbutton, select {\\n    text-transform: none\\n}\\n/**\\n * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`\\n *    and `video` controls.\\n * 2. Correct inability to style clickable `input` types in iOS.\\n * 3. Improve usability and consistency of cursor style between image-type\\n *    `input` and others.\\n */\\nbutton, html input[type=\\\"button\\\"], input[type=\\\"reset\\\"], input[type=\\\"submit\\\"] {\\n    -webkit-appearance: button;\\n    /* 2 */\\n    cursor: pointer\\n    /* 3 */\\n}\\n/**\\n * Re-set default cursor for disabled elements.\\n */\\nbutton[disabled], html input[disabled] {\\n    cursor: default\\n}\\n/**\\n * 1. Address box sizing set to `content-box` in IE 8/9/10.\\n * 2. Remove excess padding in IE 8/9/10.\\n */\\ninput[type=\\\"checkbox\\\"], input[type=\\\"radio\\\"] {\\n    box-sizing: border-box;\\n    /* 1 */\\n    padding: 0\\n    /* 2 */\\n}\\n/**\\n * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.\\n * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome\\n *    (include `-moz` to future-proof).\\n */\\ninput[type=\\\"search\\\"] {\\n    -webkit-appearance: textfield;\\n    /* 1 */\\n    -moz-box-sizing: content-box;\\n    -webkit-box-sizing: content-box;\\n    /* 2 */\\n    box-sizing: content-box\\n}\\n/**\\n * Remove inner padding and search cancel button in Safari 5 and Chrome\\n * on OS X.\\n */\\ninput[type=\\\"search\\\"]::-webkit-search-cancel-button, input[type=\\\"search\\\"]::-webkit-search-decoration {\\n    -webkit-appearance: none\\n}\\n/**\\n * Remove inner padding and border in Firefox 4+.\\n */\\nbutton::-moz-focus-inner, input::-moz-focus-inner {\\n    border: 0;\\n    padding: 0\\n}\\n/**\\n * 1. Remove default vertical scrollbar in IE 8/9.\\n * 2. Improve readability and alignment in all browsers.\\n */\\ntextarea {\\n    overflow: auto;\\n    /* 1 */\\n    vertical-align: top\\n    /* 2 */\\n}\\n/* ==========================================================================\\n   Tables\\n   ========================================================================== */\\n/**\\n * Remove most spacing between table cells.\\n */\\ntable {\\n    border-collapse: collapse;\\n    border-spacing: 0\\n}\\n\", \"\"]);\n\n// exports\n"
  }
}

[require-hook] [debug] Loading source code for /Users/christiansakai/Desktop/overreact/common/components/Todo/Filter/Filter.css
[webpack-isomorphic-tools] [debug] require() called for /Users/christiansakai/Desktop/overreact/common/components/Todo/Filter/Filter.css
[webpack-isomorphic-tools] [debug]  requiring ./common/components/Todo/Filter/Filter.css
[require-hook] [debug] Loading source code for !!./../../../../node_modules/css-loader/index.js!./../../../../node_modules/postcss-loader/index.js!./Filter.css.webpack-module
[require-hook] [debug] Loading source code for ./../../../../node_modules/css-loader/lib/css-base.js.webpack-module
[require-hook] [debug] Loading source code for !./../../../../node_modules/style-loader/addStyles.js.webpack-module
!./../../../../node_modules/style-loader/addStyles.js.webpack-module:14
                return /msie [6-9]\b/.test(window.navigator.userAgent.toLowerCase());
                                           ^

ReferenceError: window is not defined
    at !./../../../../node_modules/style-loader/addStyles.js.webpack-module:14:30
    at !./../../../../node_modules/style-loader/addStyles.js.webpack-module:9:47
    at module.exports (!./../../../../node_modules/style-loader/addStyles.js.webpack-module:30:68)

const developmentConfig = {
  context: __dirname,

  devtool: 'eval',

  entry: [
    // Hot reload
    'webpack-dev-server/client?http://localhost:8080',
    'webpack/hot/dev-server',

    // App entry
    path.join(__dirname, 'client/index.js')
  ],

  module: {
    loaders: [{
      test: /\.js$/,
      exclude: /node_modules/,
      loader: 'babel'
    }, {
      test: /\.css$/,
      loader: 'style-loader!css-loader!postcss-loader'
    }]
  },

  postcss: function() {
    return [rucksack, lost, autoprefixer, scss];
  },

  output: {
    path: path.join(__dirname, 'client/build'),
    filename: 'bundle.js',
    publicPath: '/build/'
  },

  // Hot module replacement
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    webpackIsomorphicToolsPlugin
  ]
};

import WebpackIsomorphicToolsPlugin from 'webpack-isomorphic-tools/plugin'

export default {
  debug: true,
  assets: {
    css: {
      extensions: ['css'],
      parser: WebpackIsomorphicToolsPlugin.css_loader_parser // see Configuration and API sections for more info on this parameter
    },
    images: {
      extensions: ['png', 'jpg', 'gif', 'ico', 'svg'],
      parser: WebpackIsomorphicToolsPlugin.url_loader_parser // see Configuration and API sections for more info on this parameter
    }
  }
}

        styles:
        {
            extension: 'scss',
            filter: webpack_isomorphic_tools_plugin.style_loader_filter,
            path: webpack_isomorphic_tools_plugin.style_loader_path_extractor,
            parser: webpack_isomorphic_tools_plugin.css_loader_parser
        }

        styles:
        {
            extension: 'scss',
            filter: webpack_isomorphic_tools_plugin.style_loader_filter,
            path: webpack_isomorphic_tools_plugin.style_loader_path_extractor,
            parser: webpack_isomorphic_tools_plugin.css_modules_loader_parser
        }

import WebpackIsomorphicToolsPlugin from 'webpack-isomorphic-tools/plugin'

export default {
  debug: true,
  styles:
  {
    extension: 'css',
    filter: WebpackIsomorphicToolsPlugin.style_loader_filter,
    path: WebpackIsomorphicToolsPlugin.style_loader_path_extractor,
    parser: WebpackIsomorphicToolsPlugin.css_modules_loader_parser
  },
  assets: {
    //css: {
    //  extensions: ['css'],
    //  parser: WebpackIsomorphicToolsPlugin.css_loader_parser // see Configuration and API sections for more info on this parameter
    //},
    images: {
      extensions: ['png', 'jpg', 'gif', 'ico', 'svg'],
      parser: WebpackIsomorphicToolsPlugin.url_loader_parser // see Configuration and API sections for more info on this parameter
    }
  }
}

equire-hook] [debug] Hooking into *.ico files loading
[webpack-isomorphic-tools] [debug]  registering a require() hook for *.svg
[require-hook] [debug] Hooking into *.svg files loading
[require-hook] [debug] Hooking into *.webpack-module files loading
/Users/christiansakai/Desktop/overreact/node_modules/babel-core/lib/transformation/file/index.js:671
      throw err;
      ^

SyntaxError: /Users/christiansakai/Desktop/overreact/common/components/Todo/Filter/Filter.css: Unexpected token (1:0)
> 1 | .filter {
    | ^
  2 |   width: 600px;
  3 |   margin: 20px auto;
  4 |   display: block;
    at Parser.pp.raise (/Users/christiansakai/Desktop/overreact/node_modules/babylon/lib/parser/location.js:24:13)
    at Parser.pp.unexpected (/Users/christiansakai/Desktop/overreact/node_modules/babylon/lib/parser/util.js:82:8)
    at Parser.pp.parseExprAtom (/Users/christiansakai/Desktop/overreact/node_modules/babylon/lib/parser/expression.js:425:12)
    at Parser.parseExprAtom (/Users/christiansakai/Desktop/overreact/node_modules/babylon/lib/plugins/jsx/index.js:412:22)
    at Parser.pp.parseExprSubscripts (/Users/christiansakai/Desktop/overreact/node_modules/babylon/lib/parser/expression.js:236:19)
    at Parser.pp.parseMaybeUnary (/Users/christiansakai/Desktop/overreact/node_modules/babylon/lib/parser/expression.js:217:19)

[require-hook] [debug] Loading source code for /Users/christiansakai/Desktop/overreact/common/components/Todo/Filter/Filter.css
[webpack-isomorphic-tools] [debug] require() called for /Users/christiansakai/Desktop/overreact/common/components/Todo/Filter/Filter.css
[webpack-isomorphic-tools] [debug]  requiring ./common/components/Todo/Filter/Filter.css
[require-hook] [debug] Loading source code for !!./../../../../node_modules/css-loader/index.js!./../../../../node_modules/postcss-loader/index.js!./Filter.css.webpack-module
[require-hook] [debug] Loading source code for ./../../../../node_modules/css-loader/lib/css-base.js.webpack-module
[require-hook] [debug] Loading source code for !./../../../../node_modules/style-loader/addStyles.js.webpack-module
!./../../../../node_modules/style-loader/addStyles.js.webpack-module:14
                return /msie [6-9]\b/.test(window.navigator.userAgent.toLowerCase());
                                           ^

ReferenceError: window is not defined
    at !./../../../../node_modules/style-loader/addStyles.js.webpack-module:14:30
    at !./../../../../node_modules/style-loader/addStyles.js.webpack-module:9:47
    at module.exports (!./../../../../node_modules/style-loader/addStyles.js.webpack-module:30:68)
    at Object.<anonymous> (/Users/christiansakai/Desktop/overreact/common/components/Todo/Filter/Filter.css:7:78)
    at Module._compile (module.js:434:26)
    at Object._module3.default._extensions.(anonymous function) [as .css] (/Users/christiansakai/Desktop/overreact/node_modules/webpack-isomorphic-tools/babel-transpiled-modules/tools/require hacker.js:229:11)

import WebpackIsomorphicToolsPlugin from 'webpack-isomorphic-tools/plugin'

export default {
  debug: true,
  assets: {
    styles:
    {
      extension: 'css',
      filter: WebpackIsomorphicToolsPlugin.style_loader_filter,
      path: WebpackIsomorphicToolsPlugin.style_loader_path_extractor,
      parser: WebpackIsomorphicToolsPlugin.css_modules_loader_parser
    },
    //css: {
    //  extensions: ['css'],
    //  parser: WebpackIsomorphicToolsPlugin.css_loader_parser // see Configuration and API sections for more info on this parameter
    //},
    images: {
      extensions: ['png', 'jpg', 'gif', 'ico', 'svg'],
      parser: WebpackIsomorphicToolsPlugin.url_loader_parser // see Configuration and API sections for more info on this parameter
    }
  }
}