如何添加阵营，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文件

回答

相关问题