Невозможно найти подходящий загрузчик для FlexboxGrid [ReactJS]

Question

В настоящее время я пытаюсь использовать эту библиотеку http://roylee0704.github.io/react-flexbox-grid/ с моим приложением JS.

В настоящее время у меня установлена ​​моя установка в Интернете, и я выполнил инструкции по Github для гибких сетей.

Однако каждый раз, когда я пытаюсь запустить свое приложение, я понимаю, что у меня нет соответствующего загрузчика для обработки этого типа файла. Я уже установил webpack css-loader, так что я не уверен, что еще мне не хватало.

webpack.config.js

var webpack = require('webpack'); 
var path = require('path'); 

var BUILD_DIR = path.resolve(__dirname, 'src/client/public'); 
var APP_DIR = path.resolve(__dirname, 'src/client/app'); 

var config = { 
    entry: APP_DIR + '/App.jsx', 
    output: { 
    path: BUILD_DIR, 
    filename: 'bundle.js' 
    }, 
    module : { 
    loaders : [ 
     { 
     test : /\.jsx?/, 
     include : APP_DIR, 
     loader : 'babel' 
     }, 
     { 
     test: /\.css$/, 
     loader: 'style!css!postcss', 
     include: path.join(__dirname, 'node_modules'), // this also includes flexboxgrid 
     exclude: /flexboxgrid/, // so we are excluding it 
     } 
    ] 
    } 
}; 

module.exports = config; 

Вот мой package.json

{ 
    "name": "PokerSiteMaterial", 
    "version": "1.0.0", 
    "description": "Poker Site", 
    "main": "index.js", 
    "scripts": { 
    "test": "echo \"Error: no test specified\" && exit 1", 
    "dev": "webpack -d --watch", 
    "build": "webpack -p" 
    }, 
    "author": "Kai Mou", 
    "license": "ISC", 
    "dependencies": { 
    "babel-core": "^6.9.1", 
    "babel-loader": "^6.2.4", 
    "babel-preset-es2015": "^6.9.0", 
    "babel-preset-react": "^6.5.0", 
    "react": "^15.1.0", 
    "react-dom": "^15.1.0", 
    "webpack": "^1.13.1" 
    }, 
    "devDependencies": { 
    "css-loader": "^0.23.1" 
    } 
} 

Answer 1

Попробуйте добавить это к вашему WebPack конфигурации, в дополнение к вашему текущему правилу CSS, как указано в реакции -flexbox-grid README ...

{ 
    test: /\.css$/, 
    loader: 'style!css?modules', 
    include: /flexboxgrid/, 
} 

Вы только сделали часть 1 процесса. Вы сказали свой загрузчик css, который использует postcss и поэтому несовместим с flexboxgrid, чтобы игнорировать flexboxgrid, но вы не создали для него новый загрузчик.

В основном, flexboxgrid необходимо загрузить только загрузчик css. Поскольку вы используете postcss, вам нужно сообщить основному правилу css, чтобы игнорировать его и добавить вышеприведенное правило для его обработки.