我使用css-loader和style-loader為我的CSS，但所有媒體查詢不起作用。我正在使用"webpack": "^3.4.1","css-loader": "^0.28.4"和"style-loader": "^0.18.2"。媒體查詢不能使用CSS /樣式加載器和Webpack3

這是我的WebPack配置：

const ExtractTextPlugin = require('extract-text-webpack-plugin')

rules: [{

test: /\.css$/,

use: [{

loader: 'style-loader'

}, {

loader: 'css-loader',

options: {

modules: true,

localIdentName: '[name]-[local]-[hash:base64:6]',

camelCase: true

}

}]

}]

...

plugins: [

new ExtractTextPlugin({

filename: 'style.[chunkhash:6].css',

allChunks: true

})

]

我的CSS文件是這樣的：

.container{

position: relative;

margin: 30px 15px;

padding: 50px 15px;

background: #fff;

}

@media (max-width: 768px) {

.container{

background: #fbfbfb;

}

}

，我在React代碼導入此CSS文件是這樣的：

import styles from './Component.css'

總結

以上是生活随笔為你收集整理的webpack3 css,媒体查询不能使用CSS /样式加载器和Webpack3的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。