title: Webpack & PostCSS Function Mixins are not visible
body: <p>Current project has react, webpack and postcss. The intention here is to create global mixin. I did try a few ways and came up to the following results.</p>
  
  <p><strong>First intention</strong><br></p>
  
  <pre><code>var postCSSConfig = [
    require('postcss-import'),
    // require('precss'),
    require('postcss-mixins')({
       aloha: {
         color: 'red'
       }
     }),
    require('postcss-cssnext')({
      browsers: ['last 2 versions', '&gt; 5%'],
    }),
  ]
  
  module.exports = postCSSConfig;
  </code></pre>
  
  <p>As a result using <code>@mixin aloha</code> across project or even not yet defined mixins doesn't affect stylesheets, neither gives an error.
  <br><br>
  <strong>Second intention.</strong></p>
  
  <pre><code>module.exports = {
    plugins: {
      'postcss-import': {},
      'postcss-mixins': {
        aloha: {
          color: 'red'
        }
      },
      'precss': {},
      'postcss-cssnext': {
      },
    },
  };
  </code></pre>
  
  <p>At this point it throws an error that <code>@mixin aloha</code> is not defined.
  <br><br>
  <strong>Webpack config</strong></p>
  
  <pre><code>const path = require('path'),
        webpack = require('webpack'),
        HtmlWebpackPlugin = require('html-webpack-plugin');
  
  module.exports = {
    entry: [
      'react-hot-loader/patch'
      'webpack-dev-server/client?http://localhost:8090',
      'webpack/hot/only-dev-server',
      './index.js'
    ],
    output: {
      filename: 'bundle.js',
      path: path.resolve(__dirname, 'build'),
      publicPath: '/'
    },
  
    context: path.resolve(__dirname, 'logic'),
    devtool: 'inline-source-map',
    devServer: {
      hot: true,
      contentBase: path.resolve(__dirname, 'build'),
      publicPath: '/',
      port: 8090
    },
  
    module: {
      rules: [
        {
          test: /\.js$/,
          use: [
            'babel-loader',
          ],
          exclude: /node_modules/
        },
        {
          test: /\.css$/,
          use: [
            'style-loader',
            'css-loader?modules',
            'postcss-loader',
          ],
        },
        {
          test: /\.(jpg|png|svg)$/,
          loader: 'url-loader',
          options: {
            limit: 25000,
          },
        },
        {
          test: /\.(ttf|eot|woff|woff2)$/,
          loader: 'file-loader',
          options: {
            name: 'fonts/[name].[ext]',
          },
        }
      ],
    },
  
    plugins: [
      new webpack.HotModuleReplacementPlugin(),
      new webpack.NamedModulesPlugin(),
      new HtmlWebpackPlugin({
        template: './index.template.html'
      })
    ],
  }
  </code></pre>
  
  <p>Can you please suggest what might me wrong?</p>