Server-side rendering for your Webpack-built applications (e.g. React)

Overview

webpack-isomorphic-tools

npm version npm downloads build status coverage

THIS PACKAGE IS DEPRECATED. LOOK ELSEWHERE.

webpack-isomorphic-tools is a small helper module providing very basic support for isomorphic (universal) rendering when using Webpack. It was created a long time ago when Webpack was v1 and the whole movement was just starting. Therefore webpack-isomorphic-tools is a hacky solution. It allowed many projects to set up basic isomorphic (universal) rendering in the early days but is now considered deprecated and new projects shouldn't use it. This library can still be found in legacy projects. For new projects use either universal-webpack or all-in-one frameworks like Next.js.

Topics

What it does

Suppose you have an application which is built using Webpack. It works in the web browser.

Should it be "isomorphic" ("universal")? It's better if it is. One reason is that search engines will be able to index your page. The other reason is that we live in a realtime mobile age which declared war on network latency, and so it's always better to fetch an already rendered content than to first fetch the application code and only then fetch the content to render the page. Every time you release a client-side only website to the internet someone writes a frustrated blog post.

So, it's obvious then that web applications should be "isomorphic" ("universal"), i.e. be able to render both on the client and the server, depending on circumstances. And it is perfectly possible nowadays since javascript runs everywhere: both in web browsers and on servers.

Ok, then one can just go ahead and run the web application in Node.js and its done. But, there's one gotcha: a Webpack application will usually crash when tried to be run in Node.js straight ahead (you'll get a lot of SyntaxErrors with Unexpected tokens).

The reason is that Webpack introduces its own layer above the standard javascript. This extra layer handles all require() calls magically resolving them to whatever it is configured to. For example, Webpack is perfectly fine with the code require()ing CSS styles or SVG images.

Bare Node.js doesn't come with such trickery up its sleeve. Maybe it can be somehow enhanced to be able to do such things? Turned out that it can, and that's what webpack-isomorphic-tools do: they inject that require() magic layer above the standard javascript in Node.js.

Still it's a hacky solution, and a better way would be to compile server-side code with Webpack the same way it already compiles the client-side code. This is achieved via target: "node" configuration option, and that's what universal-webpack library does. However, webpack-isomorphic-tools happened to be a bit simpler to set up, so they made their way into many now-legacy projects, so some people still use this library. It's not being maintained anymore though, and in case of any issues people should just migrate to universal-webpack or something similar.

webpack-isomorphic-tools mimics (to a certain extent) Webpack's require() magic when running application code on a Node.js server without Webpack. It basically fixes all those require()s of assets and makes them work instead of throwing SyntaxErrors. It doesn't provide all the capabilities of Webpack (for example, plugins won't work), but for the basic stuff, it works.

A simple example

For example, consider images. Images are require()d in React components and then used like this:

// alternatively one can use `import`, 
// but with `import`s hot reloading won't work
// import imagePath from '../image.png'

// Just `src` the image inside the `render()` method
class Photo extends React.Component
{
  render()
  {
    // When Webpack url-loader finds this `require()` call 
    // it will copy `image.png` to the build folder 
    // and name it something like `9059f094ddb49c2b0fa6a254a6ebf2ad.png`, 
    // because Webpack is set up to use the `[hash]` file naming feature
    // which makes browser asset caching work correctly.
    return <img src={ require('../image.png') }/>
  }
}

It works on the client-side because Webpack intelligently replaces all the require() calls with a bit of magic. But it wouldn't work on the server-side because Node.js only knows how to require() javascript modules. It would just throw a SyntaxError.

To solve this issue one can use webpack-isomorphic-tools. With the help of webpack-isomorphic-tools in this particular case the require() call will return the real path to the image on the disk. It would be something like ../../build/9059f094ddb49c2b0fa6a254a6ebf2ad.png. How did webpack-isomorphic-tools figure out this weird real file path? It's just a bit of magic.

webpack-isomorphic-tools is extensible, and finding the real paths for assets is the simplest example of what it can do inside require() calls. Using custom configuration one can make require() calls (on the server) return anything (not just a String; it may be a JSON object, for example).

For example, if one is using Webpack css-loader modules feature (also referred to as "local styles") one can make require(*.css) calls return JSON objects with generated CSS class names maps like they do in este and react-redux-universal-hot-example.

Installation

webpack-isomorphic-tools are required both for development and production

$ npm install webpack-isomorphic-tools --save

Usage

First you add webpack-isomorphic-tools plugin to your Webpack configuration.

webpack.config.js

var WebpackIsomorphicToolsPlugin = require('webpack-isomorphic-tools/plugin')

var webpackIsomorphicToolsPlugin = 
  // webpack-isomorphic-tools settings reside in a separate .js file 
  // (because they will be used in the web server code too).
  new WebpackIsomorphicToolsPlugin(require('./webpack-isomorphic-tools-configuration'))
  // also enter development mode since it's a development webpack configuration
  // (see below for explanation)
  .development()

// usual Webpack configuration
module.exports =
{
  context: '(required) your project path here',

  module:
  {
    loaders:
    [
      ...,
      {
        test: webpackIsomorphicToolsPlugin.regularExpression('images'),
        loader: 'url-loader?limit=10240', // any image below or equal to 10K will be converted to inline base64 instead
      }
    ]
  },

  plugins:
  [
    ...,

    webpackIsomorphicToolsPlugin
  ]

  ...
}

What does .development() method do? It enables development mode. In short, when in development mode, it disables asset caching (and enables asset hot reload), and optionally runs its own "dev server" utility (see port configuration setting). Call it in development webpack build configuration, and, conversely, don't call it in production webpack build configuration.

For each asset type managed by webpack-isomorphic-tools there should be a corresponding loader in your Webpack configuration. For this reason webpack-isomorphic-tools/plugin provides a .regularExpression(assetType) method. The assetType parameter is taken from your webpack-isomorphic-tools configuration:

webpack-isomorphic-tools-configuration.js

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

export default
{
  assets:
  {
    images:
    {
      extensions: ['png', 'jpg', 'gif', 'ico', 'svg']
    }
  }
}

That's it for the client side. Next, the server side. You create your server side instance of webpack-isomorphic-tools in the very main server javascript file (and your web application code will reside in some server.js file which is require()d in the bottom)

main.js

var WebpackIsomorphicTools = require('webpack-isomorphic-tools')

// this must be equal to your Webpack configuration "context" parameter
var projectBasePath = require('path').resolve(__dirname, '..')

// this global variable will be used later in express middleware
global.webpackIsomorphicTools = new WebpackIsomorphicTools(require('./webpack-isomorphic-tools-configuration'))
// initializes a server-side instance of webpack-isomorphic-tools
// (the first parameter is the base path for your project
//  and is equal to the "context" parameter of you Webpack configuration)
// (if you prefer Promises over callbacks 
//  you can omit the callback parameter
//  and then it will return a Promise instead)
.server(projectBasePath, function()
{
  // webpack-isomorphic-tools is all set now.
  // here goes all your web application code:
  // (it must reside in a separate *.js file 
  //  in order for the whole thing to work)
  require('./server')
})

Then you, for example, create an express middleware to render your pages on the server

import React from 'react'

// html page markup
import Html from './html'

// will be used in express_application.use(...)
export function pageRenderingMiddleware(request, response)
{
  // clear require() cache if in development mode
  // (makes asset hot reloading work)
  if (process.env.NODE_ENV !== 'production')
  {
    webpackIsomorphicTools.refresh()
  }

  // for react-router example of determining current page by URL take a look at this:
  // https://github.com/catamphetamine/webapp/blob/master/code/server/webpage%20rendering.js
  const pageComponent = [determine your page component here using request.path]

  // for a Redux Flux store implementation you can see the same example:
  // https://github.com/catamphetamine/webapp/blob/master/code/server/webpage%20rendering.js
  const fluxStore = [initialize and populate your flux store depending on the page being shown]

  // render the page to string and send it to the browser as text/html
  response.send('\n' +
        React.renderToString(<Html assets={webpackIsomorphicTools.assets()} component={pageComponent} store={fluxStore}/>))
}

And finally you use the assets inside the Html component's render() method

xHamster {/* favicon */} {/* styles (will be present only in production with webpack extract text plugin) */} {Object.keys(assets.styles).map((style, i) => )} {/* resolves the initial style flash (flicker) on page load in development mode */} { Object.keys(assets.styles).length === 0 ? : null } {/* image requiring demonstration */} {/* rendered React page */}
{/* Flux store data will be reloaded into the store on the client */} {/* javascripts */} {/* (usually one for each "entry" in webpack configuration) */} {/* (for more informations on "entries" see https://github.com/petehunt/webpack-howto/) */} {Object.keys(assets.javascript).map((script, i) =>
Comments
  • Not working with webpack's resolve.alias?

    Not working with webpack's resolve.alias?

    Basically I want to separate my themes (scss, icons, etc) out from my web app project. So each theme is a npm module under node_modules. In my component I have:

    import Styles from 'theme/sass/user.scss';
    

    And in webpack config there is:

    resolve: {
        ...
        alias: { 'theme': 'theme-a' }
    }
    

    Therefore I can easily change active theme by changing the alias here.

    However since it's an isomorphic app, when it renders on server side it gives:

     Cannot find module 'theme/sass/user.scss'
    

    If in component I hardcode it to import Styles from 'theme-a/sass/user.scss'; and remove the resolve alias, everything works. (which means webpack-isomorphic-tools works well with node_modules I think).

    opened by x1a0 76
  • Unexptected reserved word

    Unexptected reserved word "import".

    I get an error coming from the webpack-isomorphic-tools-configuration.js file which is

    [0] /Users/rparent/Documents/CTSProjects/isomorphic-boiler-plate/webpack-isomorphic-tools-configuration.js:1
    [0] (function (exports, require, module, __filename, __dirname) { import Webpack_i
    [0]                                                               ^^^^^^
    [0] SyntaxError: Unexpected reserved word
    [0]     at exports.runInThisContext (vm.js:73:16)
    [0]     at Module._compile (module.js:443:25)
    [0]     at Object.Module._extensions..js (module.js:478:10)
    [0]     at Module.load (module.js:355:32)
    [0]     at Function.Module._load (module.js:310:12)
    [0]     at Module.require (module.js:365:17)
    [0]     at require (module.js:384:17)
    [0]     at Object.<anonymous> (/Users/rparent/Documents/CTSProjects/isomorphic-boiler-plate/webpack.client.js:4:75)
    [0]     at Module._compile (module.js:460:26)
    [0]     at Object.Module._extensions..js (module.js:478:10)
    
    

    Tried to modify it with the require() method instead then got the same error but with the export word on line 3. I am probably doing something wrong.

    This is the line 4 of my webpack.client.js file which is my webpack configuration.

    var webpack_isomorphic_tools_plugin = new Webpack_isomorphic_tools_plugin(require('./webpack-isomorphic-tools-configuration')).development();
    

    Any help would be appreciated!

    opened by raphaelparent 51
  • css-modules use case

    css-modules use case

    Hello, I wanted to use your css_modules_loader_parser, and took inspiration from your pull. https://github.com/erikras/react-redux-universal-hot-example/pull/463/files

    Config

    import WebpackIsomorphicToolsPlugin from 'webpack-isomorphic-tools/plugin';
    
    
    // see this link for more info on what all of this means
    // https://github.com/halt-hammerzeit/webpack-isomorphic-tools
    const config = {
      webpack_assets_file_path: 'webpack-stats.json',
    
      assets: {
        images: {
          extensions: ['jpeg', 'jpg', 'png', 'gif', 'svg'],
          parser: WebpackIsomorphicToolsPlugin.url_loader_parser
        },
        fonts: {
          extensions: ['ttf', 'woff', 'woff2'],
          parser: WebpackIsomorphicToolsPlugin.url_loader_parser
        },
        svg: {
          extension: 'svg',
          parser: WebpackIsomorphicToolsPlugin.url_loader_parser
        },
        style_modules: {
          extensions: ['less', 'scss', 'sass', 'styl', 'css'],
          filter: (module, regex, options, log) => {
            if (options.development) {
              // in development mode there's webpack "style-loader",
              // so the module.name is not equal to module.name
              return WebpackIsomorphicToolsPlugin.style_loader_filter(module, regex, options, log);
            } else {
              // in production mode there's no webpack "style-loader",
              // so the module.name will be equal to the asset path
              return regex.test(module.name);
            }
          },
          path: (module, options, log) => {
            if (options.development) {
              // in development mode there's webpack "style-loader",
              // so the module.name is not equal to module.name
              return WebpackIsomorphicToolsPlugin.style_loader_path_extractor(module, options, log);
            } else {
              // in production mode there's no webpack "style-loader",
              // so the module.name will be equal to the asset path
              return module.name;
            }
          },
          // parser: WebpackIsomorphicToolsPlugin.css_loader_parser
          parser: (module, options, log) => {
            // FAIL
            // if (options.development) {
            //   return WebpackIsomorphicToolsPlugin.css_modules_loader_parser(module, options, log);
            // } else {
            //   // in production mode there's Extract Text Loader which extracts CSS text away
            //   console.log(module.source);
            //   return module.source;
            // }
            // OK
            if (module.source) {
              const regex = options.development ? /exports\.locals = ((.|\n)+);/ : /module\.exports = ((.|\n)+);/;
              const match = module.source.match(regex);
              return match ? JSON.parse(match[1]) : {};
            }
          }
        }
      }
    };
    
    
    export default config;
    

    FAIL

    Development:
    {
      "javascript": {
        "app": "http://localhost:8082/dist/app-2a2cf7557cd6e4a3d05d.js"
      },
      "styles": {},
      "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\"), \"\");\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!basscss-base-reset/index.css\"), \"\");\n\n// module\nexports.push([module.id, \" {\\n  /**\\n   * React Select\\n   * ============\\n   * Created by Jed Watson and Joss Mackison for KeystoneJS, http://www.keystonejs.com/\\n   * https://twitter.com/jedwatson https://twitter.com/jossmackison https://twitter.com/keystonejs\\n   * MIT License: https://github.com/keystonejs/react-select\\n  */\\n}\\n\\n.Select {\\n  position: relative;\\n}\\n\\n.Select,\\n.Select div,\\n.Select input,\\n.Select span {\\n  box-sizing: border-box;\\n}\\n\\n.Select.is-disabled > .Select-control {\\n  background-color: #f6f6f6;\\n}\\n\\n.Select.is-disabled .Select-arrow-zone {\\n  cursor: default;\\n  pointer-events: none;\\n}\\n\\n.Select-control {\\n  background-color: #fff;\\n  border-color: #d9d9d9 #ccc #b3b3b3;\\n  border-radius: 4px;\\n  border: 1px solid #ccc;\\n  color: #333;\\n  cursor: default;\\n  display: table;\\n  height: 36px;\\n  outline: none;\\n  overflow: hidden;\\n  position: relative;\\n  width: 100%;\\n}\\n\\n.Select-control:hover {\\n  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);\\n}\\n\\n.is-searchable.is-open > .Select-control {\\n  cursor: text;\\n}\\n\\n.is-open > .Select-control {\\n  border-bottom-right-radius: 0;\\n  border-bottom-left-radius: 0;\\n  background: #fff;\\n  border-color: #b3b3b3 #ccc #d9d9d9;\\n}\\n\\n.is-open > .Select-control > .Select-arrow {\\n  border-color: transparent transparent #999;\\n  border-width: 0 5px 5px;\\n}\\n\\n.is-searchable.is-focused:not(.is-open) > .Select-control {\\n  cursor: text;\\n}\\n\\n.is-focused:not(.is-open) > .Select-control {\\n  border-color: #08c #0099e6 #0099e6;\\n  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 0 5px -1px rgba(0, 136, 204, 0.5);\\n}\\n\\n.Select-placeholder {\\n  bottom: 0;\\n  color: #aaa;\\n  left: 0;\\n  line-height: 34px;\\n  padding-left: 10px;\\n  padding-right: 10px;\\n  position: absolute;\\n  right: 0;\\n  top: 0;\\n  max-width: 100%;\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  white-space: nowrap;\\n}\\n\\n.has-value > .Select-control > .Select-placeholder {\\n  color: #333;\\n}\\n\\n.Select-value {\\n  color: #aaa;\\n  left: 0;\\n  padding: 8px 52px 8px 10px;\\n  position: absolute;\\n  right: -15px;\\n  top: 0;\\n  max-width: 100%;\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  white-space: nowrap;\\n}\\n\\n.has-value > .Select-control > .Select-value {\\n  color: #333;\\n}\\n\\n.Select-input {\\n  height: 34px;\\n  padding-left: 10px;\\n  padding-right: 10px;\\n  vertical-align: middle;\\n}\\n\\n.Select-input > input {\\n  background: none transparent;\\n  border: 0 none;\\n  box-shadow: none;\\n  cursor: default;\\n  display: inline-block;\\n  font-family: inherit;\\n  font-size: inherit;\\n  height: 34px;\\n  margin: 0;\\n  outline: none;\\n  padding: 0;\\n  -webkit-appearance: none;\\n}\\n\\n.is-focused .Select-input > input {\\n  cursor: text;\\n}\\n\\n.Select-control:not(.is-searchable) > .Select-input {\\n  outline: none;\\n}\\n\\n.Select-loading-zone {\\n  cursor: pointer;\\n  display: table-cell;\\n  position: relative;\\n  text-align: center;\\n  vertical-align: middle;\\n  width: 16px;\\n}\\n\\n.Select-loading {\\n  -webkit-animation: Select-animation-spin 400ms infinite linear;\\n  animation: Select-animation-spin 400ms infinite linear;\\n  width: 16px;\\n  height: 16px;\\n  box-sizing: border-box;\\n  border-radius: 50%;\\n  border: 2px solid #ccc;\\n  border-right-color: #333;\\n  display: inline-block;\\n  position: relative;\\n  vertical-align: middle;\\n}\\n\\n.Select-clear-zone {\\n  -webkit-animation: Select-animation-fadeIn 200ms;\\n  animation: Select-animation-fadeIn 200ms;\\n  color: #999;\\n  cursor: pointer;\\n  display: table-cell;\\n  position: relative;\\n  text-align: center;\\n  vertical-align: middle;\\n  width: 17px;\\n}\\n\\n.Select-clear-zone:hover {\\n  color: #D0021B;\\n}\\n\\n.Select-clear {\\n  display: inline-block;\\n  font-size: 18px;\\n  line-height: 1;\\n}\\n\\n.Select--multi .Select-clear-zone {\\n  width: 17px;\\n}\\n\\n.Select-arrow-zone {\\n  cursor: pointer;\\n  display: table-cell;\\n  position: relative;\\n  text-align: center;\\n  vertical-align: middle;\\n  width: 25px;\\n  padding-right: 5px;\\n}\\n\\n.Select-arrow {\\n  border-color: #999 transparent transparent;\\n  border-style: solid;\\n  border-width: 5px 5px 2.5px;\\n  display: inline-block;\\n  height: 0;\\n  width: 0;\\n}\\n\\n.is-open .Select-arrow,\\n.Select-arrow-zone:hover > .Select-arrow {\\n  border-top-color: #666;\\n}\\n\\n.Select-menu-outer {\\n  border-bottom-right-radius: 4px;\\n  border-bottom-left-radius: 4px;\\n  background-color: #fff;\\n  border: 1px solid #ccc;\\n  border-top-color: #e6e6e6;\\n  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);\\n  box-sizing: border-box;\\n  margin-top: -1px;\\n  max-height: 200px;\\n  position: absolute;\\n  top: 100%;\\n  width: 100%;\\n  z-index: 1000;\\n  -webkit-overflow-scrolling: touch;\\n}\\n\\n.Select-menu {\\n  max-height: 198px;\\n  overflow-y: auto;\\n}\\n\\n.Select-option {\\n  box-sizing: border-box;\\n  color: #666666;\\n  cursor: pointer;\\n  display: block;\\n  padding: 8px 10px;\\n}\\n\\n.Select-option:last-child {\\n  border-bottom-right-radius: 4px;\\n  border-bottom-left-radius: 4px;\\n}\\n\\n.Select-option.is-focused {\\n  background-color: #f2f9fc;\\n  color: #333;\\n}\\n\\n.Select-option.is-disabled {\\n  color: #cccccc;\\n  cursor: not-allowed;\\n}\\n\\n.Select-noresults,\\n.Select-search-prompt,\\n.Select-searching {\\n  box-sizing: border-box;\\n  color: #999999;\\n  cursor: default;\\n  display: block;\\n  padding: 8px 10px;\\n}\\n\\n.Select--multi .Select-input {\\n  vertical-align: middle;\\n  margin-left: 10px;\\n  padding: 0;\\n}\\n\\n.Select--multi.has-value .Select-input {\\n  margin-left: 5px;\\n}\\n\\n.Select-item {\\n  background-color: #f2f9fc;\\n  border-radius: 2px;\\n  border: 1px solid #c9e6f2;\\n  color: #08c;\\n  display: inline-block;\\n  font-size: 0.9em;\\n  margin-left: 5px;\\n  margin-top: 5px;\\n  vertical-align: top;\\n}\\n\\n.Select-item-icon,\\n.Select-item-label {\\n  display: inline-block;\\n  vertical-align: middle;\\n}\\n\\n.Select-item-label {\\n  border-bottom-right-radius: 2px;\\n  border-top-right-radius: 2px;\\n  cursor: default;\\n  padding: 2px 5px;\\n}\\n\\n.Select-item-label .Select-item-label__a {\\n  color: #08c;\\n  cursor: pointer;\\n}\\n\\n.Select-item-icon {\\n  cursor: pointer;\\n  border-bottom-left-radius: 2px;\\n  border-top-left-radius: 2px;\\n  border-right: 1px solid #c9e6f2;\\n  padding: 1px 5px 3px;\\n}\\n\\n.Select-item-icon:hover,\\n.Select-item-icon:focus {\\n  background-color: #ddeff7;\\n  color: #0077b3;\\n}\\n\\n.Select-item-icon:active {\\n  background-color: #c9e6f2;\\n}\\n\\n.Select--multi.is-disabled .Select-item {\\n  background-color: #f2f2f2;\\n  border: 1px solid #d9d9d9;\\n  color: #888;\\n}\\n\\n.Select--multi.is-disabled .Select-item-icon {\\n  cursor: not-allowed;\\n  border-right: 1px solid #d9d9d9;\\n}\\n\\n.Select--multi.is-disabled .Select-item-icon:hover,\\n.Select--multi.is-disabled .Select-item-icon:focus,\\n.Select--multi.is-disabled .Select-item-icon:active {\\n  background-color: #f2f2f2;\\n}\\n\\[email protected] Select-animation-fadeIn {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\n\\[email protected] Select-animation-fadeIn {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\n\\[email protected] Select-animation-spin {\\n  to {\\n    -webkit-transform: rotate(1turn);\\n            transform: rotate(1turn);\\n  }\\n}\\n\\[email protected] Select-animation-spin {\\n  to {\\n    -webkit-transform: rotate(1turn);\\n  }\\n}\\n\\nbody {\\n  background-color: #FFFFFF;\\n}\\n\", \"\", {\"version\":3,\"sources\":[\"/./assets/assets/styles/Select.scss\",\"/./assets/assets/index.scss\",\"/./assets/assets/index.scss\"],\"names\":[],\"mappings\":\"AAAA;EACE;;;;;;IAME;CAqSH;;AA5SD;EASI,mBAAmB;CACpB;;AAVH;;;;EAiBI,uBAAuB;CACxB;;AAlBH;EAoBI,0BAA0B;CAC3B;;AArBH;EAuBI,gBAAgB;EAChB,qBAAqB;CACtB;;AAzBH;EA2BI,uBAAuB;EACvB,mCAAmC;EACnC,mBAAmB;EACnB,uBAAuB;EACvB,YAAY;EACZ,gBAAgB;EAChB,eAAe;EACf,aAAa;EACb,cAAc;EACd,iBAAiB;EACjB,mBAAmB;EACnB,YAAY;CACb;;AAvCH;EAyCI,wCAAwB;CACzB;;AA1CH;EA4CI,aAAa;CACd;;AA7CH;EA+CI,8BAA8B;EAC9B,6BAA6B;EAC7B,iBAAiB;EACjB,mCAAmC;CACpC;;AAnDH;EAqDI,2CAA2C;EAC3C,wBAAwB;CACzB;;AAvDH;EAyDI,aAAa;CACd;;AA1DH;EA4DI,mCAAmC;EACnC,oFAAiE;CAClE;;AA9DH;EAgEI,UAAU;EACV,YAAY;EACZ,QAAQ;EACR,kBAAkB;EAClB,mBAAmB;EACnB,oBAAoB;EACpB,mBAAmB;EACnB,SAAS;EACT,OAAO;EACP,gBAAgB;EAChB,iBAAiB;EACjB,wBAAwB;EACxB,oBAAoB;CACrB;;AA7EH;EA+EI,YAAY;CACb;;AAhFH;EAkFI,YAAY;EACZ,QAAQ;EACR,2BAA2B;EAC3B,mBAAmB;EACnB,aAAa;EACb,OAAO;EACP,gBAAgB;EAChB,iBAAiB;EACjB,wBAAwB;EACxB,oBAAoB;CACrB;;AA5FH;EA8FI,YAAY;CACb;;AA/FH;EAiGI,aAAa;EACb,mBAAmB;EACnB,oBAAoB;EACpB,uBAAuB;CACxB;;AArGH;EAuGI,6BAA6B;EAC7B,eAAe;EACf,iBAAiB;EACjB,gBAAgB;EAChB,sBAAsB;EACtB,qBAAqB;EACrB,mBAAmB;EACnB,aAAa;EACb,UAAU;EACV,cAAc;EACd,WAAW;EACX,yBAAyB;CAC1B;;AAnHH;EAqHI,aAAa;CACd;;AAtHH;EAwHI,cAAc;CACf;;AAzHH;EA2HI,gBAAgB;EAChB,oBAAoB;EACpB,mBAAmB;EACnB,mBAAmB;EACnB,uBAAuB;EACvB,YAAY;CACb;;AAjIH;EAmII,+DAA+D;EAE/D,uDAAuD;EACvD,YAAY;EACZ,aAAa;EACb,uBAAuB;EACvB,mBAAmB;EACnB,uBAAuB;EACvB,yBAAyB;EACzB,sBAAsB;EACtB,mBAAmB;EACnB,uBAAuB;CACxB;;AA/IH;EAiJI,iDAAiD;EAEjD,yCAAyC;EACzC,YAAY;EACZ,gBAAgB;EAChB,oBAAoB;EACpB,mBAAmB;EACnB,mBAAmB;EACnB,uBAAuB;EACvB,YAAY;CACb;;AA3JH;EA6JI,eAAe;CAChB;;AA9JH;EAgKI,sBAAsB;EACtB,gBAAgB;EAChB,eAAe;CAChB;;AAnKH;EAqKI,YAAY;CACb;;AAtKH;EAwKI,gBAAgB;EAChB,oBAAoB;EACpB,mBAAmB;EACnB,mBAAmB;EACnB,uBAAuB;EACvB,YAAY;EACZ,mBAAmB;CACpB;;AA/KH;EAiLI,2CAA2C;EAC3C,oBAAoB;EACpB,4BAA4B;EAC5B,sBAAsB;EACtB,UAAU;EACV,SAAS;CACV;;AAvLH;;EA0LI,uBAAuB;CACxB;;AA3LH;EA6LI,gCAAgC;EAChC,+BAA+B;EAC/B,uBAAuB;EACvB,uBAAuB;EACvB,0BAA0B;EAC1B,wCAAwB;EACxB,uBAAuB;EACvB,iBAAiB;EACjB,kBAAkB;EAClB,mBAAmB;EACnB,UAAU;EACV,YAAY;EACZ,cAAc;EACd,kCAAkC;CACnC;;AA3MH;EA6MI,kBAAkB;EAClB,iBAAiB;CAClB;;AA/MH;EAiNI,uBAAuB;EACvB,eAAe;EACf,gBAAgB;EAChB,eAAe;EACf,kBAAkB;CACnB;;AAtNH;EAwNI,gCAAgC;EAChC,+BAA+B;CAChC;;AA1NH;EA4NI,0BAA0B;EAC1B,YAAY;CACb;;AA9NH;EAgOI,eAAe;EACf,oBAAoB;CACrB;;AAlOH;;;EAsOI,uBAAuB;EACvB,eAAe;EACf,gBAAgB;EAChB,eAAe;EACf,kBAAkB;CACnB;;AA3OH;EA6OI,uBAAuB;EACvB,kBAAkB;EAClB,WAAW;CACZ;;AAhPH;EAkPI,iBAAiB;CAClB;;AAnPH;EAqPI,0BAA0B;EAC1B,mBAAmB;EACnB,0BAA0B;EAC1B,YAAY;EACZ,sBAAsB;EACtB,iBAAiB;EACjB,iBAAiB;EACjB,gBAAgB;EAChB,oBAAoB;CACrB;;AA9PH;;EAiQI,sBAAsB;EACtB,uBAAuB;CACxB;;AAnQH;EAqQI,gCAAgC;EAChC,6BAA6B;EAC7B,gBAAgB;EAChB,iBAAiB;CAClB;;AAzQH;EA2QI,YAAY;EACZ,gBAAgB;CACjB;;AA7QH;EA+QI,gBAAgB;EAChB,+BAA+B;EAC/B,4BAA4B;EAC5B,gCAAgC;EAChC,qBAAqB;CACtB;;AApRH;;EAuRI,0BAA0B;EAC1B,eAAe;CAChB;;AAzRH;EA2RI,0BAA0B;CAC3B;;AA5RH;EA8RI,0BAA0B;EAC1B,0BAA0B;EAC1B,YAAY;CACb;;AAjSH;EAmSI,oBAAoB;EACpB,gCAAgC;CACjC;;AArSH;;;EAySI,0BAA0B;CAC3B;;AAIH;EACE;IACE,WAAW;GCiDZ;ED/CD;IACE,WAAW;GCiDZ;CACF;;AD/CD;EACE;IACE,WAAW;GCkDZ;EDhDD;IACE,WAAW;GCkDZ;CACF;;ADhDD;EACE;IACE,iCAAiB;YAAjB,yBAAiB;GCmDlB;CACF;;ADjDD;EACE;IACE,iCAAyB;GCoD1B;CACF;;ACpXD;EAEI,0BAA0B;CAC3B\",\"file\":\"index.scss\",\"sourcesContent\":[\":global {\\n  /**\\n   * React Select\\n   * ============\\n   * Created by Jed Watson and Joss Mackison for KeystoneJS, http://www.keystonejs.com/\\n   * https://twitter.com/jedwatson https://twitter.com/jossmackison https://twitter.com/keystonejs\\n   * MIT License: https://github.com/keystonejs/react-select\\n  */\\n  .Select {\\n    position: relative;\\n  }\\n  .Select,\\n  .Select div,\\n  .Select input,\\n  .Select span {\\n    -webkit-box-sizing: border-box;\\n    -moz-box-sizing: border-box;\\n    box-sizing: border-box;\\n  }\\n  .Select.is-disabled > .Select-control {\\n    background-color: #f6f6f6;\\n  }\\n  .Select.is-disabled .Select-arrow-zone {\\n    cursor: default;\\n    pointer-events: none;\\n  }\\n  .Select-control {\\n    background-color: #fff;\\n    border-color: #d9d9d9 #ccc #b3b3b3;\\n    border-radius: 4px;\\n    border: 1px solid #ccc;\\n    color: #333;\\n    cursor: default;\\n    display: table;\\n    height: 36px;\\n    outline: none;\\n    overflow: hidden;\\n    position: relative;\\n    width: 100%;\\n  }\\n  .Select-control:hover {\\n    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);\\n  }\\n  .is-searchable.is-open > .Select-control {\\n    cursor: text;\\n  }\\n  .is-open > .Select-control {\\n    border-bottom-right-radius: 0;\\n    border-bottom-left-radius: 0;\\n    background: #fff;\\n    border-color: #b3b3b3 #ccc #d9d9d9;\\n  }\\n  .is-open > .Select-control > .Select-arrow {\\n    border-color: transparent transparent #999;\\n    border-width: 0 5px 5px;\\n  }\\n  .is-searchable.is-focused:not(.is-open) > .Select-control {\\n    cursor: text;\\n  }\\n  .is-focused:not(.is-open) > .Select-control {\\n    border-color: #08c #0099e6 #0099e6;\\n    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 0 5px -1px rgba(0, 136, 204, 0.5);\\n  }\\n  .Select-placeholder {\\n    bottom: 0;\\n    color: #aaa;\\n    left: 0;\\n    line-height: 34px;\\n    padding-left: 10px;\\n    padding-right: 10px;\\n    position: absolute;\\n    right: 0;\\n    top: 0;\\n    max-width: 100%;\\n    overflow: hidden;\\n    text-overflow: ellipsis;\\n    white-space: nowrap;\\n  }\\n  .has-value > .Select-control > .Select-placeholder {\\n    color: #333;\\n  }\\n  .Select-value {\\n    color: #aaa;\\n    left: 0;\\n    padding: 8px 52px 8px 10px;\\n    position: absolute;\\n    right: -15px;\\n    top: 0;\\n    max-width: 100%;\\n    overflow: hidden;\\n    text-overflow: ellipsis;\\n    white-space: nowrap;\\n  }\\n  .has-value > .Select-control > .Select-value {\\n    color: #333;\\n  }\\n  .Select-input {\\n    height: 34px;\\n    padding-left: 10px;\\n    padding-right: 10px;\\n    vertical-align: middle;\\n  }\\n  .Select-input > input {\\n    background: none transparent;\\n    border: 0 none;\\n    box-shadow: none;\\n    cursor: default;\\n    display: inline-block;\\n    font-family: inherit;\\n    font-size: inherit;\\n    height: 34px;\\n    margin: 0;\\n    outline: none;\\n    padding: 0;\\n    -webkit-appearance: none;\\n  }\\n  .is-focused .Select-input > input {\\n    cursor: text;\\n  }\\n  .Select-control:not(.is-searchable) > .Select-input {\\n    outline: none;\\n  }\\n  .Select-loading-zone {\\n    cursor: pointer;\\n    display: table-cell;\\n    position: relative;\\n    text-align: center;\\n    vertical-align: middle;\\n    width: 16px;\\n  }\\n  .Select-loading {\\n    -webkit-animation: Select-animation-spin 400ms infinite linear;\\n    -o-animation: Select-animation-spin 400ms infinite linear;\\n    animation: Select-animation-spin 400ms infinite linear;\\n    width: 16px;\\n    height: 16px;\\n    box-sizing: border-box;\\n    border-radius: 50%;\\n    border: 2px solid #ccc;\\n    border-right-color: #333;\\n    display: inline-block;\\n    position: relative;\\n    vertical-align: middle;\\n  }\\n  .Select-clear-zone {\\n    -webkit-animation: Select-animation-fadeIn 200ms;\\n    -o-animation: Select-animation-fadeIn 200ms;\\n    animation: Select-animation-fadeIn 200ms;\\n    color: #999;\\n    cursor: pointer;\\n    display: table-cell;\\n    position: relative;\\n    text-align: center;\\n    vertical-align: middle;\\n    width: 17px;\\n  }\\n  .Select-clear-zone:hover {\\n    color: #D0021B;\\n  }\\n  .Select-clear {\\n    display: inline-block;\\n    font-size: 18px;\\n    line-height: 1;\\n  }\\n  .Select--multi .Select-clear-zone {\\n    width: 17px;\\n  }\\n  .Select-arrow-zone {\\n    cursor: pointer;\\n    display: table-cell;\\n    position: relative;\\n    text-align: center;\\n    vertical-align: middle;\\n    width: 25px;\\n    padding-right: 5px;\\n  }\\n  .Select-arrow {\\n    border-color: #999 transparent transparent;\\n    border-style: solid;\\n    border-width: 5px 5px 2.5px;\\n    display: inline-block;\\n    height: 0;\\n    width: 0;\\n  }\\n  .is-open .Select-arrow,\\n  .Select-arrow-zone:hover > .Select-arrow {\\n    border-top-color: #666;\\n  }\\n  .Select-menu-outer {\\n    border-bottom-right-radius: 4px;\\n    border-bottom-left-radius: 4px;\\n    background-color: #fff;\\n    border: 1px solid #ccc;\\n    border-top-color: #e6e6e6;\\n    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);\\n    box-sizing: border-box;\\n    margin-top: -1px;\\n    max-height: 200px;\\n    position: absolute;\\n    top: 100%;\\n    width: 100%;\\n    z-index: 1000;\\n    -webkit-overflow-scrolling: touch;\\n  }\\n  .Select-menu {\\n    max-height: 198px;\\n    overflow-y: auto;\\n  }\\n  .Select-option {\\n    box-sizing: border-box;\\n    color: #666666;\\n    cursor: pointer;\\n    display: block;\\n    padding: 8px 10px;\\n  }\\n  .Select-option:last-child {\\n    border-bottom-right-radius: 4px;\\n    border-bottom-left-radius: 4px;\\n  }\\n  .Select-option.is-focused {\\n    background-color: #f2f9fc;\\n    color: #333;\\n  }\\n  .Select-option.is-disabled {\\n    color: #cccccc;\\n    cursor: not-allowed;\\n  }\\n  .Select-noresults,\\n  .Select-search-prompt,\\n  .Select-searching {\\n    box-sizing: border-box;\\n    color: #999999;\\n    cursor: default;\\n    display: block;\\n    padding: 8px 10px;\\n  }\\n  .Select--multi .Select-input {\\n    vertical-align: middle;\\n    margin-left: 10px;\\n    padding: 0;\\n  }\\n  .Select--multi.has-value .Select-input {\\n    margin-left: 5px;\\n  }\\n  .Select-item {\\n    background-color: #f2f9fc;\\n    border-radius: 2px;\\n    border: 1px solid #c9e6f2;\\n    color: #08c;\\n    display: inline-block;\\n    font-size: 0.9em;\\n    margin-left: 5px;\\n    margin-top: 5px;\\n    vertical-align: top;\\n  }\\n  .Select-item-icon,\\n  .Select-item-label {\\n    display: inline-block;\\n    vertical-align: middle;\\n  }\\n  .Select-item-label {\\n    border-bottom-right-radius: 2px;\\n    border-top-right-radius: 2px;\\n    cursor: default;\\n    padding: 2px 5px;\\n  }\\n  .Select-item-label .Select-item-label__a {\\n    color: #08c;\\n    cursor: pointer;\\n  }\\n  .Select-item-icon {\\n    cursor: pointer;\\n    border-bottom-left-radius: 2px;\\n    border-top-left-radius: 2px;\\n    border-right: 1px solid #c9e6f2;\\n    padding: 1px 5px 3px;\\n  }\\n  .Select-item-icon:hover,\\n  .Select-item-icon:focus {\\n    background-color: #ddeff7;\\n    color: #0077b3;\\n  }\\n  .Select-item-icon:active {\\n    background-color: #c9e6f2;\\n  }\\n  .Select--multi.is-disabled .Select-item {\\n    background-color: #f2f2f2;\\n    border: 1px solid #d9d9d9;\\n    color: #888;\\n  }\\n  .Select--multi.is-disabled .Select-item-icon {\\n    cursor: not-allowed;\\n    border-right: 1px solid #d9d9d9;\\n  }\\n  .Select--multi.is-disabled .Select-item-icon:hover,\\n  .Select--multi.is-disabled .Select-item-icon:focus,\\n  .Select--multi.is-disabled .Select-item-icon:active {\\n    background-color: #f2f2f2;\\n  }\\n\\n}\\n\\[email protected] :global(Select-animation-fadeIn) {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\[email protected] :global(Select-animation-fadeIn) {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\[email protected] :global(Select-animation-spin) {\\n  to {\\n    transform: rotate(1turn);\\n  }\\n}\\[email protected] :global(Select-animation-spin) {\\n  to {\\n    -webkit-transform: rotate(1turn);\\n  }\\n}\\n\",\"@import url(normalize.css/normalize.css);\\[email protected] url(basscss-base-reset/index.css);\\n:global {\\n  /**\\n   * React Select\\n   * ============\\n   * Created by Jed Watson and Joss Mackison for KeystoneJS, http://www.keystonejs.com/\\n   * https://twitter.com/jedwatson https://twitter.com/jossmackison https://twitter.com/keystonejs\\n   * MIT License: https://github.com/keystonejs/react-select\\n  */\\n}\\n\\n:global .Select {\\n  position: relative;\\n}\\n\\n:global .Select,\\n:global .Select div,\\n:global .Select input,\\n:global .Select span {\\n  -webkit-box-sizing: border-box;\\n  -moz-box-sizing: border-box;\\n  box-sizing: border-box;\\n}\\n\\n:global .Select.is-disabled > .Select-control {\\n  background-color: #f6f6f6;\\n}\\n\\n:global .Select.is-disabled .Select-arrow-zone {\\n  cursor: default;\\n  pointer-events: none;\\n}\\n\\n:global .Select-control {\\n  background-color: #fff;\\n  border-color: #d9d9d9 #ccc #b3b3b3;\\n  border-radius: 4px;\\n  border: 1px solid #ccc;\\n  color: #333;\\n  cursor: default;\\n  display: table;\\n  height: 36px;\\n  outline: none;\\n  overflow: hidden;\\n  position: relative;\\n  width: 100%;\\n}\\n\\n:global .Select-control:hover {\\n  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);\\n}\\n\\n:global .is-searchable.is-open > .Select-control {\\n  cursor: text;\\n}\\n\\n:global .is-open > .Select-control {\\n  border-bottom-right-radius: 0;\\n  border-bottom-left-radius: 0;\\n  background: #fff;\\n  border-color: #b3b3b3 #ccc #d9d9d9;\\n}\\n\\n:global .is-open > .Select-control > .Select-arrow {\\n  border-color: transparent transparent #999;\\n  border-width: 0 5px 5px;\\n}\\n\\n:global .is-searchable.is-focused:not(.is-open) > .Select-control {\\n  cursor: text;\\n}\\n\\n:global .is-focused:not(.is-open) > .Select-control {\\n  border-color: #08c #0099e6 #0099e6;\\n  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 0 5px -1px rgba(0, 136, 204, 0.5);\\n}\\n\\n:global .Select-placeholder {\\n  bottom: 0;\\n  color: #aaa;\\n  left: 0;\\n  line-height: 34px;\\n  padding-left: 10px;\\n  padding-right: 10px;\\n  position: absolute;\\n  right: 0;\\n  top: 0;\\n  max-width: 100%;\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  white-space: nowrap;\\n}\\n\\n:global .has-value > .Select-control > .Select-placeholder {\\n  color: #333;\\n}\\n\\n:global .Select-value {\\n  color: #aaa;\\n  left: 0;\\n  padding: 8px 52px 8px 10px;\\n  position: absolute;\\n  right: -15px;\\n  top: 0;\\n  max-width: 100%;\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  white-space: nowrap;\\n}\\n\\n:global .has-value > .Select-control > .Select-value {\\n  color: #333;\\n}\\n\\n:global .Select-input {\\n  height: 34px;\\n  padding-left: 10px;\\n  padding-right: 10px;\\n  vertical-align: middle;\\n}\\n\\n:global .Select-input > input {\\n  background: none transparent;\\n  border: 0 none;\\n  box-shadow: none;\\n  cursor: default;\\n  display: inline-block;\\n  font-family: inherit;\\n  font-size: inherit;\\n  height: 34px;\\n  margin: 0;\\n  outline: none;\\n  padding: 0;\\n  -webkit-appearance: none;\\n}\\n\\n:global .is-focused .Select-input > input {\\n  cursor: text;\\n}\\n\\n:global .Select-control:not(.is-searchable) > .Select-input {\\n  outline: none;\\n}\\n\\n:global .Select-loading-zone {\\n  cursor: pointer;\\n  display: table-cell;\\n  position: relative;\\n  text-align: center;\\n  vertical-align: middle;\\n  width: 16px;\\n}\\n\\n:global .Select-loading {\\n  -webkit-animation: Select-animation-spin 400ms infinite linear;\\n  -o-animation: Select-animation-spin 400ms infinite linear;\\n  animation: Select-animation-spin 400ms infinite linear;\\n  width: 16px;\\n  height: 16px;\\n  box-sizing: border-box;\\n  border-radius: 50%;\\n  border: 2px solid #ccc;\\n  border-right-color: #333;\\n  display: inline-block;\\n  position: relative;\\n  vertical-align: middle;\\n}\\n\\n:global .Select-clear-zone {\\n  -webkit-animation: Select-animation-fadeIn 200ms;\\n  -o-animation: Select-animation-fadeIn 200ms;\\n  animation: Select-animation-fadeIn 200ms;\\n  color: #999;\\n  cursor: pointer;\\n  display: table-cell;\\n  position: relative;\\n  text-align: center;\\n  vertical-align: middle;\\n  width: 17px;\\n}\\n\\n:global .Select-clear-zone:hover {\\n  color: #D0021B;\\n}\\n\\n:global .Select-clear {\\n  display: inline-block;\\n  font-size: 18px;\\n  line-height: 1;\\n}\\n\\n:global .Select--multi .Select-clear-zone {\\n  width: 17px;\\n}\\n\\n:global .Select-arrow-zone {\\n  cursor: pointer;\\n  display: table-cell;\\n  position: relative;\\n  text-align: center;\\n  vertical-align: middle;\\n  width: 25px;\\n  padding-right: 5px;\\n}\\n\\n:global .Select-arrow {\\n  border-color: #999 transparent transparent;\\n  border-style: solid;\\n  border-width: 5px 5px 2.5px;\\n  display: inline-block;\\n  height: 0;\\n  width: 0;\\n}\\n\\n:global .is-open .Select-arrow,\\n:global .Select-arrow-zone:hover > .Select-arrow {\\n  border-top-color: #666;\\n}\\n\\n:global .Select-menu-outer {\\n  border-bottom-right-radius: 4px;\\n  border-bottom-left-radius: 4px;\\n  background-color: #fff;\\n  border: 1px solid #ccc;\\n  border-top-color: #e6e6e6;\\n  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);\\n  box-sizing: border-box;\\n  margin-top: -1px;\\n  max-height: 200px;\\n  position: absolute;\\n  top: 100%;\\n  width: 100%;\\n  z-index: 1000;\\n  -webkit-overflow-scrolling: touch;\\n}\\n\\n:global .Select-menu {\\n  max-height: 198px;\\n  overflow-y: auto;\\n}\\n\\n:global .Select-option {\\n  box-sizing: border-box;\\n  color: #666666;\\n  cursor: pointer;\\n  display: block;\\n  padding: 8px 10px;\\n}\\n\\n:global .Select-option:last-child {\\n  border-bottom-right-radius: 4px;\\n  border-bottom-left-radius: 4px;\\n}\\n\\n:global .Select-option.is-focused {\\n  background-color: #f2f9fc;\\n  color: #333;\\n}\\n\\n:global .Select-option.is-disabled {\\n  color: #cccccc;\\n  cursor: not-allowed;\\n}\\n\\n:global .Select-noresults,\\n:global .Select-search-prompt,\\n:global .Select-searching {\\n  box-sizing: border-box;\\n  color: #999999;\\n  cursor: default;\\n  display: block;\\n  padding: 8px 10px;\\n}\\n\\n:global .Select--multi .Select-input {\\n  vertical-align: middle;\\n  margin-left: 10px;\\n  padding: 0;\\n}\\n\\n:global .Select--multi.has-value .Select-input {\\n  margin-left: 5px;\\n}\\n\\n:global .Select-item {\\n  background-color: #f2f9fc;\\n  border-radius: 2px;\\n  border: 1px solid #c9e6f2;\\n  color: #08c;\\n  display: inline-block;\\n  font-size: 0.9em;\\n  margin-left: 5px;\\n  margin-top: 5px;\\n  vertical-align: top;\\n}\\n\\n:global .Select-item-icon,\\n:global .Select-item-label {\\n  display: inline-block;\\n  vertical-align: middle;\\n}\\n\\n:global .Select-item-label {\\n  border-bottom-right-radius: 2px;\\n  border-top-right-radius: 2px;\\n  cursor: default;\\n  padding: 2px 5px;\\n}\\n\\n:global .Select-item-label .Select-item-label__a {\\n  color: #08c;\\n  cursor: pointer;\\n}\\n\\n:global .Select-item-icon {\\n  cursor: pointer;\\n  border-bottom-left-radius: 2px;\\n  border-top-left-radius: 2px;\\n  border-right: 1px solid #c9e6f2;\\n  padding: 1px 5px 3px;\\n}\\n\\n:global .Select-item-icon:hover,\\n:global .Select-item-icon:focus {\\n  background-color: #ddeff7;\\n  color: #0077b3;\\n}\\n\\n:global .Select-item-icon:active {\\n  background-color: #c9e6f2;\\n}\\n\\n:global .Select--multi.is-disabled .Select-item {\\n  background-color: #f2f2f2;\\n  border: 1px solid #d9d9d9;\\n  color: #888;\\n}\\n\\n:global .Select--multi.is-disabled .Select-item-icon {\\n  cursor: not-allowed;\\n  border-right: 1px solid #d9d9d9;\\n}\\n\\n:global .Select--multi.is-disabled .Select-item-icon:hover,\\n:global .Select--multi.is-disabled .Select-item-icon:focus,\\n:global .Select--multi.is-disabled .Select-item-icon:active {\\n  background-color: #f2f2f2;\\n}\\n\\[email protected] :global(Select-animation-fadeIn) {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\n\\[email protected] :global(Select-animation-fadeIn) {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\n\\[email protected] :global(Select-animation-spin) {\\n  to {\\n    transform: rotate(1turn);\\n  }\\n}\\n\\[email protected] :global(Select-animation-spin) {\\n  to {\\n    -webkit-transform: rotate(1turn);\\n  }\\n}\\n\\n:global body {\\n  background-color: #FFFFFF;\\n}\\n\",\"@import 'normalize.css/normalize.css';\\[email protected] 'basscss-base-reset/index.css';\\n// @import 'basscss/css/basscss.css';\\n\\[email protected] './styles/Select.scss';\\n\\n:global {\\n  body {\\n    background-color: #FFFFFF;\\n  }\\n}\\n\"],\"sourceRoot\":\"webpack://\"}]);\n\n// exports\n; module.exports = exports.locals; module.exports._style = exports.toString()",
        "./src/common/pages/App/App.scss": "exports = module.exports = require(\"./../../../../node_modules/css-loader/lib/css-base.js\")();\n// imports\n\n\n// module\nexports.push([module.id, \".content___HT6CO {\\n  margin: 50px 0;\\n}\\n\", \"\", {\"version\":3,\"sources\":[\"/./src/common/pages/App/src/common/pages/src/common/pages/App/App.scss\"],\"names\":[],\"mappings\":\"AAAA;EACE,eAAe;CAChB\",\"file\":\"App.scss\",\"sourcesContent\":[\".content {\\n  margin: 50px 0; // for fixed navbar\\n}\\n\"],\"sourceRoot\":\"webpack://\"}]);\n\n// exports\nexports.locals = {\n\t\"content\": \"content___HT6CO\"\n};; module.exports = exports.locals; module.exports._style = exports.toString()",
        "./~/basscss-base-reset/index.css": "exports = module.exports = require(\"./../css-loader/lib/css-base.js\")();\n// imports\n\n\n// module\nexports.push([module.id, \"body {\\n  margin: 0;\\n}\\n\\nimg {\\n  max-width: 100%;\\n}\\n\\nsvg {\\n  max-height: 100%;\\n}\\n\", \"\", {\"version\":3,\"sources\":[\"/./node_modules/basscss-base-reset/node_modules/node_modules/basscss-base-reset/index.css\"],\"names\":[],\"mappings\":\"AACA;EAAO,UAAW;CAAE;;AACpB;EAAM,gBAAiB;CAAE;;AACzB;EAAM,iBAAkB;CAAE\",\"file\":\"index.css\",\"sourcesContent\":[\"\\nbody { margin: 0 }\\nimg { max-width: 100% }\\nsvg { max-height: 100% }\\n\\n\"],\"sourceRoot\":\"webpack://\"}]);\n\n// exports\n; module.exports = exports.locals; module.exports._style = exports.toString()",
        "./~/normalize.css/normalize.css": "exports = module.exports = require(\"./../css-loader/lib/css-base.js\")();\n// imports\n\n\n// module\nexports.push([module.id, \"/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */\\n/**\\n * 1. Set default font family to sans-serif.\\n * 2. Prevent iOS and IE text size adjust after device orientation change,\\n *    without disabling 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/**\\n * Remove default margin.\\n */\\nbody {\\n  margin: 0;\\n}\\n\\n/* HTML5 display definitions\\n   ========================================================================== */\\n/**\\n * Correct `block` display not defined for any HTML5 element in IE 8/9.\\n * Correct `block` display not defined for `details` or `summary` in IE 10/11\\n * and Firefox.\\n * Correct `block` display not defined for `main` in IE 11.\\n */\\narticle,\\naside,\\ndetails,\\nfigcaption,\\nfigure,\\nfooter,\\nheader,\\nhgroup,\\nmain,\\nmenu,\\nnav,\\nsection,\\nsummary {\\n  display: block;\\n}\\n\\n/**\\n * 1. Correct `inline-block` display not defined in IE 8/9.\\n * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.\\n */\\naudio,\\ncanvas,\\nprogress,\\nvideo {\\n  display: inline-block;\\n  /* 1 */\\n  vertical-align: baseline;\\n  /* 2 */\\n}\\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/**\\n * Address `[hidden]` styling not present in IE 8/9/10.\\n * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.\\n */\\n[hidden],\\ntemplate {\\n  display: none;\\n}\\n\\n/* Links\\n   ========================================================================== */\\n/**\\n * Remove the gray background color from active links in IE 10.\\n */\\na {\\n  background-color: transparent;\\n}\\n\\n/**\\n * Improve readability of focused elements when they are also in an\\n * active/hover state.\\n */\\na:active,\\na:hover {\\n  outline: 0;\\n}\\n\\n/* Text-level semantics\\n   ========================================================================== */\\n/**\\n * Address styling not present in IE 8/9/10/11, Safari, and Chrome.\\n */\\nabbr[title] {\\n  border-bottom: 1px dotted;\\n}\\n\\n/**\\n * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.\\n */\\nb,\\nstrong {\\n  font-weight: bold;\\n}\\n\\n/**\\n * Address styling not present in Safari and Chrome.\\n */\\ndfn {\\n  font-style: italic;\\n}\\n\\n/**\\n * Address variable `h1` font-size and margin within `section` and `article`\\n * contexts in Firefox 4+, Safari, and Chrome.\\n */\\nh1 {\\n  font-size: 2em;\\n  margin: 0.67em 0;\\n}\\n\\n/**\\n * Address styling not present in IE 8/9.\\n */\\nmark {\\n  background: #ff0;\\n  color: #000;\\n}\\n\\n/**\\n * Address inconsistent and variable font size in all browsers.\\n */\\nsmall {\\n  font-size: 80%;\\n}\\n\\n/**\\n * Prevent `sub` and `sup` affecting `line-height` in all browsers.\\n */\\nsub,\\nsup {\\n  font-size: 75%;\\n  line-height: 0;\\n  position: relative;\\n  vertical-align: baseline;\\n}\\n\\nsup {\\n  top: -0.5em;\\n}\\n\\nsub {\\n  bottom: -0.25em;\\n}\\n\\n/* Embedded content\\n   ========================================================================== */\\n/**\\n * Remove border when inside `a` element in IE 8/9/10.\\n */\\nimg {\\n  border: 0;\\n}\\n\\n/**\\n * Correct overflow not hidden in IE 9/10/11.\\n */\\nsvg:not(:root) {\\n  overflow: hidden;\\n}\\n\\n/* Grouping content\\n   ========================================================================== */\\n/**\\n * Address margin not present in IE 8/9 and Safari.\\n */\\nfigure {\\n  margin: 1em 40px;\\n}\\n\\n/**\\n * Address differences between Firefox and other browsers.\\n */\\nhr {\\n  box-sizing: content-box;\\n  height: 0;\\n}\\n\\n/**\\n * Contain overflow in all browsers.\\n */\\npre {\\n  overflow: auto;\\n}\\n\\n/**\\n * Address odd `em`-unit font size rendering in all browsers.\\n */\\ncode,\\nkbd,\\npre,\\nsamp {\\n  font-family: monospace, monospace;\\n  font-size: 1em;\\n}\\n\\n/* Forms\\n   ========================================================================== */\\n/**\\n * Known limitation: by default, Chrome and Safari on OS X allow very limited\\n * styling of `select`, unless a `border` property is set.\\n */\\n/**\\n * 1. Correct color not being inherited.\\n *    Known issue: affects color of disabled elements.\\n * 2. Correct font properties not being inherited.\\n * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.\\n */\\nbutton,\\ninput,\\noptgroup,\\nselect,\\ntextarea {\\n  color: inherit;\\n  /* 1 */\\n  font: inherit;\\n  /* 2 */\\n  margin: 0;\\n  /* 3 */\\n}\\n\\n/**\\n * Address `overflow` set to `hidden` in IE 8/9/10/11.\\n */\\nbutton {\\n  overflow: visible;\\n}\\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 Firefox, IE 8/9/10/11, and Opera.\\n * Correct `select` style inheritance in Firefox.\\n */\\nbutton,\\nselect {\\n  text-transform: none;\\n}\\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,\\nhtml input[type=\\\"button\\\"],\\ninput[type=\\\"reset\\\"],\\ninput[type=\\\"submit\\\"] {\\n  -webkit-appearance: button;\\n  /* 2 */\\n  cursor: pointer;\\n  /* 3 */\\n}\\n\\n/**\\n * Re-set default cursor for disabled elements.\\n */\\nbutton[disabled],\\nhtml input[disabled] {\\n  cursor: default;\\n}\\n\\n/**\\n * Remove inner padding and border in Firefox 4+.\\n */\\nbutton::-moz-focus-inner,\\ninput::-moz-focus-inner {\\n  border: 0;\\n  padding: 0;\\n}\\n\\n/**\\n * Address Firefox 4+ setting `line-height` on `input` using `!important` in\\n * the UA stylesheet.\\n */\\ninput {\\n  line-height: normal;\\n}\\n\\n/**\\n * It's recommended that you don't attempt to style these elements.\\n * Firefox's implementation doesn't respect box-sizing, padding, or width.\\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\\\"],\\ninput[type=\\\"radio\\\"] {\\n  box-sizing: border-box;\\n  /* 1 */\\n  padding: 0;\\n  /* 2 */\\n}\\n\\n/**\\n * Fix the cursor style for Chrome's increment/decrement buttons. For certain\\n * `font-size` values of the `input`, it causes the cursor style of the\\n * decrement button to change from `default` to `text`.\\n */\\ninput[type=\\\"number\\\"]::-webkit-inner-spin-button,\\ninput[type=\\\"number\\\"]::-webkit-outer-spin-button {\\n  height: auto;\\n}\\n\\n/**\\n * 1. Address `appearance` set to `searchfield` in Safari and Chrome.\\n * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.\\n */\\ninput[type=\\\"search\\\"] {\\n  -webkit-appearance: textfield;\\n  /* 1 */\\n  box-sizing: content-box;\\n  /* 2 */\\n}\\n\\n/**\\n * Remove inner padding and search cancel button in Safari and Chrome on OS X.\\n * Safari (but not Chrome) clips the cancel button when the search input has\\n * padding (and `textfield` appearance).\\n */\\ninput[type=\\\"search\\\"]::-webkit-search-cancel-button,\\ninput[type=\\\"search\\\"]::-webkit-search-decoration {\\n  -webkit-appearance: none;\\n}\\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/**\\n * 1. Correct `color` not being inherited in IE 8/9/10/11.\\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/**\\n * Remove default vertical scrollbar in IE 8/9/10/11.\\n */\\ntextarea {\\n  overflow: auto;\\n}\\n\\n/**\\n * Don't inherit the `font-weight` (applied by a rule above).\\n * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.\\n */\\noptgroup {\\n  font-weight: bold;\\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\\ntd,\\nth {\\n  padding: 0;\\n}\\n\", \"\", {\"version\":3,\"sources\":[\"/./node_modules/normalize.css/node_modules/node_modules/normalize.css/normalize.css\",\"/./node_modules/normalize.css/node_modules/normalize.css/normalize.css\"],\"names\":[],\"mappings\":\"AAAA,4EAA4E;AAE5E;;;;GAIG;AAEH;EACE,wBAAwB;EAAE,OAAO;EACjC,2BAA2B;EAAE,OAAO;EACpC,+BAA+B;EAAE,OAAO;CACzC;;AAED;;GAEG;AAEH;EACE,UAAU;CACX;;AAED;gFACgF;AAEhF;;;;;GAKG;AAEH;;;;;;;;;;;;;EAaE,eAAe;CAChB;;AAED;;;GAGG;AAEH;;;;EAIE,sBAAsB;EAAE,OAAO;EAC/B,yBAAyB;EAAE,OAAO;CACnC;;AAED;;;GAGG;AAEH;EACE,cAAc;EACd,UAAU;CACX;;AAED;;;GAGG;ACDH;;EDKE,cAAc;CACf;;AAED;gFACgF;AAEhF;;GAEG;AAEH;EACE,8BAA8B;CAC/B;;AAED;;;GAGG;AAEH;;EAEE,WAAW;CACZ;;AAED;gFACgF;AAEhF;;GAEG;AAEH;EACE,0BAA0B;CAC3B;;AAED;;GAEG;AAEH;;EAEE,kBAAkB;CACnB;;AAED;;GAEG;AAEH;EACE,mBAAmB;CACpB;;AAED;;;GAGG;AAEH;EACE,eAAe;EACf,iBAAiB;CAClB;;AAED;;GAEG;AAEH;EACE,iBAAiB;EACjB,YAAY;CACb;;AAED;;GAEG;AAEH;EACE,eAAe;CAChB;;AAED;;GAEG;AAEH;;EAEE,eAAe;EACf,eAAe;EACf,mBAAmB;EACnB,yBAAyB;CAC1B;;AAED;EACE,YAAY;CACb;;AAED;EACE,gBAAgB;CACjB;;AAED;gFACgF;AAEhF;;GAEG;AAEH;EACE,UAAU;CACX;;AAED;;GAEG;AAEH;EACE,iBAAiB;CAClB;;AAED;gFACgF;AAEhF;;GAEG;AAEH;EACE,iBAAiB;CAClB;;AAED;;GAEG;AAEH;EACE,wBAAwB;EACxB,UAAU;CACX;;AAED;;GAEG;AAEH;EACE,eAAe;CAChB;;AAED;;GAEG;AAEH;;;;EAIE,kCAAkC;EAClC,eAAe;CAChB;;AAED;gFACgF;AAEhF;;;GAGG;AAEH;;;;;GAKG;AAEH;;;;;EAKE,eAAe;EAAE,OAAO;EACxB,cAAc;EAAE,OAAO;EACvB,UAAU;EAAE,OAAO;CACpB;;AAED;;GAEG;AAEH;EACE,kBAAkB;CACnB;;AAED;;;;;GAKG;AAEH;;EAEE,qBAAqB;CACtB;;AAED;;;;;;GAMG;AAEH;;;;EAIE,2BAA2B;EAAE,OAAO;EACpC,gBAAgB;EAAE,OAAO;CAC1B;;AAED;;GAEG;AAEH;;EAEE,gBAAgB;CACjB;;AAED;;GAEG;AAEH;;EAEE,UAAU;EACV,WAAW;CACZ;;AAED;;;GAGG;AAEH;EACE,oBAAoB;CACrB;;AAED;;;;;;GAMG;AAEH;;EAEE,uBAAuB;EAAE,OAAO;EAChC,WAAW;EAAE,OAAO;CACrB;;AAED;;;;GAIG;AAEH;;EAEE,aAAa;CACd;;AAED;;;GAGG;AAEH;EACE,8BAA8B;EAAE,OAAO;EACvC,wBAAwB;EAAE,OAAO;CAClC;;AAED;;;;GAIG;AAEH;;EAEE,yBAAyB;CAC1B;;AAED;;GAEG;AAEH;EACE,0BAA0B;EAC1B,cAAc;EACd,+BAA+B;CAChC;;AAED;;;GAGG;AAEH;EACE,UAAU;EAAE,OAAO;EACnB,WAAW;EAAE,OAAO;CACrB;;AAED;;GAEG;AAEH;EACE,eAAe;CAChB;;AAED;;;GAGG;AAEH;EACE,kBAAkB;CACnB;;AAED;gFACgF;AAEhF;;GAEG;AAEH;EACE,0BAA0B;EAC1B,kBAAkB;CACnB;;AAED;;EAEE,WAAW;CACZ\",\"file\":\"normalize.css\",\"sourcesContent\":[\"/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */\\n\\n/**\\n * 1. Set default font family to sans-serif.\\n * 2. Prevent iOS and IE text size adjust after device orientation change,\\n *    without disabling user zoom.\\n */\\n\\nhtml {\\n  font-family: sans-serif; /* 1 */\\n  -ms-text-size-adjust: 100%; /* 2 */\\n  -webkit-text-size-adjust: 100%; /* 2 */\\n}\\n\\n/**\\n * Remove default margin.\\n */\\n\\nbody {\\n  margin: 0;\\n}\\n\\n/* HTML5 display definitions\\n   ========================================================================== */\\n\\n/**\\n * Correct `block` display not defined for any HTML5 element in IE 8/9.\\n * Correct `block` display not defined for `details` or `summary` in IE 10/11\\n * and Firefox.\\n * Correct `block` display not defined for `main` in IE 11.\\n */\\n\\narticle,\\naside,\\ndetails,\\nfigcaption,\\nfigure,\\nfooter,\\nheader,\\nhgroup,\\nmain,\\nmenu,\\nnav,\\nsection,\\nsummary {\\n  display: block;\\n}\\n\\n/**\\n * 1. Correct `inline-block` display not defined in IE 8/9.\\n * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.\\n */\\n\\naudio,\\ncanvas,\\nprogress,\\nvideo {\\n  display: inline-block; /* 1 */\\n  vertical-align: baseline; /* 2 */\\n}\\n\\n/**\\n * Prevent modern browsers from displaying `audio` without controls.\\n * Remove excess height in iOS 5 devices.\\n */\\n\\naudio:not([controls]) {\\n  display: none;\\n  height: 0;\\n}\\n\\n/**\\n * Address `[hidden]` styling not present in IE 8/9/10.\\n * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.\\n */\\n\\n[hidden],\\ntemplate {\\n  display: none;\\n}\\n\\n/* Links\\n   ========================================================================== */\\n\\n/**\\n * Remove the gray background color from active links in IE 10.\\n */\\n\\na {\\n  background-color: transparent;\\n}\\n\\n/**\\n * Improve readability of focused elements when they are also in an\\n * active/hover state.\\n */\\n\\na:active,\\na:hover {\\n  outline: 0;\\n}\\n\\n/* Text-level semantics\\n   ========================================================================== */\\n\\n/**\\n * Address styling not present in IE 8/9/10/11, Safari, and Chrome.\\n */\\n\\nabbr[title] {\\n  border-bottom: 1px dotted;\\n}\\n\\n/**\\n * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.\\n */\\n\\nb,\\nstrong {\\n  font-weight: bold;\\n}\\n\\n/**\\n * Address styling not present in Safari and Chrome.\\n */\\n\\ndfn {\\n  font-style: italic;\\n}\\n\\n/**\\n * Address variable `h1` font-size and margin within `section` and `article`\\n * contexts in Firefox 4+, Safari, and Chrome.\\n */\\n\\nh1 {\\n  font-size: 2em;\\n  margin: 0.67em 0;\\n}\\n\\n/**\\n * Address styling not present in IE 8/9.\\n */\\n\\nmark {\\n  background: #ff0;\\n  color: #000;\\n}\\n\\n/**\\n * Address inconsistent and variable font size in all browsers.\\n */\\n\\nsmall {\\n  font-size: 80%;\\n}\\n\\n/**\\n * Prevent `sub` and `sup` affecting `line-height` in all browsers.\\n */\\n\\nsub,\\nsup {\\n  font-size: 75%;\\n  line-height: 0;\\n  position: relative;\\n  vertical-align: baseline;\\n}\\n\\nsup {\\n  top: -0.5em;\\n}\\n\\nsub {\\n  bottom: -0.25em;\\n}\\n\\n/* Embedded content\\n   ========================================================================== */\\n\\n/**\\n * Remove border when inside `a` element in IE 8/9/10.\\n */\\n\\nimg {\\n  border: 0;\\n}\\n\\n/**\\n * Correct overflow not hidden in IE 9/10/11.\\n */\\n\\nsvg:not(:root) {\\n  overflow: hidden;\\n}\\n\\n/* Grouping content\\n   ========================================================================== */\\n\\n/**\\n * Address margin not present in IE 8/9 and Safari.\\n */\\n\\nfigure {\\n  margin: 1em 40px;\\n}\\n\\n/**\\n * Address differences between Firefox and other browsers.\\n */\\n\\nhr {\\n  box-sizing: content-box;\\n  height: 0;\\n}\\n\\n/**\\n * Contain overflow in all browsers.\\n */\\n\\npre {\\n  overflow: auto;\\n}\\n\\n/**\\n * Address odd `em`-unit font size rendering in all browsers.\\n */\\n\\ncode,\\nkbd,\\npre,\\nsamp {\\n  font-family: monospace, monospace;\\n  font-size: 1em;\\n}\\n\\n/* Forms\\n   ========================================================================== */\\n\\n/**\\n * Known limitation: by default, Chrome and Safari on OS X allow very limited\\n * styling of `select`, unless a `border` property is set.\\n */\\n\\n/**\\n * 1. Correct color not being inherited.\\n *    Known issue: affects color of disabled elements.\\n * 2. Correct font properties not being inherited.\\n * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.\\n */\\n\\nbutton,\\ninput,\\noptgroup,\\nselect,\\ntextarea {\\n  color: inherit; /* 1 */\\n  font: inherit; /* 2 */\\n  margin: 0; /* 3 */\\n}\\n\\n/**\\n * Address `overflow` set to `hidden` in IE 8/9/10/11.\\n */\\n\\nbutton {\\n  overflow: visible;\\n}\\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 Firefox, IE 8/9/10/11, and Opera.\\n * Correct `select` style inheritance in Firefox.\\n */\\n\\nbutton,\\nselect {\\n  text-transform: none;\\n}\\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 */\\n\\nbutton,\\nhtml input[type=\\\"button\\\"], /* 1 */\\ninput[type=\\\"reset\\\"],\\ninput[type=\\\"submit\\\"] {\\n  -webkit-appearance: button; /* 2 */\\n  cursor: pointer; /* 3 */\\n}\\n\\n/**\\n * Re-set default cursor for disabled elements.\\n */\\n\\nbutton[disabled],\\nhtml input[disabled] {\\n  cursor: default;\\n}\\n\\n/**\\n * Remove inner padding and border in Firefox 4+.\\n */\\n\\nbutton::-moz-focus-inner,\\ninput::-moz-focus-inner {\\n  border: 0;\\n  padding: 0;\\n}\\n\\n/**\\n * Address Firefox 4+ setting `line-height` on `input` using `!important` in\\n * the UA stylesheet.\\n */\\n\\ninput {\\n  line-height: normal;\\n}\\n\\n/**\\n * It's recommended that you don't attempt to style these elements.\\n * Firefox's implementation doesn't respect box-sizing, padding, or width.\\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 */\\n\\ninput[type=\\\"checkbox\\\"],\\ninput[type=\\\"radio\\\"] {\\n  box-sizing: border-box; /* 1 */\\n  padding: 0; /* 2 */\\n}\\n\\n/**\\n * Fix the cursor style for Chrome's increment/decrement buttons. For certain\\n * `font-size` values of the `input`, it causes the cursor style of the\\n * decrement button to change from `default` to `text`.\\n */\\n\\ninput[type=\\\"number\\\"]::-webkit-inner-spin-button,\\ninput[type=\\\"number\\\"]::-webkit-outer-spin-button {\\n  height: auto;\\n}\\n\\n/**\\n * 1. Address `appearance` set to `searchfield` in Safari and Chrome.\\n * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.\\n */\\n\\ninput[type=\\\"search\\\"] {\\n  -webkit-appearance: textfield; /* 1 */\\n  box-sizing: content-box; /* 2 */\\n}\\n\\n/**\\n * Remove inner padding and search cancel button in Safari and Chrome on OS X.\\n * Safari (but not Chrome) clips the cancel button when the search input has\\n * padding (and `textfield` appearance).\\n */\\n\\ninput[type=\\\"search\\\"]::-webkit-search-cancel-button,\\ninput[type=\\\"search\\\"]::-webkit-search-decoration {\\n  -webkit-appearance: none;\\n}\\n\\n/**\\n * Define consistent border, margin, and padding.\\n */\\n\\nfieldset {\\n  border: 1px solid #c0c0c0;\\n  margin: 0 2px;\\n  padding: 0.35em 0.625em 0.75em;\\n}\\n\\n/**\\n * 1. Correct `color` not being inherited in IE 8/9/10/11.\\n * 2. Remove padding so people aren't caught out if they zero out fieldsets.\\n */\\n\\nlegend {\\n  border: 0; /* 1 */\\n  padding: 0; /* 2 */\\n}\\n\\n/**\\n * Remove default vertical scrollbar in IE 8/9/10/11.\\n */\\n\\ntextarea {\\n  overflow: auto;\\n}\\n\\n/**\\n * Don't inherit the `font-weight` (applied by a rule above).\\n * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.\\n */\\n\\noptgroup {\\n  font-weight: bold;\\n}\\n\\n/* Tables\\n   ========================================================================== */\\n\\n/**\\n * Remove most spacing between table cells.\\n */\\n\\ntable {\\n  border-collapse: collapse;\\n  border-spacing: 0;\\n}\\n\\ntd,\\nth {\\n  padding: 0;\\n}\\n\",\"/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */\\n/**\\n * 1. Set default font family to sans-serif.\\n * 2. Prevent iOS and IE text size adjust after device orientation change,\\n *    without disabling 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/**\\n * Remove default margin.\\n */\\nbody {\\n  margin: 0;\\n}\\n\\n/* HTML5 display definitions\\n   ========================================================================== */\\n/**\\n * Correct `block` display not defined for any HTML5 element in IE 8/9.\\n * Correct `block` display not defined for `details` or `summary` in IE 10/11\\n * and Firefox.\\n * Correct `block` display not defined for `main` in IE 11.\\n */\\narticle,\\naside,\\ndetails,\\nfigcaption,\\nfigure,\\nfooter,\\nheader,\\nhgroup,\\nmain,\\nmenu,\\nnav,\\nsection,\\nsummary {\\n  display: block;\\n}\\n\\n/**\\n * 1. Correct `inline-block` display not defined in IE 8/9.\\n * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.\\n */\\naudio,\\ncanvas,\\nprogress,\\nvideo {\\n  display: inline-block;\\n  /* 1 */\\n  vertical-align: baseline;\\n  /* 2 */\\n}\\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/**\\n * Address `[hidden]` styling not present in IE 8/9/10.\\n * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.\\n */\\n[hidden],\\ntemplate {\\n  display: none;\\n}\\n\\n/* Links\\n   ========================================================================== */\\n/**\\n * Remove the gray background color from active links in IE 10.\\n */\\na {\\n  background-color: transparent;\\n}\\n\\n/**\\n * Improve readability of focused elements when they are also in an\\n * active/hover state.\\n */\\na:active,\\na:hover {\\n  outline: 0;\\n}\\n\\n/* Text-level semantics\\n   ========================================================================== */\\n/**\\n * Address styling not present in IE 8/9/10/11, Safari, and Chrome.\\n */\\nabbr[title] {\\n  border-bottom: 1px dotted;\\n}\\n\\n/**\\n * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.\\n */\\nb,\\nstrong {\\n  font-weight: bold;\\n}\\n\\n/**\\n * Address styling not present in Safari and Chrome.\\n */\\ndfn {\\n  font-style: italic;\\n}\\n\\n/**\\n * Address variable `h1` font-size and margin within `section` and `article`\\n * contexts in Firefox 4+, Safari, and Chrome.\\n */\\nh1 {\\n  font-size: 2em;\\n  margin: 0.67em 0;\\n}\\n\\n/**\\n * Address styling not present in IE 8/9.\\n */\\nmark {\\n  background: #ff0;\\n  color: #000;\\n}\\n\\n/**\\n * Address inconsistent and variable font size in all browsers.\\n */\\nsmall {\\n  font-size: 80%;\\n}\\n\\n/**\\n * Prevent `sub` and `sup` affecting `line-height` in all browsers.\\n */\\nsub,\\nsup {\\n  font-size: 75%;\\n  line-height: 0;\\n  position: relative;\\n  vertical-align: baseline;\\n}\\n\\nsup {\\n  top: -0.5em;\\n}\\n\\nsub {\\n  bottom: -0.25em;\\n}\\n\\n/* Embedded content\\n   ========================================================================== */\\n/**\\n * Remove border when inside `a` element in IE 8/9/10.\\n */\\nimg {\\n  border: 0;\\n}\\n\\n/**\\n * Correct overflow not hidden in IE 9/10/11.\\n */\\nsvg:not(:root) {\\n  overflow: hidden;\\n}\\n\\n/* Grouping content\\n   ========================================================================== */\\n/**\\n * Address margin not present in IE 8/9 and Safari.\\n */\\nfigure {\\n  margin: 1em 40px;\\n}\\n\\n/**\\n * Address differences between Firefox and other browsers.\\n */\\nhr {\\n  box-sizing: content-box;\\n  height: 0;\\n}\\n\\n/**\\n * Contain overflow in all browsers.\\n */\\npre {\\n  overflow: auto;\\n}\\n\\n/**\\n * Address odd `em`-unit font size rendering in all browsers.\\n */\\ncode,\\nkbd,\\npre,\\nsamp {\\n  font-family: monospace, monospace;\\n  font-size: 1em;\\n}\\n\\n/* Forms\\n   ========================================================================== */\\n/**\\n * Known limitation: by default, Chrome and Safari on OS X allow very limited\\n * styling of `select`, unless a `border` property is set.\\n */\\n/**\\n * 1. Correct color not being inherited.\\n *    Known issue: affects color of disabled elements.\\n * 2. Correct font properties not being inherited.\\n * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.\\n */\\nbutton,\\ninput,\\noptgroup,\\nselect,\\ntextarea {\\n  color: inherit;\\n  /* 1 */\\n  font: inherit;\\n  /* 2 */\\n  margin: 0;\\n  /* 3 */\\n}\\n\\n/**\\n * Address `overflow` set to `hidden` in IE 8/9/10/11.\\n */\\nbutton {\\n  overflow: visible;\\n}\\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 Firefox, IE 8/9/10/11, and Opera.\\n * Correct `select` style inheritance in Firefox.\\n */\\nbutton,\\nselect {\\n  text-transform: none;\\n}\\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,\\nhtml input[type=\\\"button\\\"],\\ninput[type=\\\"reset\\\"],\\ninput[type=\\\"submit\\\"] {\\n  -webkit-appearance: button;\\n  /* 2 */\\n  cursor: pointer;\\n  /* 3 */\\n}\\n\\n/**\\n * Re-set default cursor for disabled elements.\\n */\\nbutton[disabled],\\nhtml input[disabled] {\\n  cursor: default;\\n}\\n\\n/**\\n * Remove inner padding and border in Firefox 4+.\\n */\\nbutton::-moz-focus-inner,\\ninput::-moz-focus-inner {\\n  border: 0;\\n  padding: 0;\\n}\\n\\n/**\\n * Address Firefox 4+ setting `line-height` on `input` using `!important` in\\n * the UA stylesheet.\\n */\\ninput {\\n  line-height: normal;\\n}\\n\\n/**\\n * It's recommended that you don't attempt to style these elements.\\n * Firefox's implementation doesn't respect box-sizing, padding, or width.\\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\\\"],\\ninput[type=\\\"radio\\\"] {\\n  box-sizing: border-box;\\n  /* 1 */\\n  padding: 0;\\n  /* 2 */\\n}\\n\\n/**\\n * Fix the cursor style for Chrome's increment/decrement buttons. For certain\\n * `font-size` values of the `input`, it causes the cursor style of the\\n * decrement button to change from `default` to `text`.\\n */\\ninput[type=\\\"number\\\"]::-webkit-inner-spin-button,\\ninput[type=\\\"number\\\"]::-webkit-outer-spin-button {\\n  height: auto;\\n}\\n\\n/**\\n * 1. Address `appearance` set to `searchfield` in Safari and Chrome.\\n * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.\\n */\\ninput[type=\\\"search\\\"] {\\n  -webkit-appearance: textfield;\\n  /* 1 */\\n  box-sizing: content-box;\\n  /* 2 */\\n}\\n\\n/**\\n * Remove inner padding and search cancel button in Safari and Chrome on OS X.\\n * Safari (but not Chrome) clips the cancel button when the search input has\\n * padding (and `textfield` appearance).\\n */\\ninput[type=\\\"search\\\"]::-webkit-search-cancel-button,\\ninput[type=\\\"search\\\"]::-webkit-search-decoration {\\n  -webkit-appearance: none;\\n}\\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/**\\n * 1. Correct `color` not being inherited in IE 8/9/10/11.\\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/**\\n * Remove default vertical scrollbar in IE 8/9/10/11.\\n */\\ntextarea {\\n  overflow: auto;\\n}\\n\\n/**\\n * Don't inherit the `font-weight` (applied by a rule above).\\n * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.\\n */\\noptgroup {\\n  font-weight: bold;\\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\\ntd,\\nth {\\n  padding: 0;\\n}\\n\"],\"sourceRoot\":\"webpack://\"}]);\n\n// exports\n; module.exports = exports.locals; module.exports._style = exports.toString()"
      }
    }
    

    Error:

    Error: Cannot find module '-!./../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'
        at Function.Module._resolveFilename (module.js:337:15)
        at Function.Module._load (module.js:287:25)
        at Module.require (module.js:366:17)
        at require (module.js:385:17)
        at Object.<anonymous> (C:\Users\david\www\projects\STI\v3.1\assets\index.scss:3:11)
        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)
    
    Production:
    {"javascript":{"app":"/dist/app-0ccfdbf1209807330568.js"},"styles":{"app":"/dist/app-0ccfdbf1209807330568.css"},"assets":{"./assets/index.scss":"// removed by extract-text-webpack-plugin","./src/common/pages/App/App.scss":"// removed by extract-text-webpack-plugin\nmodule.exports = {\"content\":\"HT6COZRgtOuqJHvvUI2XY\"};"}}
    

    Error:

    C:\Users\david\www\projects\STI\v3.1\assets\index.scss:2
    });
    ^
    
    SyntaxError: Unexpected token }
        at exports.runInThisContext (vm.js:53:16)
        at Module._compile (module.js:404:25)
        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)
    

    OK

    Development:
    {
      "javascript": {
        "app": "http://localhost:8082/dist/app-2a2cf7557cd6e4a3d05d.js"
      },
      "styles": {},
      "assets": {
        "./assets/index.scss": {},
        "./src/common/pages/App/App.scss": {
          "content": "content___HT6CO"
        },
        "./~/basscss-base-reset/index.css": {},
        "./~/normalize.css/normalize.css": {}
      }
    }
    
    Production:
    {"javascript":{"app":"/dist/app-0ccfdbf1209807330568.js"},"styles":{"app":"/dist/app-0ccfdbf1209807330568.css"},"assets":{"./assets/index.scss":{},"./src/common/pages/App/App.scss":{"content":"HT6COZRgtOuqJHvvUI2XY"}}}
    
    opened by solcik 49
  • More than a single candidate module for core-js/object/assign

    More than a single candidate module for core-js/object/assign

    webpack-isomorphic-tools/plugin] [error]  More than a single candidate module was found in webpack stats for require()d path "[object Object]"
    [webpack-isomorphic-tools/plugin]   {
      "id": 304,
      "identifier": "/__redacted__/node_modules/babel-runtime/core-js/object/assign.js",
      "name": "./~/babel-runtime/core-js/object/assign.js",
      "index": 525,
      "index2": 525,
      "size": 94,
      "cacheable": true,
      "built": true,
      "optional": false,
      "prefetched": false,
      "chunks": [
        0
      ],
      "assets": [],
      "issuer": "/__redacted__/node_modules/babel-runtime/helpers/extends.js",
      "failed": false,
      "errors": 0,
      "warnings": 0,
      "reasons": [
        {
          "moduleId": 3,
          "moduleIdentifier": "/__redacted__/node_modules/babel-runtime/helpers/extends.js",
          "module": "./~/babel-runtime/helpers/extends.js",
          "moduleName": "./~/babel-runtime/helpers/extends.js",
          "type": "cjs require",
          "userRequest": "babel-runtime/core-js/object/assign",
          "loc": "3:21-67"
        },
        {
          "moduleId": 29,
          "moduleIdentifier": "/__redacted__/node_modules/react-bootstrap/lib/styleMaps.js",
          "module": "./~/react-bootstrap/lib/styleMaps.js",
          "moduleName": "./~/react-bootstrap/lib/styleMaps.js",
          "type": "cjs require",
          "userRequest": "babel-runtime/core-js/object/assign",
          "loc": "3:21-67"
        }
      ],
      "source": "module.exports = { \"default\": require(\"core-js/library/fn/object/assign\"), __esModule: true };"
    }
    [webpack-isomorphic-tools/plugin]   {
      "id": 838,
      "identifier": "/__redacted__/node_modules/isomorphic-style-loader/node_modules/babel-runtime/core-js/object/assign.js",
      "name": "./~/isomorphic-style-loader/~/babel-runtime/core-js/object/assign.js",
      "index": 734,
      "index2": 727,
      "size": 94,
      "cacheable": true,
      "built": true,
      "optional": false,
      "prefetched": false,
      "chunks": [
        0
      ],
      "assets": [],
      "issuer": "/__redacted__/node_modules/isomorphic-style-loader/lib/insertCss.js",
      "failed": false,
      "errors": 0,
      "warnings": 0,
      "reasons": [
        {
          "moduleId": 10,
          "moduleIdentifier": "/__redacted__/node_modules/isomorphic-style-loader/lib/insertCss.js",
          "module": "./~/isomorphic-style-loader/lib/insertCss.js",
          "moduleName": "./~/isomorphic-style-loader/lib/insertCss.js",
          "type": "cjs require",
          "userRequest": "babel-runtime/core-js/object/assign",
          "loc": "3:14-60"
        }
      ],
      "source": "module.exports = { \"default\": require(\"core-js/library/fn/object/assign\"), __esModule: true };"
    }
    /__redacted__/node_modules/webpack-isomorphic-tools/babel-transpiled-modules/plugin/write assets.js:369
                throw new Error('More than a single candidate module was found in webpack stats');
                ^
    
    Error: More than a single candidate module was found in webpack stats
        at /__redacted__/node_modules/webpack-isomorphic-tools/babel-transpiled-modules/plugin/write assets.js:369:10
        at resolver (/__redacted__/node_modules/webpack-isomorphic-tools/node_modules/require-hacker/babel-transpiled-modules/require hacker.js:131:17)
        at Function._module3.default._findPath (/__redacted__/node_modules/webpack-isomorphic-tools/node_modules/require-hacker/babel-transpiled-modules/require hacker.js:436:24)
        at Function.Module._resolveFilename (module.js:335:25)
        at Function._module3.default._resolveFilename (/__redacted__/node_modules/webpack-isomorphic-tools/node_modules/require-hacker/babel-transpiled-modules/require hacker.js:403:34)
        at Function.Module._load (module.js:287:25)
        at Module.require (module.js:366:17)
        at require (module.js:385:17)
        at Object.<anonymous> (!./../../node_modules/isomorphic-style-loader/lib/insertCss.js.webpack-module:4:15)
        at Module._compile (module.js:435:26)
        at Object._module3.default._extensions.(anonymous function) [as .webpack-module] (/__redacted__/node_modules/webpack-isomorphic-tools/node_modules/require-hacker/babel-transpiled-modules/require hacker.js:264:11)
        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> (/__redacted__/src/sass/LoginSignupForm.scss.webpack-module:4:21)
        at Module._compile (module.js:435:26)
        at Object._module3.default._extensions.(anonymous function) [as .webpack-module] (/__redacted__/node_modules/webpack-isomorphic-tools/node_modules/require-hacker/babel-transpiled-modules/require hacker.js:264:11)
        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 populate_assets (/__redacted__/node_modules/webpack-isomorphic-tools/babel-transpiled-modules/plugin/write assets.js:395:31)
        at Object.write_assets [as default] (/__redacted__/node_modules/webpack-isomorphic-tools/babel-transpiled-modules/plugin/write assets.js:63:2)
        at Compiler.<anonymous> (/__redacted__/node_modules/webpack-isomorphic-tools/babel-transpiled-modules/plugin/plugin.js:175:27)
        at Compiler.applyPlugins (/__redacted__/node_modules/webpack/node_modules/tapable/lib/Tapable.js:26:37)
        at Compiler.<anonymous> (/__redacted__/node_modules/webpack/lib/Compiler.js:193:12)
        at Compiler.emitRecords (/__redacted__/node_modules/webpack/lib/Compiler.js:282:37)
        at Compiler.<anonymous> (/__redacted__/node_modules/webpack/lib/Compiler.js:187:11)
        at /__redacted__/node_modules/webpack/lib/Compiler.js:275:11
    
    opened by sompylasar 39
  • require.context is not a function

    require.context is not a function

    I'm getting this error when running webpack-isomorphic-tools' withwebpack`

    /<dir>/src/content/index.js:9
    [1] var contents = require.context('./', true, /content\.yml$/);
    [1]                          ^
    [1] 
    [1] TypeError: require.context is not a function
    [1]     at Object.<anonymous> (index.js:2:28)
    [1]     at Module._compile (module.js:425:26)
    [1]     at loader (/<dir>/node_modules/babel-register/lib/node.js:134:5)
    [1]     at Object.require.extensions.(anonymous function) [as .js] (/<dir>/node_modules/babel-register/lib/node.js:144:7)
    [1]     at Module.load (module.js:356:32)
    [1]     at Function.Module._load (module.js:313:12)
    [1]     at Module.require (module.js:366:17)
    [1]     at require (module.js:385:17)
    [1]     at Object.<anonymous> (/<dir>/src/selectors/index.js:34:16)
    [1]     at Module._compile (module.js:425:26)
    

    How to I circumvent/fix this? the code:

    var contents = require.context('./', true, /content\.yml$/);
    

    is used to fetch the data files to an array on runtime. The directory tree looks like this:

    ├── content
    │   ├── index.js
    │   ├── 2013
    │   │   └── content.yml
    │   ├── 2014
    │   │   └── content.yml
    │   ├── 2015
    │   │   └── content.yml
    │   └── 2016
    │       └── content.yml
    
    opened by phun-ky 39
  • [error] asset not found: ./node_modules/font-awesome/css/font-awesome.css

    [error] asset not found: ./node_modules/font-awesome/css/font-awesome.css

    My build seems to function just fine and also these styles seem to be being included as the Icons are displaying... but I still get this error.

    [webpack-isomorphic-tools] [debug]  registering a require() hook for *.scss
    [webpack-isomorphic-tools] [debug]  registering a require() hook for *.styl
    [webpack-isomorphic-tools] [debug] require() hook fired for /Users/tomatao/Projects/app/node_modules/font-awesome/css/font-awesome.css
    [webpack-isomorphic-tools] [debug] requiring ./node_modules/font-awesome/css/font-awesome.css
    [webpack-isomorphic-tools] [error] asset not found: ./node_modules/font-awesome/css/font-awesome.css
    [webpack-isomorphic-tools] [debug] require() hook fired for /Users/tomatao/Projects/app/src/app/components/App.module.scss
    [webpack-isomorphic-tools] [debug] requiring ./src/app/components/App.module.scss
    

    The errored CSS file in question is being required by ./node_modules/react-fa and not by my source code.

    The paths listed in debug are correct and available.

    How can I deal with this warning appropriately?

    webpackConfig = {
      resolve: {
        root: paths.APP,
        modulesDirectories: [ 'node_modules', paths.STYLE ],
        extensions: [
          '', '.js', '.jsx', '.es6'
        ]
      },
    ...
      module: {
        loaders: [{
          test: /\.css$/, include: [/src\/app/, /awesome/],
          loader: ExtractTextPlugin.extract('style', 'css')
        }, {
    ...
      plugins: [
        new webpack.HotModuleReplacementPlugin(),
        new IsomorphicToolsPlugin(isomorphicConfig).development()
    ...
    
    opened by tomatau 36
  • (WIP) Fix multiple candidates collision for relative require paths

    (WIP) Fix multiple candidates collision for relative require paths

    Hi,

    this is an issue we hit with our codebase. We organize code like this:

    components/
      ComponentA/
        index.jsx
        assets/
          close.svg
      ComponentB/
        index.jsx
        assets/
          close.svg
    

    Both components import the SVG file as

    import buttonIcon from './assets/close.svg'
    

    These relative require paths are not found in parsed assets and require hook falls back to webpack-stats.json file. That in turn contains multiple entries of close.svg, so the build eventually fails with More than a single candidate module was found in webpack stats error.

    To fix this, I added a second pass to parsed assets matching with relative path resolved against the directory of module, where the require was found (module.filename).

    opened by msokk 34
  • Fix break: use regexp to detect css-loader

    Fix break: use regexp to detect css-loader

    v2.2.45 breaks my build absolutely!

    I use the following code to check out the differences between v2.2.44 and v2.2.45,

    const test1 = regex.test(module.name) && module.name.split('!')[0].indexOf('/~/css-loader') >= 0;
    const test2 = WebpackIsomorphicToolsPlugin.style_loader_filter(module, regex, options, log);
    if (test1 && !test2) {
      console.info('!!!!!!!!!!!!!Cannot MATCH', module.name);
    }
    

    Output:

    !!!!!!!!!!!!!Cannot MATCH ../~/css-loader?modules&sourceMap&importLoaders=1&localIdentName=[local]___[hash:base64:5]!../~/postcss-loader?sourcemap!./styles/index.css
    !!!!!!!!!!!!!Cannot MATCH ../~/css-loader?modules&sourceMap&importLoaders=1&localIdentName=[local]___[hash:base64:5]!../~/postcss-loader?sourcemap!./components/AppButton/index.css
    

    So I create this PR to fix this issue. It use regular expression to find the first loader, when the first loader is css-loader, true will be returned. @halt-hammerzeit

    opened by kouhin 33
  • Hack require in Webpack compilation

    Hack require in Webpack compilation

    I'm wondering if you ever discovered a way/created a plugin for Webpack to redefine requires for server compilation through Webpack. You suggested here https://github.com/halt-hammerzeit/webpack-isomorphic-tools/issues/7#issuecomment-149092151 the maybe this could be done through NormalModuleReplacement plugin.

    webpack-isomorphic-tools are working great for me if I pre-compile my files with Babel or use babel-register but I'm running into situations, such as on AWS Lambda, that I would prefer to make a server bundle with Webpack, then I don't have to zip all my client node_modules and upload them to Lambda.

    Wondering if there is an easy way to do this?

    opened by dtothefp 27
  • Question: Compilation of Server Bundle

    Question: Compilation of Server Bundle

    This is probably a stupid question but I'm just trying to figure out how to get up and running with this module as it looks very useful, but I'm confused at what the server method does. When I pass my ./server entry point as the second argument to new webpack-isomorphic-tools(), what is actually happening? Is it just relying on a webpack compilation of client code to have happened that output a webpack stat.json file into the root of the context directory, or does webpack-isomorphic-tools actually bundle (with webpack) and output my ./server bundle in a target=node webpack config environment. Sorry for my confusion but not sure I'm understanding the functionality of this module completely.

    opened by dtothefp 27
  • Can't access assets within a component

    Can't access assets within a component

    I would like to access assets from a dump component.

    Unfortunately it is not possible because assets is only available inside the Html component, that's where the subcomponents get render to string: https://github.com/halt-hammerzeit/webapp/blob/master/code/client/html.js#L39

    How can we access the assets property inside a sub component?

    Thank you very much!

    opened by davidecantoni 24
  • Webpack resolve extensions not working with SSR

    Webpack resolve extensions not working with SSR

    I have 2 set of files .custom.js and .js and I want the .custom.js take the higher precedence over the default .js extension. So I added in the module export part as

    resolve: { extensions: ['.custom.js', '.js', '.json'] }

    This is working fine in the client side.

    But after adding the webpack-isomorphic-tools code, it's always taking the default extension and the resolve extension is not getting considered.

    Can someone help me with this ?

    Webpack : 4.18.0 Webpack isomorphic tools: 3.0.6 Babel : @babel/core - 7.0.0

    opened by priya-unacademy 0
  • webpack-isomorphic-tools/plugin ReferenceError: window is not defined

    webpack-isomorphic-tools/plugin ReferenceError: window is not defined

    When I Run webpack --verbose --colors --display-error-details --config webpack/prod.config.js

    I Get the following error:

    [webpack-isomorphic-tools/plugin] [error] ReferenceError: window is not defined at !../../../node_modules/style-loader/addStyles.js.webpack-module:20:3 at !../../../node_modules/style-loader/addStyles.js.webpack-module:10:47 at module.exports (!../../../node_modules/style-loader/addStyles.js.webpack-module:48:68) at Object. (/home/user/~/style-loader!./~/css-loader!./~/less-loader!./src/components/MainStyle/MainStyle.scss.webpack-module:8:73)

    opened by hrasekh 11
  • Error: More than a single candidate module was found in webpack stats for require()d path

    Error: More than a single candidate module was found in webpack stats for require()d path "!!..

    The error was occured when I use require.ensure in my route.

    webpack-isomorphic-tools config:

    var path = require('path');
    var WebpackIsomorphicToolsPlugin = require('webpack-isomorphic-tools/plugin');
    
    module.exports = {
        debug: true,
        assets: {
            images: {
                extensions: ['png', 'jpg', 'gif', 'ico', 'svg'],
                // parser: WebpackIsomorphicToolsPlugin.url_loader_parser,
            },
            html: {
    			extension: 'html',
    		},
    		fonts: {
    			extensions: ['woff', 'woff2', 'eot', 'ttf'],
                // parser: WebpackIsomorphicToolsPlugin.url_loader_parser,
    		},
            styles: {
                extensions: ['css', 'scss'],
                // parser: WebpackIsomorphicToolsPlugin.url_loader_parser,
            },
        },
    
        // to resolve "TypeError: require.context is not a function" or "TypeError: require.ensure is not a function"
        patch_require: true,
    
        alias: {
            components: path.resolve(__dirname, './components'),
            actions: path.resolve(__dirname, './actions'),
            reducers: path.resolve(__dirname, './reducers'),
            comtainers: path.resolve(__dirname, './containers'),
            assets: path.resolve(__dirname, './assets')
        }
    };
    
    

    route config sample:

    export const FreeRecommend = {
        path: 'free-recommend',
        getComponent: function(nextState, callback){
            require.ensure([], (require) => {
                callback(null, require('../containers/free-recommend'));
            });
        }
    };
    
    export const ChargeRecommend = {
        path: 'charge-recommend',
        getComponent: function(nextState, callback){
            require.ensure([], (require) => {
                callback(null, require('../containers/charge-recommend'));
            });
        }
    };
    

    webpack config:

    module: {
            rules: [
                {
                    test: /\.js$/,
                    exclude: /node_modules/,
                    use: 'babel-loader?cacheDirectory'
                },
                {
                    test: webpack_isomorphic_tools_plugin.regular_expression('styles'),
                    exclude: /node_modules/,
                    // loaders: ["style", "css", "postcss", "sass"]
                    use: extractCSS.extract({
                        fallback: 'style-loader',
                        use: [
                            'css-loader?-autoprefixer',
                            'postcss-loader',
                            'sass-loader?outputStyle=expanded',
                        ]
                    })
                },
                {
                    test: webpack_isomorphic_tools_plugin.regular_expression('images'),
                    exclude: /node_modules/,
                    use: 'url-loader?limit=8192&name=img/[name].[hash].[ext]', // inline base64 URLs for <=8k images
                },
                {
                    test: webpack_isomorphic_tools_plugin.regular_expression('fonts'),
                    exclude: /node_modules/,
                    use: 'url-loader?limit=1024&name=fonts/[name].[hash].[ext]',
                },
                {
                    test: /\.json/,
                    use: 'json-loader',
                }
            ],
        },
    

    error code:

    [webpack-isomorphic-tools/plugin] [error] Error: More than a single candidate module was found in webpack stats for require()d path "!!../../../../node_modules/[email protected]/index.js?-autoprefixer!../../../../node_modules/[email protected]/index.js!../../../../node_modules/[email protected]/lib/loader.js?outputStyle=expanded!./style.scss". Enable "debug: true" flag in webpack-isomorphic-tools configuration for more info.
        at fail (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/babel-transpiled-modules/plugin/write assets.js:443:11)
        at /Users/fisher/myworkspace/frontend/node_modules/[email protected]/babel-transpiled-modules/plugin/write assets.js:451:5
        at resolver (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/babel-transpiled-modules/require hacker.js:140:17)
        at Function._module2.default._findPath (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/babel-transpiled-modules/require hacker.js:450:25)
        at Function.Module._resolveFilename (module.js:467:25)
        at Function._module2.default._resolveFilename (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/babel-transpiled-modules/require hacker.js:423:34)
        at Function.Module._load (module.js:417:25)
        at Module.require (module.js:497:17)
        at require (internal/module.js:20:19)
        at Object.<anonymous> (/Users/fisher/myworkspace/frontend/site/wechat-react/containers/wx-login/style.scss.webpack-module:5:15)
        at Module._compile (module.js:570:32)
        at Object._module2.default._extensions.(anonymous function) [as .webpack-module] (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/babel-transpiled-modules/require hacker.js:274:11)
        at Module.load (module.js:487:32)
        at tryModuleLoad (module.js:446:12)
        at Function.Module._load (module.js:438:3)
        at Module.require (module.js:497:17)
        at require (internal/module.js:20:19)
        at safe_require (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/babel-transpiled-modules/plugin/write assets.js:563:10)
        at populate_assets (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/babel-transpiled-modules/plugin/write assets.js:529:32)
        at write_assets (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/babel-transpiled-modules/plugin/write assets.js:74:2)
        at Compiler.<anonymous> (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/babel-transpiled-modules/plugin/plugin.js:213:45)
        at Compiler.applyPlugins (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/lib/Tapable.js:61:14)
        at Watching._done (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/lib/Compiler.js:100:16)
        at onCompiled (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/lib/Compiler.js:51:17)
        at /Users/fisher/myworkspace/frontend/node_modules/[email protected]/lib/Compiler.js:516:13
        at next (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/lib/Tapable.js:138:11)
        at Compiler.<anonymous> (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/lib/CachePlugin.js:62:5)
        at Compiler.applyPluginsAsyncSeries (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/lib/Tapable.js:142:13)
        at /Users/fisher/myworkspace/frontend/node_modules/[email protected]/lib/Compiler.js:513:10
        at Compilation.applyPluginsAsyncSeries (/Users/fisher/myworkspace/frontend/node_modules/[email protected]/lib/Tapable.js:131:46)
    
    opened by fisherw 2
  • [npm link] Possibly can't find NPM linked node_modules

    [npm link] Possibly can't find NPM linked node_modules

    Hi. I am experiencing exactly the issue with a npm link module, that you described in issue #38

    I don't know why but for some reason in Webpack the name for that module is strange.

    { "id": 284, "identifier": "/Users/siarheisemashka/Sites/webpack-isomorphic-tools-example/node_modules/react-shared-library-example/dist/components/MyStyledComponent.js", "name": "../react-shared-library-example/dist/components/MyStyledComponent.js", "index": 284, } It is in node_modules but at the same time it looks in a whole another folder. Do you have any npm link magic installed or anything else.

    Do you have any idea how to fix this problem?

    opened by maerzhase 2
Owner
Nikolay
Because GitHub, Inc. has abruptly banned my account (and all my libraries) without any notice, I had to move to GitLab: https://gitlab.com/catamphetamine
Nikolay
React JSX Renderer is a React Component for rendering JSX to React nodes.

React JSX Renderer A React Component for Rendering JSX. Description React JSX Renderer is a React Component for rendering JSX to React nodes.

Sho Kusano 40 Jan 9, 2022
High performance canvas> rendering for React components

react-canvas Introductory blog post React Canvas adds the ability for React components to render to <canvas> rather than DOM. This project is a work-i

Flipboard 12.9k Sep 22, 2022
Render HTML emails on the server with React.

Oy Emails, oy vey! Render HTML emails on the server with React. Oy provides functionality to: Validate props against email best-practices with Oy comp

Vivek Patel 835 Aug 25, 2022
[ Unmaintained due to raphamorim/react-ape ] React Renderer for low memory applications

React-TV · react-tv: React Renderer for low memory applications. react-tv-cli: React Packager for TVs. Currently under development. import React from

Raphael Amorim 2k Sep 22, 2022
Write PixiJS applications using React declarative style.

ReactPixiFiber – React Fiber renderer for PixiJS ReactPixiFiber is a JavaScript library for writing PixiJS applications using React declarative style

Michał Ochman 761 Sep 25, 2022
Build performant, native and cross-platform desktop applications with native React + powerful CSS like styling.🚀

React NodeGui Build performant, native and cross-platform desktop applications with React. ?? React NodeGUI is powered by React ⚛️ and Qt5 ?? which ma

NodeGui 6.1k Sep 19, 2022
React Native bridge for gtk desktop applications

react-gtk cross-platform react native desktop applications Please ★ this repo if you found it useful ★ ★ ★ Built with Node GTK Built by Silicon Hills

Clay Risser 269 Sep 25, 2022
Build native, high-performance, cross-platform applications through a React (and/or QML) syntax

ReactQML Build native, high-performance, cross-platform universal applications (desktop and mobile) through a React (and/or QML) syntax ?? NOTE: React

Long Nguyen 99 Aug 3, 2022
🇨🇭 A React renderer for Three.js (web and react-native)

react-three-fiber react-three-fiber is a React renderer for threejs on the web and react-native. npm install three react-three-fiber These demos are r

Poimandres 19.7k Sep 25, 2022
🍙 A minimal implementation of react-dom using react-reconciler

react-tiny-dom react-tiny-dom is a minimal implementation of react-dom as custom renderer using React 16 official Renderer API. The purpose of this pr

Jiayi Hu 451 Aug 11, 2022
🇨🇭 A React renderer for Three.js (web and react-native)

react-three-fiber react-three-fiber is a React renderer for threejs on the web and react-native. npm install three react-three-fiber These demos are r

Poimandres 19.7k Sep 30, 2022
React PDF viewer - A React component to view a PDF document

A React component to view a PDF document. It's written in TypeScript, and powered by React hooks completely.

React PDF Viewer 1.3k Sep 22, 2022
Osd-react-renderer - A custom React renderer for OpenSeadragon

osd-react-renderer A custom React renderer for OpenSeadragon viewer, built using

Lunit Inc. 3 Jan 24, 2022
🌈 React for interactive command-line apps

React for CLIs. Build and test your CLI output using components. Ink provides the same component-based UI building experience that React offers in the

Vadim Demedes 19.2k Sep 27, 2022
render React components to Sketch ⚛️💎

render React components to Sketch; tailor-made for design systems Quick-start ??‍ First, make sure you have installed Sketch version 50+, & a recent n

Airbnb 14.9k Sep 22, 2022
⚛️ A React renderer for Figma

React Figma A React renderer for Figma. Use React components as a source for your designs. ?? Compatible with react-native, react-sketchapp, react-pri

React Figma 2.1k Sep 27, 2022
Create amazing 360 and VR content using React

React 360 React 360 is a framework for the creation of interactive 360 experiences that run in your web browser. It pairs modern APIs like WebGL and W

Facebook Archive 8.7k Sep 23, 2022
⃝ A react null renderer

Nothing to see here ... Quite so. This package allows you to bring Reacts high-level component abstraction to Node, or wherever you need it. Why not m

Poimandres 640 Sep 27, 2022
📄 Create PDF files using React

React renderer for creating PDF files on the browser and server Lost? This package is used to create PDFs using React. If you wish to display existing

Diego Muracciole 11.2k Sep 23, 2022