如何添加陣營，Flexbox的網格裝載機webpack.config.dev.js文件

利用創建反應的應用程序內創建如何添加陣營，Flexbox的網格裝載機webpack.config.dev.js文件

{ 
    test: /\.css$/,   
    loader: 'style!css?importLoaders=1!postcss'  
}

安裝陣營，Flexbox的網格使用下列基本網絡的數據包配置NPM命令

npm i -S react-flexbox-grid

安裝以下依賴性

npm i -D npm style-loader css-loader

它接縫陣營-Flexbox的網格未被拾取b y網絡加載器。我的問題在於如何將React-FlexBox-Grid添加到現有的css加載程序配置中。從陣營，Flexbox的網格文件https://github.com/roylee0704/react-flexbox-grid提出了兩種設置，我不知道該

1）

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

2）

{ 
    test: /\.css$/, 
    loader: 'style!css!postcss', 
    include: path.join(__dirname, 'node_modules'), // oops, this also includes flexboxgrid 
    exclude: /flexboxgrid/, // so we have to exclude it 
}

不知道如何如何添加裝載機沒有打破現有的工作配置。

來源

2016-12-21 Prabhakaran

如果你已經在你的webpack配置中有一個css加載器我建議你添加它如下。

假設你的CSS加載器看起來是這樣的：

{test: /(\.css)$/, loaders: ['style', 'css']}

然後嘗試添加Flexbox的電網裝載機這樣：

{test: /(\.css)$/, loaders: ['style', 'css', 'style!css?modules'], include: /flexboxgrid/}

我希望對您有所幫助。

來源

2016-12-21 14:55:34

感謝。我用{test：/\.css$/ loader：'style！css？modules'替換，包括：/ flexboxgrid /，}，現有的並且工作正常。任何方式我學會了如何從這個答案加載多個CSS加載器。 :) – Prabhakaran

嘗試這樣一個

{ test: /\.css$/, 
      loader: "style-loader!css-loader", 
      exclude: __dirname + './node_modules/react-flexbox-grid', 
}, 
{ 
      test: /(\.scss|\.css)$/, 
      loader: 'style!css?modules!sass', 
      include: __dirname + './node_modules/react-flexbox-grid', 
      exclude: /(node_modules)/ 
},

來源

2017-05-04 08:55:38

如何添加陣營，Flexbox的網格裝載機webpack.config.dev.js文件

回答

相關問題