babel-plugin-реагировать-css-модули не выводят стили

Question

Я использую babel-plugin-реагировать-css-modules, и кажется, что он создает className / styleName, но по какой-то причине он не выводит CSS, так что он может быть прочитан модулем.

Вот мое приложение: панель запуска

Я использую webpack 4.2.0/React 16 и использую конфигурацию babel в файле webpack.config, импортированном из отдельного файла конфигурации, поскольку вы не можете установить контекст в.babelrc.

вот конфиг вавилона:

    {
      loader: 'babel-loader',
       options: {
        'plugins': [
           'react-hot-loader/babel',
           'transform-runtime',
           'transform-object-rest-spread',
           'transform-class-properties',
           ['react-css-modules',
            {
              context: paths.javascript,
              'generateScopedName': '[name]__[local]___[hash:base64:5]',
              'filetypes': {
                '.scss': {
                  'syntax': 'postcss-scss',
                  'plugins': ['postcss-nested']
                }
               },
              'exclude': 'node_modules',
              'webpackHotModuleReloading': true
            }
          ]
        ],
        'presets': [
          'env',
          'react',
          'flow'
        ],
        'env': {
          'production': {
            'presets': ['react-optimize']
          }
        }
      }
    }

А вот и мой веб-пакет:

const webpack = require('webpack')
const path = require('path')

const paths = require('./webpack/config').paths
const outputFiles = require('./webpack/config').outputFiles
const rules = require('./webpack/config').rules
const plugins = require('./webpack/config').plugins
const resolve = require('./webpack/config').resolve
const IS_PRODUCTION = require('./webpack/config').IS_PRODUCTION
const IS_DEVELOPMENT = require('./webpack/config').IS_DEVELOPMENT

const devServer = require('./webpack/dev-server').devServer

const DashboardPlugin = require('webpack-dashboard/plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin')

// Default client app entry file
const entry = [
  'bootstrap-loader/extractStyles',
  path.join(paths.javascript, 'index.js')
]

plugins.push(
  // Creates vendor chunk from modules coming from node_modules folder
  new webpack.optimize.CommonsChunkPlugin({
    name: 'vendor',
    filename: outputFiles.vendor,
    minChunks (module) {
      const context = module.context
      return context && context.indexOf('node_modules') >= 0
    }
  }),
  // Builds index.html from template
  new HtmlWebpackPlugin({
    template: path.join(paths.source, 'index.html'),
    path: paths.build,
    filename: 'index.html',
    minify: {
      collapseWhitespace: true,
      minifyCSS: true,
      minifyJS: true,
      removeComments: true,
      useShortDoctype: true
    }
  })
)

if (IS_DEVELOPMENT) {
  // Development plugins
  plugins.push(
    // Enables HMR
    new webpack.HotModuleReplacementPlugin(),
    // Don't emmit build when there was an error while compiling
    // No assets are emitted that include errors
    new webpack.NoEmitOnErrorsPlugin(),
    // Webpack dashboard plugin
    new DashboardPlugin()
  )

  // In development we add 'react-hot-loader' for .js/.jsx files
  // Check rules in config.js
  rules[0].use.unshift('react-hot-loader/webpack')
  entry.unshift('react-hot-loader/patch')
}

// Webpack config
module.exports = {
  devtool: IS_PRODUCTION ? false : 'eval-source-map',
  context: paths.javascript,
  watch: IS_DEVELOPMENT,
  entry,
  output: {
    path: paths.build,
    publicPath: '/',
    filename: outputFiles.client
  },
  module: {
    rules
  },
  resolve,
  plugins,
  devServer
}

Если вы бежите npm start или же yarn start код будет скомпилирован и запущен, и вы сможете увидеть базовый макет приложения. Если вы проверите код реакции, вы увидите, что имя стиля отражается в компоненте. Чего не происходит, так это того, что стиль не выводится. Я не могу понять, почему.

Любая помощь приветствуется.